Widget Daftar Posting Yang Telah Diperbaharui Oleh Admin

Post Perbaharui


Widget yang menampilkan sebuah posting yang telah diupdate oleh administrator blog.




Untuk Pemasangannya pada Blogspot

1. Blogger, Dasboard dan pilih menu Tata Letak
2. Tambahkan HTML/Javascript
3. Copy code dibawah ini dan paste


<ol id="posts-diperbaharui"></ol>


Menambahkan CSS
4. Template, Edit HTML, Copy kode dibawah ini dan paste diatas kode ]]></b:skin>

li.perbaharui {
    list-style: none;
    height:60px;
    overflow:hidden;
    font-size:80%
}
.thumbnail-perbaharui {
    float:left;
    margin:5px 10px 0 5px
}
.tanggalnya {
    display:block;
    font-size:90%
}

Menambahkan Javascript
5. Cari kode </body>, copy Javascript dibawah ini dan paste diatas kode </body>


<script type='text/javascript'>
//<![CDATA[
function updatedPosts(a) {
    if (document.getElementById("posts-diperbaharui")) {
        var e = a.feed.entry,
            title, img, link, date, content = "",
            ct = document.getElementById("posts-diperbaharui");
        for (var i = 0; i < 7; i++) {
            for (var j = 0; j < 7; j++) {
                if (e[i].link[j].rel == "alternate") {
                    link = e[i].link[j].href;
                    break
                }
            }
            var title = e[i].title.$t,
                pd = e[i].published.$t.substring(0, 10),
                date = pd.replace(/-/g, "/");
            if ("media$thumbnail" in e[i]) {
                img = e[i].media$thumbnail.url
            } else {
                img = "http://isi_dengan-alamat-alamat-gambar-untuk-posting-yang-tidak-memiliki-gambar"
            }
            content += '<li class="perbaharui"><img src="' + img.replace(/\/s72-c/, "/s40-c") + '" class="thumbnail-perbaharui" alt="thumb" height="40px" width="40px"/>';
            content += '<strong><a href="' + link + '" target="_blank">' + title + '</a></strong><span class="tanggalnya"> diposkan pada ' + date + "</span></li>";
        }
        ct.innerHTML = content
    }
}

function getScript(url) {
    var s = document.createElement("script");
    s.type = "text/javascript";
    s.src = url;
    document.body.appendChild(s)
}
getScript("http://nama_blog.blogspot.com/feeds/posts/summary?alt=json-in-script&orderby=updated&max-results=7&callback=updatedPosts"); 
//]]>
</script> 


6. Ganti alamat yang saya mark dengan alamat gambar anda, untuk memberi gambar pada posting yang tidak memiliki gambar
7. Ganti alamat blog yang saya beri garis bawah dengan alamat blog anda
8. Save Template dan lihat hasilnya

17 Responses to "Widget Daftar Posting Yang Telah Diperbaharui Oleh Admin"

  1. wah bagus widgetnya gan, bagi yang nungguin perbaruan dari postingan :D

    ReplyDelete
  2. buat berat gak?

    ReplyDelete
  3. wah keren juga nih widget saya pasang di blog ah

    ReplyDelete
  4. Selalu ada tutor ilmu ngeblog baru disini..ijin nyoba diblog ane gan..

    ReplyDelete
  5. Keren Tuh Coba Dulu Gan :D , Berat Ga Ya ?

    ReplyDelete
  6. keren gan , izin praktek buat blog saya

    ReplyDelete
  7. kebetulan, lagi butuh buat blog ane. Thanks..... :-bd

    ReplyDelete
  8. cocok gan, buat blog ane mantap

    ReplyDelete
  9. Wkwkwk mantap juga nih widgetnya tapi agakberat dikit yanih widgetnya , makasih mas infonya

    ReplyDelete
  10. Disini tutronya keren-keren \o/ :-bd

    ReplyDelete
  11. wah mantap tuh :D
    izin cobayah :D

    ReplyDelete