Membuat Widget Recent Posts By Tag Untuk Blogger

Widget Recent Posts By Tag yaitu widget yang dipilih berdasarkan label tertentu pada blogger. Makara dengan adanya widget ini lebih memudahkan pengunjung dalam mencari artikel yang lebih spesifik. Silakan coba juga koleksi widget lainnya menyerupai Widget Recent Posts, Widget Random Posts dan Widget Most Commented.

Cara Memasang Widget Recent Posts By Tag Untuk Blogger

1. Pertama simpan dahulu CSS ini diatas arahan ]]></b:skin> atau </style>

/*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}

2. Silakan salin dan simpan arahan ini diatas arahan </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  // http://gplus.to/mousir - http://lifeakandistar.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/AVvXsEh639r_3WGKtO6biqEFpwk48r7ftj3Ift8IGEVuPA9A_Dvwgn1RMVqyus1Oyac9BC_DzGxl9phLyIBr8WEGO4R9MdplTKsomra7QH2yQpGkf_RkT1ZH-QQYrxZkHOUQGfPz23Tkk_YYP0kb/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+'" sasaran ="_blank" title="Membuat Widget Recent Posts By Tag Untuk Blogger"><img class="rct-thumb" alt=" Makara dengan adanya widget ini lebih memudahkan pengunjung dalam mencari artikel yang lebi Membuat Widget Recent Posts By Tag Untuk Blogger" src="'+l+'"/></a>');document.write('<strong><a href="'+i+'" sasaran ="_blank" title="Membuat Widget Recent Posts By Tag Untuk Blogger" 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>

3. Kemudian simpan arahan ini pada widget blogger HTML/JavaScript.

<script> document.write("<script src=\"/feeds/posts/default/-/Belajar%20SEO?orderby=updated&alt=json-in-script&callback=rcentbytag\"><\/script>"); </script>

Demo

Pengaturan

Icon	Teks
var numPosts	Isi dengan jumlah artikel yang ingin ditampilkan
var showpostthumbnails	Pilih true jikn ingin menamapilkn gambar dan false untuk menghilangkannya
var showpostdate	Pilih true jikalau ingin menamapilkn tanggal dan false untuk menghilangkannya
Belajar%20SEO	Silakan ganti dengan label yang di inginkan, bila lebih dari dua kata gunakan `%20` sebagai pengganti spasi