News Update :

Cara Menampilkan Icon Label Posting

Diposting oleh : Posted on Minggu, 21 Oktober 2012 - 12:34 AM with No comments


Menampilkan Icon Label Posting Tertentu? Apa maksudnya dan seperti apa hasilnya apabila diterapkan kelihatannya cukup menarik untuk dibahas.Ya sebuah tips sederhana untuk blog tetapi cukup menarik untuk diterapkan, Icon label ini akan muncul pada postingan tertentu berdasarkan Label yang di kehendaki - Lihat Demo Disini juga ada Lihat!


Contoh sederhana saja posting saya ini memiliki kategori "Blog Tutorial" dan saya ingin menampilkan sebuah Icon label akan tetapi Icon label tersebut hanya akan muncul pada semua posting dengan kategori "Blog Tutorial" dan tidak akan muncul dilain kategori, akan tetapi diluar kategori "Blog Tutorial" Saya memiliki Kategori "Software" dan juga"Komputer" dll.
Q : Apakah bisa juga diberi ikon lebel?
A : Ya kita bisa menambahkan lebih dari 1 atau 2 atau bahkan semua label/kategori bisa kita beri ikon sendiri-sendiri!

Berikut untuk menampilkan Icon Pada postingan tertentu! Tapi sebaiknya siapkan dulu gambar atau ikon yang akan digunakan sesuai kategori yang dimaksud.
1. Masuk ke Dasboard klik tanda anak panah lalu klik "Template"
2. Klik "Edit HTML"  >> Klik  "Proceed"
3. Klik "Expand Widget Template"
4. Cari kode <div class='post-header'> (semua template blogger memiliki kode ini) kemudian letakkan kode berikut tepat dibawahnya.
DEBBY

<div style='position:absolute;top:0px;right:0px;z-index;200;'>
<!-- BATAS AWAL -->
<b:loop values='data:post.labels' var='label'> 
<b:if cond='data:label.name == &quot;Blog Tutorial&quot;'> 
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj3IX-iBzrk43l_ff6tKuL-0paEAaGd-6plHyJew9eGmKs54isw1sLO71Z2jpkudXEUZZFQCqWTf8wXQBVy9tDPHyfxvUGPb6M2bRLQGr3Han2wHxBdSEz64pTYIPITvpef3RC1mIGeTghA/s1600/tr.png'/>
</b:if>
 </b:loop>
<!-- BATAS AKHIR -->
</div>

Keterangan :

  • Teks Biru :  Sesuaikan angka top:0px dan right:0px menjadi angka yang diinginkan apabila posisi tidak sesuai
  • Teks Hijau : Rubahlah dengan label/kategori yang akan menampilkan Ikon, Teks harus sesuai dengan label apabila label diawali huruf besar maka harus ditulis juga diawali dengan huruf besar apabila tidak, ikon tidak akan muncul. contoh label : Blog Tutorial jika ditulis blog tutorial maka ikon tidak akan muncul
  • Teks kuning : Ganti dengan URL Gambar / Icon yang diupload ke. cara upload gambar bisa baca disini
  •  Jika ingin menambahkan Label lagi Salin kode mulai dari <!-- BATAS AWAL --> sampai <!-- BATAS AKHIR-->kemudian letakkan dibawahnya atau diatas </div> 
  • Begitu seterusnya dan jangan lupa untuk merubah nama label dan juga URL Gambarnya
Share this Article on :
Cara Menampilkan Icon Label Posting
Item Reviewed: Cara Menampilkan Icon Label Posting 9 out of 10 based on 10 ratings. 9 user reviews.

0 komentar:

Posting Komentar

 

© Copyright 2-Bersaudara 2015 | Design by Herdiansyah Hamzah | Editing by 2-Bersaudara.