Cara Membuat Recent Post Sederhana Versi Anchor Text

Recent Post adalah widget yang menampilkan artikel terbaru pada Blogger. Recent post ini menampilkan beberapa artikel sobat dari yang paling atas adalah yang paling baru. Dimana tujuannya tetap sama yaitu memberikan kemudahan untuk pengunjung mengetahui isi dari blog sobat dan update-tan terbaru dari blog Anda.

Baca Juga : Cara Membuat Recent Post Berdasarkan Label Anda

Recent post kali ini adalah versi Anchor Text. Dimana Recent post ini sangat sederhana dan ringan, tentunya tidak memperlambat loading blog Anda.

Screenshoot :

RECENT POST HANYA JUDUL SAJA (ANCHOR TEXT)

Cara Pertama :

1. Buka Blogger > Kemudian Login.
2. Dashboard > Layout/Tata Letak.

3. Tambahkan Add a Gadeget > Pilih HTML Java Script.

4. Copy & Paste kode berikut ini, dan Pastekan pada kolom HTML Java Script tersebut.

<div id="hlrpsb">
<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 = "&raquo;&raquo;";
    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, "");
    if (!standardstyling) document.write('');
    document.write('<div class="bbrecpost2">');
    document.write('<span>');
    if (standardstyling) document.write('');

    document.write(posttitle);
    if (standardstyling) document.write('');
    if (showpostdate == true) document.write(' - ' + cdday + ' ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdyear);
    if (!standardstyling) document.write('<div class="bbrecpostsum"">');
    if (standardstyling) document.write('');
    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('<i>');
         postcontent = postcontent.substring(0, numchars);
         var quoteEnd = postcontent.lastIndexOf(" ");
         postcontent = postcontent.substring(0,quoteEnd);
         document.write(postcontent + '... ' + readmorelink);
         if (standardstyling) document.write('</i>');}
}
    if (!standardstyling) document.write('</div>');
             document.write('</span>');
            document.write('</div>');
    if (standardstyling) document.write('');
}
if (!standardstyling) document.write('<div class="bbwidgetfooter">');
if (standardstyling) document.write('');
document.write('');
if (!standardstyling) document.write('/div');

}
</script>
<script style="text/javascript">var numposts = 5;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #0B3861; font-size: 13px;}
#rpdr, #rpdr a {color:#808080;}
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

5. Simpan Gadget.
Keterangan : 

var numposts = 5;var : Menampilkan Berapa postingan yang ingin di tampilkan.

Sekian Tips Blogger kali ini, Semoga Bermanfaat! - Jangan lupa berlangganan artikel kami, untuk mendapatkan update dari blog saya. Thanks for Reading & Sharing and Visited: Cara Membuat Recent Post Sederhana Versi Anchor Text.

Share this post

Related Post