Membuat ALT dan Title Tag Otomatis Pada Gambar di Blog

Membuat ALT dan Title Tag Otomatis Pada Gambar di Blog - Sebelumya saya telah mengulas membuat Title Tag otomatis pada Judul Postingan, pada kesempatan kali ini saya akan mengulas kembali mengenali Title Tag. Title tag ini masih bersifat otomatis namun bukan lagi mengenai judul pada postingan tetapi pada Thumbnail atau gambar.

Pemasangan ALT dan Title Tag pada gambar menurut saya sangat bermanfaat  karen dengan memasang ALT memberikan teks alternatif pada gambar, maksudnya ketika gambar gagal meload atau gambar tidak muncul pada postingan maka akan ditampilkan ALT gambar tersebut, Dengan demikian tanpa melihat gambar pengunjungpun tahu apa yang sebenarnya ada pada gambar tersebut.

Dan Title pada gambar adalah memberikan judul pada gambar, Sehingga pengunjung dapat mengetahui informasi apa yang ingin disampaikan oleh penulis pada gambar tersebut. Perlu anda ketahui ketika gambar gagal meload atau gambar tidak muncul dengan memasang ALT dan Title Search Engine juga dapat membaca ALT dan Title tag pada gambar, ALT dan Titel Tag adalah salah satu cara untuk mengoptimalkan semua gambar pada postingan.

Membuat ALT dan Title Tag Otomatis Pada Gambar ini menggunakan jQuery, bagi anda yang tertarik memasang ALT dan Title Tag Otomatis Pada Gambar berikut ini langkah mudahnya :

Pemasangan ALT dan Title Tag Otomatis Pada Gambar di Blog

Silahkan anda masuk Editor template, selanjutnya dengan menggunakan ctrl+f anda cari kode </body>, kemudian anda terapkan kode dibawah ini diatasnya :

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<!-- ALT dan Title Tag by aak -->
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
 $('img').each(function(){
 var $img = $(this);
 var filename = $img.attr('src')
 $img.attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
 $img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
 });
});
//]]>
</script>

Note :

Apabila sebelumnya pada template anda sudah ada jQuery kode yang saya beri warna merah, anda tidak perlu lagi menerapkan kode tersebut.

Demikian Membuat ALT dan Title Tag Otomatis Pada Gambar di Blog, semoga bermanfaat!

Share this post