Powered by Blogger.

Membuat Widget Latest Update Untuk Blogger

Latest Update adalah widget yang menampilkan daftar artikel yang terakhir diperbaharui/last update. Widget ini juga berguna memperlihatkan pengunjung untuk memantau artikel mana saja yang sudah diperbaharui.

Membuat Widget Latest Update Untuk Blogger

Menampilakan data - data artikel terkahir diperbaharui atau telah mengalami perbaharuan, jadi nantinya widget ini akan disortir berdasarkan artikel yang terbaru diperbaharui oleh admin blog.

Berikut tutorial Membuat Widget Latest Update Untuk Blogger.

1. Login ke akun Blogger.
2. Masuk ke Dashboard, Template > Edit HTML.
3. Tambahkan CSS berikut ini tepat diatas kode ]]></b:skin> atau </style>.
/*Latest Updated*/
li.update {list-style: none;height:auto;overflow:hidden}
li.update a{font-family:'Oswald',sans-serif;font-size:16px;font-weight:normal;margin:0;}
li.update a:hover{color:#859ce6}
.imgupdate{float:left; margin:0 10px 10px 0}
.imgupdate:hover{opacity:0.7}
.tgl-com {display:block;font-size:16px;margin-top:5px;font-size:16px}
4. Setelah itu Salin dan Letakkan Kode dibawah ini tepat diatas kode </body>.
<script type='text/javascript'>
//<![CDATA[
//Terakhir Diperbaharui by Bedholrohman.blogspot.com
function updatedPosts(a){if(document.getElementById("updated-posts")){var e=a.feed.entry,title,img,link,date,content="",o=["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],ct=document.getElementById("updated-posts");for(var i=0;i<5;i++){for(var j=0;j<5;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t,pd=e[i].published.$t.substring(0,10).split("-");if("media$thumbnail"in e[i]){img=e[i].media$thumbnail.url}else{img="http://2.bp.blogspot.com/-giova1ZCh-A/Uzq6L8QTJNI/AAAAAAAAAJc/USXictTq_xs/s70-c/KM+Icon.png"}content+='<li class="update"><a href="'+link+'" target="_blank" title="'+title+'"><img src="'+img.replace(/\/s72-c/,"/s70-c")+'" class="imgupdate" alt="'+link+'" height="70px" width="70px"/></a>';content+='<strong><a href="'+link+'" target="_blank" title="'+title+'">'+title+'</a></strong><span class="tgl-com" datetime="'+pd.join("-")+'">  '+(pd[2]+" "+o[(parseInt(pd[1],10)-1)]+" "+pd[0])+'</span></li>'}ct.innerHTML=content}}function getScript(url){var s=document.createElement("script");s.type="text/javascript";s.src=url;document.body.appendChild(s)}getScript("http://bedholrohman.blogspot.com/feeds/posts/summary?alt=json-in-script&orderby=updated&max-results=5&callback=updatedPosts");
//]]>
</script>
5. Simpan, lalu masuk ke Tata Letak > Tambah Gadget (HTML/JavaScript).
<ul id="updated-posts"></ul>
6. Masukkan kode dibawah ini.
7. Simpan dan lihat hasilnya.

Keterangan :
- Ganti bedholrohman.blogspot.com dengan link blog anda.
Tag : Widget
0 Komentar untuk "Membuat Widget Latest Update Untuk Blogger"

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 !