Cara membuat widget label post

Script widget post yang satu ini dapat anda andalkan untuk halaman blog kesayangan anda. Widget post ini saya namakan dengan " Widget post perlabel ". Widget ini menampilkan Judul dari artikel yang diposting dalam satu label, sebenarnya widget yang satu ini dapat digandakan menjadi beberapa label anda hanya menggandakan scriptnya untuk menampilkan judul postingan dari beberapa label yang anda miliki, jadi anda dapat dengan leluasa menemtukan untuk menampilkan label mana yang ingin anda tampilkan. Widget post perlabel ini mempunyai script yang ringan dan CSS yang menawan sehingga tampilannya menarik. Widget ini memakai script yang sudah Valid HTML 5 dan dapat anda pakai pada template Valid HTML 5 dan tentunya buat template responsive. Oke silahkan anda simak tutorial dibawah ini :

Install Program CSS

• Login ke dashboard anda
• Masuk ke "TEMPLATE" lalu klik " Edit HTML "
• Cari code ]]></b:skin> 
• Copy Code script CSS dibawah ini, pastekan diatas code ]]></b:skin> tadi

#BD_CSS td {
list-style-type: none;
width: 100%;
padding: 0 3px 0 3px;
}
#BD_CSS a {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #000;
line-height:12px;
letter-spacing:.1em;
text-decoration: none;
display:block;
padding:2px 6px 5px 8px;
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio1XAuXFRE59fu8poo3ul6i4VX0aURF9ttre06VdfjCI0u3Qr56ZddOnMYqcVT-e7XINjWNPp_5KI0TkKJLoraX8JcDU5QDPAZg-EyxjzbctPJ9HzwtVRrth2crtFHquDGZ-qqDD9xzhE/s1600/mm_arrow.gif") 0px 50% no-repeat;
}
#BD_CSS a:hover {
background: #fff url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio1XAuXFRE59fu8poo3ul6i4VX0aURF9ttre06VdfjCI0u3Qr56ZddOnMYqcVT-e7XINjWNPp_5KI0TkKJLoraX8JcDU5QDPAZg-EyxjzbctPJ9HzwtVRrth2crtFHquDGZ-qqDD9xzhE/s1600/mm_arrow.gif") 0px 50% no-repeat;
color:#990000;
text-transform: none;
}
.BD_list {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #000;
line-height:10px;
letter-spacing:0.1em;
text-decoration: none;
}

Install Program Tag HTML

Untuk memanggil widget top comentar tersebut silahkan simak penjelasan dibawah ini ;

• Anda masih berada dihalaman dasbor lalu anda menuju "TATA LETAK "
• Silahkan klik "Add Gadget "( Tambahkan gadget )
• Pilih " HTML / JavaScript "
• Copy Code HTML dibawah ini, paste pada gadget anda.
  

<script style="text/javascript">
var numposts = 5; // Jumlah postingan
var standardstyling = true;
</script>
<script style="text/javascript">

function showrecentposts(json) {
for (var i = 0; i < numposts; i++) {
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}}
posttitle = posttitle.link(posturl);
if (standardstyling) document.write('<div style="border-bottom: dotted #999 1px;"></div>');
document.write(posttitle);}
if (standardstyling) document.write('<div style="border-bottom: dotted #999 1px;"></div>');
document.write('<div style="border-bottom: dotted #999 1px;"></div>');
}
</script>
<div id="BD_CSS">
<div class="BD_list">
<script src="URL BLOG ANDA /feeds/posts/default/-/LABEL ANDA?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts&amp;max-results=999"></script>
</div></div>

Keterangan Gambar

• Code warna biru adalah jumlah postingan
• Code warna Merah ganti dengan URL dan label anda sesuai yang tertulis pada code diatas
• Bila Label anda terdiri dari 2 suku kata atau mempunyai spasi gantikan spasinya dengan code [ %20 ]
  Contoh : Trik Blogspot menjadi Trik%20Blogsot
• Jika anda ingin menampilkan 2 atau tiga label silahkan gandakan code :
  
  

  <script src="URL BLOG ANDA /feeds/posts/default/-/LABEL ANDA?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts&amp;max-results=999"></script>

  
  Bila anda menggandakan scripnya untuk menampilkan label lebih dari satu silahkan anda ganti hanya nama labelnya saja pada code label warna biru diatas

Kesimpulan

Pemasangan widget ini sangat membantu anda untuk menampilkan label yang menurut anda layak untuk ditampilkan untuk pengunjung blog anda agar lebih fokus terhadap artikel yang telah anda posting pada halaman blog anda.

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter

Di posting oleh : Unknown Update pada : 9:51 PM