Alternatif Membuat alt dan title tag Otomatis untuk Image Blogger

Hal ini dilakukan agar gambar yang ada di halaman blog Anda terindeks secara otomatis oleh search engine seperti google sehingga Anda tidak direpotkan dengan menambahkan secara manual (menambahkan deskripsi pada <img alt="description of the image" height="125" scr="/image.png" width="125" /> saat memposting gambar).

Cara tersebut bisa dikatakan merepotkan. Dengan cara otomatis ini setiap gambar mempunyai deskripsi sama dengan judul gambarnya. Oleh karena itu, Anda harus memberi nama yang sesuai untuk setiap gambar yang akan diposting.

Kenapa harus Optimasi Gambar Agar SEO Secara Otomatis?

Karena gambar pada halaman blog merupakan salah satu media yang dapat digunakan untuk trafik pada search engine karena sebagian pengguna internet sangat suka mencari atau sekedar browsing untuk melihat-lihat gambar.

Berikut cara memasang kode SEO otomatis pada gambar

Cari kode </body> pada template blog Anda, kemudian salin dan pastekan kode di bawah ini tepat di atas kode </body>


<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
$('img').each(function(){
var $img = $(this);
var filename = $img.attr('src')
$img.attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));
});
});
//]]>
</script>
<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('.')));
});
});
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
var scrollTimer = null;
$(window).scroll(function() {
   var viewportHeight = $(this).height(),
       scrollbarHeight = viewportHeight / $(document).height() * viewportHeight,
       progress = $(this).scrollTop() / ($(document).height() - viewportHeight),
       distance = progress * (viewportHeight - scrollbarHeight) + scrollbarHeight / 2 - $('#scroll').height() / 2;
    $('#scroll')
        .css('top', distance)
        .text(' (' + Math.round(progress * 100) + '%)')
        .fadeIn(100);
    if (scrollTimer !== null) {
        clearTimeout(scrollTimer);
    }
    scrollTimer = setTimeout(function() {
        $('#scroll').fadeOut();
    }, 1500);
});
//]]>
</script>

Selanjutnya simpan template.

Setiap gambar blog yang Anda pasang di suatu artikel secara otomatis akan mempunyai kode SEO friendly.

Semoga bermanfaat.

DaltonNet

Alternatif Membuat alt dan title tag Otomatis untuk Image Blogger

Related Posts