Tips/Cara Membuat Widget Recent Post Dengan Label di Blog - Baru-baru ini saya telah menulis mengenai cara membuat widget recent update di blog untuk memberitahukan kepada pengunjung bahwa ada artikel yang baru saja diperbaharui, tapi kali ini sangat berbeda karena saya akan membagikan kepada anda mengenai widget recent post dengan label yang akan membuat pengunjung lebih mengetahui artikel terbaru mana saja yang baru anda publikasikan dan pastinya bergantung pada label mana anda tempatkan artikel baru tersebut.
( Baca Juga : Cara Membuat Widget Artikel Terbaru Ringan Dan SEO )
Untuk itu mari kita mencoba untuk membuat widget recent post dengan label dan semoga anda dapat mengerti cara-cara dibawah ini dan dapat memperhatikannya dengan seksama.
( Baca Juga : Cara Membuat Widget Komentar Terbaru Lengkap )
Tips Membuat Widget Recent Post Dengan Label di Blog
( Baca Juga : Cara Membuat Widget Artikel Terbaru Ringan Dan SEO )
Untuk itu mari kita mencoba untuk membuat widget recent post dengan label dan semoga anda dapat mengerti cara-cara dibawah ini dan dapat memperhatikannya dengan seksama.
( Baca Juga : Cara Membuat Widget Komentar Terbaru Lengkap )
Tips Membuat Widget Recent Post Dengan Label di Blog
- Pertama masuk ke Template > Edit HTML
- Kedua silahkan cari kode ]]></b:skin> atau </style> dan letakkan kode dibawah ini tepat diatas kode tadi.
/*Recent Post By tag*/
img.rct-thumb{float:left;margin-right:10px;height:72px;width:72px;}
.recent-by-tag{width:100%;margin:0;padding:0}
ul.recent-by-tag li{padding:10px
0;margin-bottom:0;border-bottom:1px solid #ddd}
.recent-by-tag li{font-size:13px;list-style:none;padding-left:0;margin:0;padding:0;overflow:hidden}
.recent-by-tag
a{font-family:'Oswald',sans-serif;font-size:16px;font-weight:normal;margin:0;}
.recent-by-tag strong{padding-left:0}
span.showdates{font-size:16px;margin:10px 0 0}
- Cari kode </head> dan simpan kode dibawah ini tepat diatas kode </head>.
<script type='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var showpostdate = true;</script>
<script type='text/javascript'>
//<![CDATA[
// Recent Post By Tag
// Recent Post By Tag For Blogger by Kang Mousir
// http://gplus.to/mousir - http://kang-mousir.blogspot.com
function rcentbytag(e){document.write('<ul
class="recent-by-tag">');for(var t=0;t<numposts;t++){var
n=e.feed.entry[t];var r=n.title.$t;var
i;if(t==e.feed.entry.length)break;for(var
o=0;o<n.link.length;o++){if(n.link[o].rel=="replies"&&n.link[o].type=="text/html"){var
u=n.link[o].title;var
f=n.link[o].href}if(n.link[o].rel=="alternate"){i=n.link[o].href;break}}var
l;try{l=n.media$thumbnail.url}catch(h){s=n.content.$t;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if(a!=-1&&b!=-1&&c!=-1&&d!=""){l=d}else
l="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSRk60_Dz3Z062PgEBTFjQUxsc5eBdR_1NP2P50se4uvTWjHPvYqjLdDjGq4zebD6Ar2MXZjF72NjpPUYgXwxWeVlcdouFn7GYEyGmgYCva_q_QXY6gh-rto423FEoOyx8egVl9u0xa33C/s70-c/KM+Icon.png"}var
p=n.published.$t;var v=p.substring(0,4);var m=p.substring(5,7);var
g=p.substring(8,10);var y=new
Array;y[1]="Januari";y[2]="Februari";y[3]="Maret";y[4]="April";y[5]="Mei";y[6]="Juni";y[7]="Juli";y[8]="Agustus";y[9]="September";y[10]="Oktober";y[11]="November";y[12]="Desember";document.write('<li
class="clear">');if(showpostthumbnails==true)document.write('<a
href="'+i+'" target ="_blank"
title="'+r+'"><img class="rct-thumb"
alt="'+r+'"
src="'+l+'"/></a>');document.write('<strong><a
href="'+i+'" target ="_blank" title="'+r+'"
rel="nofollow">'+r+'</a></strong>');document.write('<br>');var
x="";var T=0;if(showpostdate==true){x='<span
class="showdates">'+x+g+" "+y[parseInt(m,10)]+"
"+v+"</span>";T=1}document.write(x);document.write("</li>");if(t!=numposts-1)document.write("")}document.write("</ul>")}
//]]>
</script>
- Simpan Template
- Silahkan Masuk ke Tata Letak > Add Widget > HTML/Javascript
- Masukkan kode dibawah ini tepat didalam HTML/Javascript tadi.
<script>
document.write("<script src=\"/feeds/posts/default/-/Tips%20Blogging?orderby=updated&alt=json-in-script&callback=rcentbytag\"><\/script>");
</script>
- Script berwarna biru diganti dengan nama label blog anda.
- Simpan Widget HTML/Javascriptnya.
Demikianlah Tips Membuat Widget Recent Post Dengan Label di Blog semoga dapat bermanfaat bagi anda semua dan dapat menjadi semangat bagi kita dan lihat juga widget lainnya.
( Baca Juga : Cara Membuat Menu Bar di Side Bar Lengkap )
( Baca Juga : Cara Membuat Widget Latest Update )
Happy Blogging.......
Belum ada tanggapan untuk "Tips Membuat Widget Recent Post Dengan Label di Blog"
Post a Comment