Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Sabtu, 12 Desember 2009

Cara membuat Widget 10 postingan Terbaru

Kategori :
Sebelumnya saya telah membuat trik membuat Widget post terbaru/recent post namun hanya 5 buah postingan yang di tampilkan, kini saya mempunyai solusinya agar post terbaru lebih banyak di tampilkan misanya anda ingin 10 postingan terbaru itu bisa saja kalau anda mau.


Nah kalau mau tau Cara membuat Widget 10 postingan terbaru mari kita lihat langkah-langkahnya dan langsung praktekkan :
  1. seperti biasa login ke blogger.com
  2. Setelah itu mari kita menuju Tata letak ===>> element halaman
  3. Mari kita tambahkan Gadget ===>> pilih yang HTML/Java script
  4. copy paste kode di bawah ini :


    <script>
    function rp(json) {
    document.write('<ul>');

    for (var i = 0; i < numposts; i++) {
    document.write('
    <li>');
    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 = "(more)";
    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(posttitle);

    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);

    if (showpostsummary == true) {
    if (postcontent.length < numchars) {
    document.write(postcontent);
    } else {
    postcontent = postcontent.substring(0, numchars);
    var quoteEnd = postcontent.lastIndexOf(" ");
    postcontent = postcontent.substring(0,quoteEnd);
    document.write(postcontent + '...' + readmorelink);
    }
    }
    document.write('</li>
    ');
    }
    document.write('</ul>
    ');

    }
    </script>

    <script>
    var numposts = 10;
    var showpostdate = false;
    var showpostsummary = false;
    var numchars = 100;
    </script>

    <script src="http://Namablogplend.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
    </script>

    <div class="clear">
    </div>
    <div style="text-align: right;">
    <a href="http://oketrik.blogspot.com/2009/12/cara-membuat-widget-10-postingan.html" title="Gimana cara membuat widget ini? mau? klik saja....">Bikin Widget ini</a>
    </div>


  5. Setelah itu simpan deh
  6. Sekarang lihat hasilnya
Nah itu Cara membuat Widget 10 postingan Terbaru, sekarang blog anda lebih indah kan dengan adanya Widget 10 postingan terbaru. Oketrik selalu menulis trik-trik yang mudah di mengerti dan di terapkan untuk para pemula.
    Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg

    16 Komentar untuk Cara membuat Widget 10 postingan Terbaru

    Kok ga Nongol sih ...????

    langsung ke TKP...

    ko ga bisa bos... knpa y??

    keren bisa saya coba langsung mas

    thanks gan tutornya,,,,maknyus

    sip dan oke...tutorial lancar!

    Saya pernah mencoba di wordpress self hosting nggak bisa. Adakah info yang seperti ini untuk wordpress saya?

    Gan kalo biar bergerak recent posnya gmana caranya?

    Kunjungi juga blog saya yaa gan www.andikapriastana.blogspot.com

    ini script readmore ya ?
    soalnya ada tulisan readmore di scriptnya :D

    maksih gann

    kunnjung dan follow balik ke blog ane gan
    http://as-jugabisa.blogspot.com

    Makasih mas dari tadi saya lagi cari dan buat artikel terbaru