Membuat Widget Recent Posts By Tag Untuk Blogger

Membuat Widget Recent Posts By Tag Untuk Blogger

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="http://2.bp.blogspot.com/-giova1ZCh-A/Uzq6L8QTJNI/AAAAAAAAAJc/USXictTq_xs/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>

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

Tentang Penulis

Kang Mousir

Seorang blogger sejak tahun 2012 sampai sekarang. Saya hanyalah orang biasa yang senang dengan blog dan membagikan tulisan lewat media blog, karena itu saya membangun Blog Kang Mousir.

Facebook | Twitter | Instagram

  • 0 Artikel
  • 0 Komentar

Artikel Terkait

Komentar

ABDI NEGARA
Alhamdulillah,akhirnya dapet Petromax di Blog ini kang ehhehe :D
Kang Mousir
Silakan dibawa pulang PERTAMAX nya haha :D
Hariyanto Wijoyo
tutorialnya sederhana banget..namun mudah dipahami..luarbiasa...keep happy blogging always...salam dari Makassar :-)
Kang Mousir
Terima kasih, salam juga dari blogger Garut :)
Kopen Gede
kok error gini ya sob?? Kesalahan saat mengurai XML, baris 1217, kolom 29: Open quote is expected for attribute "src" associated with an element type "script".
Kang Mousir
Yang tahap ketiga jangan disimpan di editor template tapi disimpan di widget blogger
Kopen Gede
oiyaa udah ketemu terimakasih buwanyaaak sob :P :P
Saya Arkham
Keren banget... style nya itu loh @@,
Dian AnaR-chyta
Ini seperti yg di gunakan di template ini ya?
Loading'nya juga gak terasa sob dan tampilannya sederhana namun elegant.
Kang Mousir
hehe iya seperti yang dipakai di template ini :D
Muhammad Setia Abdillah
mohon mmaaf kalo saya menggangu anda, saya hanya berminat pasang iklan di website anda, berupa link atau banner ? mohon dikirim harga pasang link di blog ini dan pasang banner di blog ini selama 1 bulan, jika harga murah kami akan pasang 2-3 link disini. :roll:
TERIMA KASIH ! :-d
Salam Hangat Dari ;)
http://www.jasaseoone.com
Muhammad Setia Abdillah
Mohon maaf kirim ke email : csjasaseoone@gmail.com
mohon kerja samanya ^_^ :oops:
santika fadilah
aku otak atik sendiri meni susah, pas berhasil cakep sangat.. :D :-d
Kang Mousir
Sip, namanya juga belajar hehe :D
Rozaq Abdul
Cara masang di bawah postingan agar jadi 2 (saling nempel) kayak blog ini gimana ya,..?
Mohon pencerahannya Thx.
Kang Mousir
Coba ambil kodenya di template Sang SEO aja :D
Muhammad Rizky
Sukses mendarat di blog saya tutorialnya Kang Mousir. Akhirnya bisa juga setelah beberapa hari mencari di Google dan artikel atau tutorialnya salah. Semenjak mondar-mandir di Google akhirnya ketemu juga nih blognya Kang Mousir. Terima kasih banyak atas tutorialnya. Update terus yang seru-seru dan penuh tantangan tutorial blognya. :-d
Kang Mousir
hehe sama - sama gan. Pasti update terus kalau ada waktu hehe
abi
Kang... bisa berfungsi gak jika semua script di atas dimasukkan dalam 1 kotak widget ? biar lebih praktis gitu ? :roll:
Agi Hiroshi
kang aku ga bisa, ga bisa aktif coba ceks usaha-budidayaikan.blogspot
Agi Hiroshi
aku pakai template bagas31, tapi wingetnya ga bisa, mau cari buat bikin list label bingung pakai yang mana, banyakan eror ada saran ga? blognya masih uji coba bukan aslinya. coba diceks kang.
Koeli online
ramuannya mantap kang
:-d
:-d
kang febby
kang cara hapus widget yang gak bisa di hapus itu gimana yak ??
kang febby
Untuk tampilan lurus kebawah gitu gimana ngaturnya ya kang ?
soalnya punyaku kebawah malah ngruncing.. apa itu udah bawaan ya
M. AINUR ROFIQ
pak, g bisa e, cuma muncul " }); ,
lowfromid
bang gimana cara hilangin simbol bulat warna hitam ya di belakang gambar nya

Silakan berkomentar sesuai dengan topik. Jangan menyisipkan link pada komentar dan jangan sampai komentar Anda masuk komentar SPAM.

Jangan salahkan Saya bila komentar Anda dihapus !

Batal