Selasa, 31 Januari 2017

Cara Membuat Gambar Di Postingan Menjadi Seo Friendly Secara Otomatis

Tags

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 komentar

Kalau masukkin kodenya lewat html mode harus dikompres/diparse gan

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


EmoticonEmoticon