Informasi Seputar Blog dan Tutorial

Cara Membuat Gambar Di Postingan Menjadi Seo Friendly Secara Otomatis

Cara Membuat Gambar Di Potingan Menjadi Seo Friendly - Membuat gambar menjadi seo friendly sangatlah penting. Optimasi gambar/foto di postingan blog bertujuan supaya blog kita menjadi seo friendly. Jika gambar anda menjadi seo friendly maka artikel anda bisa diindex secara otomatis oleh google. Selain dengan cara ini masih ada cara lain yaitu memberikan deskripsi di setiap gmbar yang akan kita posting. Namun,cara ini tergolong ribet ya karena kta harus memberikan deskripsi pada setiap gambar.
Dengan cara yang akan saya berikan ini,maka kita tidak perlu mengisi deskripsi gambar karena deskripsi gambar sudah akan diisi secara otomatis sama seperti judul artikel yang kita buat. Dengan ini kita tidak perlu repot-repot lagi untuk mengisi deskripsi gambar yang mau dipublikasikan.
Kenapa harus optimasi gambar supaya SEO?
Hampir semua pengguna mesin pencari 'google' lebih sering mencari gambar di pencarian,hal ini kita manfaatkan untuk meningkatkan visitor blog kita. Mereka mungkin lebih suka melihat gambar/foto terlebih dahulu daripada mencari situs/blog. Berikut caranya :

Langkah 1
Silakan masuk dasbor blog sobat,buka menu Template → pilih Edit HTML 




Langkah 2
Silakan salin dan letakkan kode Javascript dibawah ini tepat diatas 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 lalu klik Simpan

Selesai,semua gambar yang akan anda postingkan akan menjadi seo friendly dan deskripsinya sudah akan diisi secara otomatis sesuai judul. Itulah tutorial yang bisa saya bagikan,semoga bisa bermanfaat. See you next article!

4 comments:

  1. Replies
    1. Kalau masukkin kodenya lewat html mode harus dikompres/diparse gan

      Delete
  2. makasih tutorialnya gan...BTW judul typo/ emang yang betul potingan?

    ReplyDelete