Cara Otomatis Menambah Atribute Alt Tag dan Title Gambar

Cara Otomatis Menambah Atribute Alt Tag dan Title Gambar

Cara Membuat untuk Menambah Atribute Alt Tag dan Title Otomatis pada Gambar - Apa kabarlangit? Saya harap teman semua dalam keadaan sehat semua, persoalanya kali ini saya akan membagikkan artikel tentang membuat gambar dengan Atribute Alt Title. tapi sebelum kita lebih lanjut membahas tentang optimasi gambar ini, apakah sobat sudah mengerti apa itu fungsi pemasangan Atribute alt title pada gambar konten blog kita? fungsinya ialah membuat judul pada tiap gambar agar postingan kita tetap terbaca pada penelusuran mode gambar di search enggine, selain itu fungsinya juga membuat blog kita lebih SEO dan lebih Valid HTML5 Jika anda tidak percaya, sobat bisa mencheknya di Chkme.com (silahkan lihat perbedaanya sebelum dan setelah pemasangan) .
Menambah atribute Alt Tag Title Gambar
1. Menambah Atribute Alt Title pada Gambar homepage
1. Masuk ke akun Blogger.com
2. Selanjutnya Klik Template => Edit HTML
3. Cari kode berikut ini :
expr:src='data:post.thumbnailUrl' dan expr:src='data:post.thumbnail'
4. Dan anda tambahkan kode expr:alt='data:post.title' dan expr:title='data:post.title'
Contoh :
<img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnailUrl' expr:title='data:post.title' expr:width='data:thumbnailSize'/>
Biasanya itu kode expr:src='data:post.thumbnailUrl' dan expr:src='data:post.thumbnail' jumlahnya lebih dari 1, silahkan Anda menambahkan kode expr:alt='data:post.title' dan expr:title='data:post.title' di setiap kode yang ada.

2. Menambahkan Attribute Alt Tag dan Title Tag Gambar Postingan
1. Buat artikel baru (postingan lama jugak tidak masalah)
2. Upload/masukkan gambar pada artikel
3. Lalu anda Klik gambar tersebut, dan akan muncul properties, lalu klik saja
4. Setelah Anda klik silahkan isi Title Tag dan Alt Tag untuk gambar tersebut, lalu klik OK

Atau bisa dengan menggunakan cara seperti ini :
<img alt='Judul Gambar' src='URL_Gambar' title='Judul Gambar'/>

3. Menambahkan Attribute Alt Tag dan Title Tag Gambar Otomatis
1. Masuk ke akun Blogger.com
2. Lalu Klik Template => Edit HTML
3. Dan Cari kode </body>
4. Selanjutnya anda Copy kode script dibawah ini dan Paste diatas kode </body>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.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:not([alt])").attr('title', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));$("img:not([alt])").attr('alt', filename.substring((filename.lastIndexOf('/'))+1, filename.lastIndexOf('.')));//]]></script>
5. Simpan Template Anda

Sekian artikel saya kali ini mengenai 3 Cara Menambah Atribute Alt Tag dan Title Gambar , Semoga bermanfaat untuk anda.

Saya merupakan anak ke 8 dari 8 bersaudara, berwatak keras kepala dan sangat mencintai dunia blogging serta desain.
"Love My Mom"

Previous
Next Post »