Tunggu Sebentar...

9/20/2016

Cara Membuat Widget Artikel Terbaru di Sidebar Blog

Baca Juga




ﺍﻟﺴَّﻼَﻡُ ﻋَﻠَﻴْﻜُﻢْ ﻭَﺭَﺣْﻤَﺔُ ﺍﻟﻠﻪِ ﻭَﺑَﺮَﻛَﺎﺗُﻪ

ﺑِﺴْــــــــــــــــــﻢِ ﺍﷲِﺍﻟﺮَّﺣْﻤَﻦِ ﺍﺍﺭَّﺣِﻴﻢ


Hai sobat Blogger di manapun kalian berada pasti banyak di kalangan sobat yang mencari artikel yang berjudul Cara Membuat Widget Artikel Terbaru di Sidebar Blog dan cara itu pun rata rata tidak work (bekerja) nah disini saya InsyaAllah akan mencoba share artikel tersebut Insyaallah work 100% amin :D

Mengapa kita harus membuat widget keren artikel terbaru di sidebar ? Karena hal tersebut dapat
memancing para pembaca untuk melihat widget Artikel Terbaru dari postingan kita tersebut dan hal ini
pun bisa meningkatkan viewer ramai di blog kita ( bounce rate )

Oke langsung saja simak cara nya sebagai berikut :

Login akun Blogger > Dashboard (Beranda) > Tata Letak > Tambah Gadget . Lalu Copy Paste saja HTML yang sudah di sediakan di bawah ini

Artikel Terbaru Thumbnail :

<script type="text/javascript"> window.recentposts=(function(){var a=function(p){var d=p||{},i=d.url_blog||"",n=d.numberofposts||5,h=d.id_contain||"#rcposts",e=d.imagesize||40,b=d.snippetsize||100,c=d.loadingClass||"rcloading",m=d.commentstext||"Comments",l=d.firstcmtext||"Comment",f=d.NoCmtext||"No Comments",g=d.MonthNames||["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],k=d.pBlank||"http://2.bp.blogspot.com/-MZ2UNvioO2A/Up-XDjMGhWI/AAAAAAAABuo/7btg1OAL3FQ/s1600/no.png";$(h).addClass(c);var j=i;if(i===""){j=window.location.protocol+"//"+window.location.host}$.ajax({url:j+"/feeds/posts/default?alt=json-in-script&orderby=published&max-results="+n+"",type:"get",dataType:"jsonp",success:function(v){var y,o,w,q,A,D,z,F,x,C,E,s="",B=v.feed.entry;if(B!==undefined){s="<ul class='rcpost'>";for(var u=0;u<B.length;u++){for(var t=0;t<B[u].link.length;t++){if(B[u].link[t].rel=="alternate"){y=B[u].link[t].href;break}}for(var r=0;r<B[u].link.length;r++){if(B[u].link[r].rel=="replies"&&B[u].link[r].type=="text/html"){w=B[u].link[r].title.split(" ")[0];break}}if("content" in B[u]){A=B[u].content.$t}else{if("summary" in B[u]){A=B[u].summary.$t}else{A=""}}if("media$thumbnail" in B[u]){D=B[u].media$thumbnail.url.replace(/\/s[0-9]+\-c/g,"/s"+e+"-c")}else{D=k}if(w===0){q=' <span class="rccomments">'+f+"</span>"}else{if(w===1){q=' <span class="rccomments">'+w+" "+l+"</span>"}else{q=' <span class="rccomments">'+w+" "+m+"</span>"}}A=A.replace(/<\S[^>]*>/g,"");if(A.length>b){A=A.substring(0,b)+"..."}o=B[u].title.$t;z=B[u].published.$t.substring(0,10),F=z.substring(0,4),x=z.substring(5,7),C=z.substring(8,10),E=g[parseInt(x,10)-1],s+='<li><a class="rcthumbs" href="'+y+'" target="_blank"><img style="width:'+e+"px;height:"+e+'px;display:block" alt="'+o+'"src="'+D+'"/></a><strong><a href="'+y+'" target="_blank">'+o+'</a></strong><span class="date"><span class="dd">'+C+'</span> <span class="dm">'+E+'</span> <span class="dy">'+F+"</span></span>"+q+"<p>"+A+"</p></li>"}s+="</ul>";$(h).html(s).removeClass(c)}else{$(h).html("<span>No result!</span>").removeClass(c)}},error:function(){$(h).html("<strong>Error Loading Feed!</strong>").removeClass(c)}})};return function(b){a(b)}})(); </script> <style type="text/css"> ul.rcpost {line-height: 1.2;} ul.rcpost li{list-style:none;margin:0;overflow:hidden;padding: 0.7em 0px;} ul.rcpost .rcthumbs{float:left;margin:0 7px 10px 0} ul.rcpost strong{display:block;line-height:normal;margin-top:-3px} ul.rcpost p{margin:5px 0 11px;line-height:normal;font-size:11px} ul.rcpost .date,ul.rcpost .rccomments{font-size:11px;display:none} ul.rcpost .rccomments{padding-left:5px;border-left:1px solid #969191;display:none} </style> <div id="recentposts"></div> <script type='text/javascript'> //<![CDATA[ $(document).ready(function () { recentposts({ numberofposts:5, id_contain:"#recentposts", commentstext:"Comments", imagesize:72, snippetsize:90 }); }); //]]> </script>

Artikel Terbaru non Thumbnail :

<script type="text/javascript">function showrecentposts(json){for(var i=0;i<numposts;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}posttitle=posttitle.link(posturl);if(standardstyling)document.write('<li>');document.write(posttitle)}if(standardstyling)document.write('</li>')}</script><ul><script type="text/javascript">var numposts = 10;var standardstyling = true;</script><script type="text/javascript" src="https://aldiandreansyah.blogspot.co.id/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts"></script></ul></div>


Catatan :

Ubah teks warna merah dengan URL blog kalian.

Lalu klik Simpan/Save
Silahkan lihat di blog sobat work atau tidak , jika tidak work sobat dapat cantumkan komentar di bawah , Terimakasih.
ﻭَ ﺍﻟﺴَّﻼَﻡُ ﻋَﻠَﻴْﻜُﻢْ ﻭَﺭَﺣْﻤَﺔُ ﺍﻟﻠﻪِ

Artikel Terkait

Seorang Pelajar yang Ingin Berbagi Ilmu Pengalaman yang diketahui nya kepada seluruh Umat Manusia, dan Semoga Ilmu yang ia bagikan tersebut bermanfaat. Amin

11 komentar

================================================================
~ Jika ingin men Copy Paste harap masuk kan sumber link artikel saya di postingan sobat
~Dilarang Berkomentar link aktif , jika ada yang memasuk kan link aktif maka kami akan Hapus dan kami anggap Spam
~ Komentar lah dengan Bahasa yang Baik dan Relevan dengan sesuai artikel terkait tersebut . Terimakasih
================================================================
EmoticonEmoticon