Membuat Recent Post Dengan 2 Tampilan

Agldcnet - Membuat recent post dengan 2 tampilan.??? mungkin ada yg sudah pernah tau, tpi mungkin juga banyak yg blum tau..., recent post ini biasanya dipakai untuk website News Paper/Berita, tapi kali ini kita akan coba implementasikan ke bLog...heee,..

dengan bermodal kan,,,feed..biasa saja...oke langsung aja deh daripada bingung..lihat gambar terlebih dahulu

http://tekno-fo.blogspot.com/

Nah untuk pemasangan di blog anda..silahkan..ke

1.Copy kode dibawah ini, lalu letakan di atas </style>

    img.label_thumb{float:left;border:1px solid #e5e5e5;background:#eee;height:55px;width:55px;margin:0 5px 5px 0;padding:5px}
    img.label_thumb:hover{border:1px solid #bbb;background:#fcfcfc}
    .label_with_thumbs{float:left;width:100%;min-height:auto;margin:0 auto;padding:0 auto}
    ul.label_with_thumbs li{min-height:67px;clear:both;margin:0 0 5px;padding:0 0 5px}

2. Letakan script berikut tepat dibawah kode <body>

<script src='http://jamu-martin.googlecode.com/files/label.js' type='text/javascript'/>

3. Buka rancangan > Tambah Gadget > edit text/html

4. Copi pastekan kode berikut ini....

    <script type="text/javascript">
    var numposts = 1;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 60;
    </script>
    <script src="/feeds/posts/default/-/Pemrograman Web?orderby=updated&alt=json-in-script&callback=labelthumbs" type="text/javascript">
    </script>

    <script type="text/javascript">
    function recentpostslist(json) {
    document.write('<ul>');
    for (var i = 0; i < json.feed.entry.length; i++)
    {
    for (var j = 0; j < json.feed.entry[i].link.length; j++) {
    if (json.feed.entry[i].link[j].rel == 'alternate') {
    break;
    }
    }
    var entryUrl = "'" + json.feed.entry[i].link[j].href + "'";//bs
    var entryTitle = json.feed.entry[i].title.$t;
    var item = "<li>" + "<a href="+ entryUrl + '" target="_blank">' + entryTitle + "</a> </li>";
    document.write(item);
    }
    document.write('</ul>');
    }
    </script>
    <script src="http://tekno-fo.blogspot.com/feeds/posts/summary/-/Nasional?max-results=5&alt=json-in-script&callback=recentpostslist">
    </script
    <ul>
    <a style="float:right;font:normal 10px Arial;padding:5px 0;" href="http://tekno-fo.blogspot.com/search/label/Nasional">More Post »</a></ul></script>

Ket :

Yang Berwarna Kuning adalah Label yang ingin di tampilkan dengan Thumbs/image
Yang Berwarna Hijau adalah URL Blog anda
Yang Berwarna Merah isi dengan Label yang lain, jangan disamakan dengan label yang menggunakan Thumbs/image ,karena nanti bisa bertabrakan/ akan muncul 2 link yang sama

Simpan lalu lihat hasilnya .... :D

Membuat Recent Post Dengan 2 Tampilan

Label