Cara mudah untuk membuat recent post yang menarik - Juragan Gosip
Headlines News :

Featured Post 7

Related Posts Plugin for WordPress, Blogger...

Blogger templates

More on this category »

Footer Widget 1

Texts

Footer Widget 3

Label

Footer Widget 2

Blog Archive

About Me

Archives

Postingan Populer

Download

Enter your email address:

Delivered by FeedBurner

Home » » Cara mudah untuk membuat recent post yang menarik

Cara mudah untuk membuat recent post yang menarik

Written By Unknown on Jumat, 28 Desember 2012 | 21.16

Dalam dunia blogger sudah banyak cara untuk membuat recent post yang menarik hingga menggunakan gambar, disini saya berikan cara membuat recent post sederhana tapi menarik dan tidak terlalu berat untuk loading blog. Langsung saja karena pastinya sahabat sudah mau mulai membuatnya. Silahkan Ikuti petunjuk yang ada dibawah ini.
Screenshot tampilan Recent Post bisa lihat dibawah ini atau samping kanan blog ini :

Recent Posts
Screenshot Recent Post

Membuat Recent Post | Artikel Terbaru Dengan Scroll :
1. Silahkan masuk ke blog sahabat (dashbor)
2. Masuk ke Tata Letak
3. Tambahkan widget >> Tambah HTML/Javascript
4. Copy kode dibawah ini pada widget HTML/javascript tadi.
5. Simpan dan lihat hasilnya.
<div style="border: 1px solid rgb(181,214,202); height: 200px; margin: 10px 0pt 0pt; overflow: auto; padding: 8px; width: 280px;">
<script>//credit to hoctro
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 = "(Lihat yuk)";
        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 (showpostdate == true) document.write('# ' + cdday + ' ' + monthnames[parseInt(cdmonth,10)] + '>> ');document.write(posttitle + '  ');
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('<hr width="100%" size="1"/>');}document.write('</ul>');}
var numposts = 20; var showpostdate = true; var showpostsummary = true; var numchars = 5; </script><script src="http://pemula-awaliharimu.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script></div>
Keterangan Kode Warna :
Merah = Untuk tinggi dan lebar
Biru = Silahkan ganti dengan kata-kata sahabat sendiri (ex: readmore, buka, lengkapnya)
Kuning = Jumlah maksimal Recent posts yang di tampilkan
Ungu = Silahkan ganti dengan alamat blog sahabat

Atau Jika sahabat ingin yang lebih simple atau sederhana bisa gunakan kode dibawah ini dengan cara seperti diatas :
Recent Posts Simple Code :
<div style="overflow:auto;width:320px;height:250px;padding:10px;border:1px solid #eee">

<script src="http://anas.ku93.googlepages.com/post-terakhir.js"></script>
<script>var numposts = 15; var showpostdate = false; var showpostsummary = false; var numchars = 100; </script>
<script src="http://Blog Sahabat/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=rp">
</script>

</div>

Screenshot:
recent


Sekian untuk kali ini bagaimana cara Membuat Recent Post | Artikel Terbaru Dengan Scroll semoga bermanfaat.
Share this article :

0 komentar:

Speak up your mind

Tell us what you're thinking... !

Featured Post 8

Juragan Gosip

Blogger Themes

 
Support : Creating Website | Johny Template | Mas Template
Proudly powered by Blogger
Copyright © 2011. Juragan Gosip - All Rights Reserved
Original Design by Creating Website Modified by Adiknya