Minggu, 13 Oktober 2013

Cara Memasang Title dan Alt Text pada Gambar Secara Otomatis

Cara mudah memasang title dan alt text otomatis pada gambar di blog

Cara Memasang Title dan Alt Text Secara Otomatis – Seperti yang pernah saya bahas dalam artikel sebelumnya, title dan alt text (terkadang ada yang menyebutnya title dan alt tag) merupakan salah satu faktor penting dalam SEO. Title dan alt tag berperan dalam mendeskripsikan gambar atau link kepada search engine. Jadi, semakin bagus Anda membuat title dan alt text, maka semakin besar pula peluang blog Anda mendapatkan peringkat yang lebih baik di mesin pencari, dan semakin bagus pula kualitas SEO blog Anda. Untuk informasi yang lebih detail, silahkan baca 2 artikel berikut yang membahas title dan alt text, beserta cara pemasangannya.


Nah, kali ini saya akan membahas bagaimana cara memasang title dan alt text otomatis pada gambar. Dengan pemasangan script ini, Anda tidak perlu repot membuat title dan alt text satu per satu, karena script ini akan menjadikan nama gambar Anda sebagai title dan alt text gambar yang bersangkutan. Oke, to the point saja. Lihat script title dan alt tag otomatis berikut ini:

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>
<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>

Jangan langsung pusing begitu melihat script title dan alt tag otomatis diatas. Cara memasangnya tidak serumit script diatas. Berikut ini langkah – langkahnya :
  1. Seperti biasa, buka akun Blogger Anda, dan masuk ke menu Template.
  2. Buatlah sebuah backup dari template blog Anda (untuk berjaga – jaga), lalu klik Edit HTML.
  3. Cari kode </body> (gunakan CTRL+F), dan pastekan kode/script diatas SEBELUM/DIATAS KODE </body>.
  4. Terakhir, klik Simpan template.
Selamat mencoba. Jangan lupa untuk meninggalkan komentar di kotak komentar, dan klik juga tombol Google + dibawah. Terima kasih, dan salam blogger!

Suka Artikel Ini? Yang Share Dapat Pahala Lho... Trims!

11 komentar:

  1. infonya keren sob,,,, terimakasih berbagi artikelnya,,,
    izin praktek ya sob,,,

    bila berkenan kunjungi blog kecil ane sob ,,, terima kasih

    BalasHapus
  2. Permisi gan, mau kopi skripnya, mau di pasang di blog ane :)

    BalasHapus
  3. gan setelah di pasang ada tulisan begini Open quote is expected for attribute "picture" associated with an element type "script".
    langkah yang di lakukan apa gan?

    BalasHapus
    Balasan
    1. @Slamet Raharjo : Oh, mungkin agan salah tempat saat memasang kodenya. Pastikan kode tersebut dipasang sebelum / diatas kode </body>. Alternatif lain, coba pasang dibawah atau setelah kode <body>. Selamat mencoba, dan terima kasih atas kunjungan dan komentarnya... :)

      Hapus
  4. Berarti kita harus menamai gambar kita dengan kata kunci ya..? makasih atas infonya...

    BalasHapus
  5. @Ani Savia : Iya gan. Selamat mencoba, dan terima kasih atas kunjungan dan komentarnya... :)

    BalasHapus
  6. itu fungsinya buat ap y gan...???
    maklum newbie

    BalasHapus
  7. ini yang kucari tutorialnya gan...hehehe

    BalasHapus
  8. makasih gan tutornya...kunjungi balik gan

    BalasHapus
  9. Ijin coba gan tapi kalo blo kita udah ada jquerynya apa harus di pasang juga , takut bentrok ?

    BalasHapus

Kurang mengerti dengan artikel diatas, ingin menanyakan sesuatu yang kurang jelas atau ingin meninggalkan jejak? Silakan gunakan Kotak Komentar!. Jika Anda ingin meletakkan kode HTML pada kotak komentar, gunakan tools HTML Parser But, remember! Berkomentarlah dengan bahasa yang sopan, tanpa iklan, spam politik, porno, dan hal - hal negatif lainnya. Terima kasih!

Internet Blogs