Cara Membuat Recent Post Di Blog

Cara Membuat Recent Post Di Blog - Pada Kali ini kita akan membuat recent post atau widget artikel terbaru di blog. Recent Post merupakan suatu element atau widget untuk menampilkan postingan atau artikel terbaru dari blog dan sangat berguna untuk seo blog karena dapat memberikan internal link. Dengan ini pengunjung dapat mengetahui postingan terbaru dari blog kita. Sebenarnya blogger juga menyediakan widget feed yg fungsinya sama seperti recent post. Bagi anda yg ingin membuat widget recent post di blog, simak langkah-langkah berikut ini.

CSS Recent Post

• Login ke akun blogger.
• Kemudian klik menu template.
• Klik edit html.
• Pastekan kode berikut diatas kode ]]></b:skin>.

.recent_post_with_thumbs a {color:#808080;}.clearfix {padding-top:6px;padding-bottom:6px;border-bottom: 1px #cccccc dotted;}

• Kemudian klik simpan

Script Recent Post

• Login ke akun blogger.
• Kemudian klik menu tata letak.
• Klik tambahkan element/ add gadget.
• Lalu pilih HTML/Javasript.
• Kemudian pastekan kode di bawah ini.

<script style="text/javascript">function showrecentpostswiththumbs(json){document.write('<ul class="recent_posts_with_thumbs">');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=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;} if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break;}}var thumburl;try{thumburl=entry.media$thumbnail.url;}catch(error) {s=entry.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!="")){thumburl=d;}else thumburl='http://www.webaholic.co.in/other/no-image.jpg';} var postdate=entry.published.$t;var cdyear=postdate.substring(0,4);var cdmonth=postdate.substring(5,7);var cdday=postdate.substring(8,10);var monthnames=new Array();monthnames[1]="Jan";monthnames[2]="Feb";monthnames[3]="Mar";monthnames[4]="Apr";monthnames[5]="May";monthnames[6]="Jun";monthnames[7]="Jul";monthnames[8]="Aug";monthnames[9]="Sep";monthnames[10]="Oct";monthnames[11]="Nov";monthnames[12]="Dec";document.write('<li class="clearfix">');if(showpostthumbnails==true) document.write('<img class="recent_thumb" src="'+thumburl+'"/>');document.write('<b><a href="'+posturl+'" target ="_top">'+posttitle+'</a></b><br>');if("content"in entry){var postcontent=entry.content.$t;} else if("summary"in entry){var postcontent=entry.summary.$t;} else var postcontent="";var re=/<\S[^>]*>/g;postcontent=postcontent.replace(re,"");if(showpostsummary==true){if(postcontent.length<numchars){document.write('<i>');document.write(postcontent);document.write('</i>');} else{document.write('<i>');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('</i>');}} var towrite='';var flag=0;document.write('<br><strong>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;} if(showcommentnum==true) {if(flag==1){towrite=towrite+' | ';} if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';commenttext='<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';towrite=towrite+commenttext;flag=1;;} if(displaymore==true) {if(flag==1)towrite=towrite+' | ';towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">More -></a>';flag=1;;} document.write(towrite);document.write('</strong></li>');if(displayseparator==true) if(i!=(numposts-1)) document.write('<hr size=0.5>');}document.write('</ul>');} </script>

<script style='text/javascript'>
var numposts = 10;var showpostthumbnails = false;
var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = false;var numchars = 150; </script>
<script src='http://www.tapike.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>

• Klik simpan

Jangan lupa tulisan warna merah ganti dengan url blog anda. Tulisan warna biru ganti dengan jumlah postingan yg ingin ditampilkan. Demikianlah tutorial mengenai cara membuat recent post atau cara membuat widget artikel terbaru di blog. Semoga artikel ini dapat bermanfaat bagi kita semua. Jangan lupa like dan share.

• Cara Membuat Tooltip Pada Link Blog