Ahad, 24 Ogos 2014

Membuat Widget Latest Updated Untuk Blogger

Last Updated
Widget Latest Updated adalah widget yang menampilkan daftar artikel yang terakhir diperbaharui/latest updated. Widget ini juga sangat membantu pengunjung dalam memantau artikel yang terkahir Anda perbaharui. Anda juga bisa menggunakan koleksi widget lainnya Widget Recent Posts, Widget Random Posts, Widget Most Commented, Widget Recent Posts By Tag dan Widget Recent Comments

Cara Memasang Widget Latest Updated Untuk Blogger

1. Pertama simpan dahulu CSS ini 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}
2. Silakan salin dan simpan kode ini diatas kode </body>
<script type='text/javascript'>
//<![CDATA[
//Terakhir Diperbaharui by Infokmu.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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHlpCY_u-brZOwlI5j0tIrtFXPoR8jlgO4r_yZbpe9YvbY2rcTtDVxWIT4xsXJGeHnT0XblEfxNe6dPQSUFfFAtXB3imExExNjwyLUUqSwwCGuFIp7do7ytSXQxzc5PIG3aJ54FKUqTHn7/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;documenhttp://jsfiddle.net/#savet.body.appendChild(s)}getScript("/feeds/posts/summary?alt=json-in-script&orderby=updated&max-results=5&callback=updatedPosts");
//]]>
</script>
3. Kemudian simpan kode ini pada widget blogger HTML/JavaScript.
<ul id="updated-posts"></ul>

Tiada ulasan:

Catat Ulasan