• Home
  • About Us
  • Sitemap
  • Disclaimer
  • Privacy

BangBud Blogz

Mengupas Semua Hal Tentang Dunia Blogging

  • Home
  • Belajar Blogging
  • Template Blogger
  • Belajar SEO
  • Google Adsense
Home » JavaScript » Tutorial Blogger » Widget » Membuat Widget Recent Posts By Tag Untuk Blogger

Membuat Widget Recent Posts By Tag Untuk Blogger

Admin
Add Comment
JavaScript, Tutorial Blogger, Widget
Saturday, August 2, 2014
Recent Posts By Tag
Widget Recent Posts By Tag adalah widget yang dipilih berdasarkan label tertentu pada blogger. Jadi dengan adanya widget ini lebih memudahkan pengunjung dalam mencari artikel yang lebih spesifik. Silakan coba juga koleksi widget lainnya seperti 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 kode ]]></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 kode ini 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/AVvXsEg234PmWkEKSfzRxfwsIAIFtxzAwIU34wPtxTYxpajQxrRQdK3hSK33MPWmanDFfyxtAPd15MsxvpE91jB72L3wyLtPJJc-ji0LSqesjjghrsT1V3zKs5ACL315WFsa4kMmfhh6COEaHsVI/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>
3. Kemudian simpan kode 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

IconTeks
var numPostsIsi dengan jumlah artikel yang ingin ditampilkan
var showpostthumbnailsPilih true jikn ingin menamapilkn gambar dan false untuk menghilangkannya
var showpostdatePilih true jika ingin menamapilkn tanggal dan false untuk menghilangkannya
Belajar%20SEOSilakan ganti dengan label yang di inginkan, bila lebih dari dua kata gunakan %20 sebagai pengganti spasi
Tweet
Membuat Widget Recent Posts By Tag Untuk Blogger Title : Membuat Widget Recent Posts By Tag Untuk Blogger
Description : Widget Recent Posts By Tag adalah widget yang dipilih berdasarkan label tertentu pada blogger . Jadi dengan adanya widget ini lebih memudah...
Rating : 5

0 Response to "Membuat Widget Recent Posts By Tag Untuk Blogger"

Post a Comment

← Newer Post Older Post → Home
Subscribe to: Post Comments (Atom)
Top
BangBud Blogz © 2016 - All Rights Reserved