Loading...
ucapan
Tools Dahsyat untuk Membuat Konten Artikel Unik Tanpa Batas & Niche Apapun yang Anda Inginkan

Search, Edit, Spin, & Posting Ke Semua Blog Anda Cukup dari Satu Dashboard Saja.

Support WordPress, WordPress.com, Blogspot, Tumblr, & Twitter

Tools untuk Membuat Konten Artikel

Subsrcibe Ya.. Dan Tunggu Tutorial Lewat Video


Silahkan Pilih Warna Background Yang Cocok Buat Mata Anda


2015/04/23

Membuat Icon Otomatis Berdasarkan Label

Membuat Icon Otomatis Berdasarkan Label - Halo sobat, kali ini saya akan membagikan suatu artikel yang semoga bermanfaat bagi sobat semua, Icon label yang kita ingin buat merupakan Icon (Image, Video, Blogger, Wordpress) yang muncul pada sisi kiri judul posting, untuk menerapannya hanya cukup menambahkan Label pada Posting Blogger. Sebagai contoh silahkan lihat Demo :


Untuk cara pembuatannya sangat sederhana, silahkan ikuti cara Membuat Icon Otomatis Berdasarkan Label dibawah ini :

Membuat Icon Otomatis Berdasarkan Label
Icon Berdasarkan Label

Tambahkan kode dibawah ini diatas kode </head>


<script type='text/javascript'> 
function lebel_logo(etiqueta) {
imagenes = new Array();
imagenes[1] = &quot;<img src='https://lh3.googleusercontent.com/-cfmqvl_aeUU/T9RWXMUKLwI/AAAAAAAAAFk/KOMuyeM2gVs/s84/image.png' title='Image'/>&quot;
imagenes[2] = &quot;<img src='https://lh3.googleusercontent.com/-spKt-dCuWDw/T9RZq64fDoI/AAAAAAAAAGA/h25ovtaAfsY/s84/video.png' title='Video'/>&quot;
imagenes[3] = &quot;<img src='https://lh6.googleusercontent.com/-JqMoz73EsdI/T9RZpQdYL7I/AAAAAAAAAGE/Xh3kRqQkQZ8/s84/audio.png' title='Music'/>&quot;
imagenes[4] = &quot;<img src='https://lh5.googleusercontent.com/-qvAfIbwadro/T9RZqVD3stI/AAAAAAAAAF4/U2A6BssgJQU/s84/quote.png' title='Quote'/>&quot;
imagenes[5] = &quot;<img src='https://lh5.googleusercontent.com/-ZGIdlq5LlUM/T9RZpvwahHI/AAAAAAAAAFw/B94_LHUkup8/s84/note.png' title='Note'/>&quot;
imagenes[6] = &quot;<img src='https://lh6.googleusercontent.com/-ZgQr4FMDm_I/T9ca1xRfDSI/AAAAAAAAADM/4GZTJjeHlwo/s84/Blogger.png' title='Blogger'/>&quot;
imagenes[7] = &quot;<img src='https://lh5.googleusercontent.com/-JPLBQx4F72Y/T9ca51o-Y0I/AAAAAAAAADU/aaUDQVk_EmM/s84/wp.png' title='Wordpress'/>&quot;
if (etiqueta == &quot;Image&quot;)
{document.write(imagenes[1]);}
if (etiqueta == &quot;Video&quot;)
{document.write(imagenes[2]);} 
if (etiqueta == &quot;Music&quot;)
{document.write(imagenes[3]);} 
if (etiqueta == &quot;Quote&quot;)
{document.write(imagenes[4]);} 
if (etiqueta == &quot;Blog&quot;)
{document.write(imagenes[5]);} 
if (etiqueta == &quot;Blogspot&quot;)
{document.write(imagenes[6]);} 
if (etiqueta == &quot;Wordpress&quot;)
{document.write(imagenes[7]);} 
}
</script>

Kode diatas terdapat Label » "Image, Music, Quote, Note, Blogger, dan Wordpress"

Masukkan kode CSS dibawah ini diatas kode ]]></b:skin>



.format-icon{
position: absolute;
display:block;
margin:0px 0px 0px -62px;
padding:0px;
border:0px;
}

Sekarang cari kode <div class='post-header'> kemudian tambahkan kode dibawah ini tepat diatasnya :


<b:loop values='data:post.labels' var='label'>
<a class='format-icon' expr:href='data:label.url' rel='tag'>
<script type='text/javascript'>lebel_logo(&quot;<data:label.name/>&quot;);</script>
</a>
</b:loop>

Selesai dan simpan template.


Cara penggunaannya cukup tembahkan label dengan menggunakan salah satu dari kata "Image, Music, Quote, Note, Blogger, atau Wordpress", jika sobat ingin mengganti label tadi, bisa sobat ganti Image, Music, Quote DLL, sesuai keinginan atau Label pada blog sobat.


Itu saja yang bisa saya berikan, semoga bermanfaat untuk sobat semua :)

Pengelola Blog : ABDUL WAHAB

Judul : Membuat Icon Otomatis Berdasarkan Label
Ditulis oleh :Blog Shiro pada hari 2015/04/23
Rating Blog : 5 dari 5
Terima kasih sudah membaca artikel tentang Membuat Icon Otomatis Berdasarkan Label
Kalian boleh menyebar luaskannya atau mengcopy paste-nya jika artikel ini sangat bermanfaat bagi Blog dan teman-teman kalian.
Namun jangan lupa harap memberikan link aktif dofollow ke URL
https://fajriandaviar.blogspot.com/2013/11/membuat-icon-otomatis-berdasarkan-label.html
Dan Terima kasih sekali lagi atas kunjungannya.

Kritik dan saran atau apapun bisa kalian sampaikan melalui kotak komentar.
Dan mohon maaf jika komentar atau pertanyaan tidak bisa cepat saya respon,
karena Saya tidak selalu online dikarenakan sibuk.

Title : Membuat Icon Otomatis Berdasarkan Label
Description : Membuat Icon Otomatis Berdasarkan Label - Halo sobat, kali ini saya akan membagikan suatu artikel yang semoga bermanfaat bagi sobat semua...

3 komentar

Keren sob tutornya :)

Sayang, gambarnya susah dapat di google :D

Keren Artikelnya, izin sedot dulu :D

Berkomentarlah dengan bijak dan sopan, Dilarang menggunakan Link Aktif, Link Mati, Promo, dll.
Dan Berbagilah Jawaban atas apa kesulitan yang sobat-sobat lainnya dapatkan.
Mohon maaf jika ADA komentar atau pertanyaan tidak bisa cepat saya respon,
DIkarenakan Saya tidak selalu online selama 24 Jam.