Membuat Recent Post Di Widget

11 Oktober

Cara membuat recent post atau artikel terdahulu pada blogspot dapat kita lakukan dengan memasang bebarapa script sederhana pada widget. Recent post atau artikel terdahulu berfungsi untuk menampilkan artikel yang sudah kita posting agar dapat di akses oleh pengunjung kita dengan mudah. Ikuti langkah-langkah di bawah ini untuk memulai membuat recent post di blogspot kamu.

1. Login ke dashboard blogspot kamu
2. Masuk kedalam mode tata letak atau layout

3. Saat sobat menambahkan widget pilih tombol HTML/SCRIPT

4. Pada kotak isian tambahkan dengan judul Artikel Terkait atau terserah kamu mau membuat judul apa. Judul ini akan tampil sebagai judul widget sobat

5. Tambahkan kode di bawah ini pada kotak Konten

<div id="24work">  
 <script style="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);  
 var readmorelink = "....";  
 readmorelink = readmorelink.link(posturl);  
 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";  
 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, "");  
 document.write('<div class="mtrpw">');  
 if (standardstyling) document.write('<br/>');  
 document.write(posttitle);  
 if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);  
 document.write('</div><div class="mtrpwsumm">');  
 if (showpostsummary == true) {  
 if (standardstyling) document.write('');  
 if (postcontent.length < numchars) {  
 if (standardstyling) document.write('<i>');  
 document.write(postcontent);  
 if (standardstyling) document.write('</i>');}  
 else {  
 if (standardstyling) document.write('');  
 postcontent = postcontent.substring(0, numchars);  
 var quoteEnd = postcontent.lastIndexOf(" ");  
 postcontent = postcontent.substring(0,quoteEnd);  
 document.write(postcontent + ' ' + readmorelink);  
 if (standardstyling) document.write('');}  
 }  
 document.write('</div>');  
 if (standardstyling) document.write('');  
 }  
 if (!standardstyling) document.write('<div class="bbwidgetfooter">');  
 if (standardstyling) document.write('');  
 document.write('');  
 if (!standardstyling) document.write('');  
 };document.write('<a href="http://sidongayah.blogspot.com" style="font-size: 1px; text-decoration:none; color: #cccccc;">Blogspot Tutorial</a>');</script>  
 <script style="text/javascript">var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;</script>  
 <script src="http://sidongayah.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script>  
 <div style="font-family: arial, sans-serif; font-size: 9px;" id="rpdr">  
 </div><noscript>Your browser does not support JavaScript!</noscript>  
 <style type=text/css>  
 #rpdr, #rpdr a {color:#808080;}  
 #mtrpwa { border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}  
 .mtrpw a {font-weight:bold; }  
 .mtrpwsumm {}  
 </style></div>

Pada bagian  url yang berwarna merah ganti dengan url blogspot kamu. Lalu simpan kode yang kamu buat untuk melihat perubahan. Sebelum melakukan modifikasi cara membuat recent post ini sebaiknya sobat melakukan backup dulu pada file template blogspot sobat.

Demikianlah tutorial cara membuat recent post di widget pada blogspot. Lakukan langkah-langkah diatas dengan teliti dan hati-hati.