Widget Recent Post/Posting Terbaru Hanya Judul Saja
Juli 02, 2016
10 Comments

Widget Recent Post/Posting Terbaru Hanya Judul Saja
Widget recent post/posting terbaru yang saya share kali ini adalah widget yang berisi posting terbaru hanya judul saja tanpa gambar thumbnail. Widget ini dapat ditambahkan dengan mudah. Widget ini saya buat dengan sangat sederhana dan simple sehingga tidak akan memberatkan blog anda.Cara Membuat Widget Recent Post/Posting Terbaru Hanya Judul Saja
1. Pada Dasboard akun blogger sobat pilih tata letak
2. Tambahkan gadget HTML/JavaScript
3. Salin kode ini dan letakan pada formulir / gadget yang anda tambahkan tadi.
<ol id="recent-posts"></ol>
<style>
.recent-posts a {
text-decoration:none;
overflow:hidden
}
.recent-posts a:hover {
color:orange;
text-decoration:underline;
}
.author {
display:block;
opacity: 0.7;
}
</style>
<script>
//<![CDATA[
var homePage = "http://alamat blog/", // Your blog homepage
numPosts = 5 ; //Jumlah Posting Yang Ingin ditampilkan
//]]>
</script>
<script>
// Recent Post widget for Blogger
// Author: yOu w4hyOu
// http://www.infokmoe.id
function recentPosts(a) {
if (document.getElementById("recent-posts")) {
var e = a.feed.entry,
title, link, content = "",
ct = document.getElementById("recent-posts");
for (var i = 0; i < numPosts; i++) {
for (var j = 0; j < numPosts; j++) {
if (e[i].link[j].rel == "alternate") {
link = e[i].link[j].href;
break
}
}
var title = e[i].title.$t,
postAuthor = e[i].author[0].name.$t,
pd = e[i].published.$t.substring(0, 10).split("-"),
o = ["Januari", "Februari", "Maret", "April", "Mei", "Juni", "Juli", "Agustus", "September", "Oktober", "November", "Desember"];
content += '<li class="recent-posts"><strong><a href="' + link + '" title="' + title + '" target="_blank">' + title + '</a></strong>';
content += '<span class="author"><time datetime=' + pd.join("-") + '>' + (pd[2] + " " + o[(parseInt(pd[1], 10) - 1)] + " " + pd[0]) + '</time> | <span>' + postAuthor + '</span></span></li>'
}
ct.innerHTML = content
}
}
var you_script = document.createElement('script');
you_script.src = homePage + '/feeds/posts/summary?alt=json-in-script&orderby=published&max-results=' + numPosts + '&callback=recentPosts';
document.getElementsByTagName('head')[0].appendChild(you_script);
</script>
Konfigurasi Widget
Opsi | Keterangan |
---|---|
homePage | Ganti dengan URL blog Anda. |
numPosts | Digunakan untuk menentukan jumlah posting yang akan ditampilkan. |
Untuk gaya dan desain tampilannya silahkan edit CSS nya sesuai dengan keinginan dan kreasi anda
terima kasih sudah berbagi mas :)
BalasHapusTerima kasih, sangat membantu sekali
BalasHapusMantap, kalau dibuat headline news soalnya yang ni loadingnya cepet
BalasHapussepertinya sangat cocok buat blog saya mas :)
BalasHapusterima kasih sudah berkunjung kesini... semoga bermanfaat
HapusMas, Saya sedang modfikasi recent post by tag, namun Saya terkendala dengan jumlah post.
BalasHapusSaya ingin penulisan kodenya jadi lebih singkat seperti halnya widget terakhir diperbaharui milik mas. Misalnya hanya menuliskan tag SEO pada widget.
Juga Saya ingin menghilangkan ini
var numposts = 6;
var showpostthumbnails = true;
var showpostdate = true;
Jadi hanya dalam 1 js, jumlah pos otomatis, tanggal ditampilkan dan gambar juga. Maksudnya tidak ada pengaturan seperti diatas.
Ini sampelnya mas, error mulu saya modifikasinya. :D
http://jsfiddle.net/Anonymousir/6Sr4f/1/
iya mas nanti saya coba dulu ya...
HapusKomentar ini telah dihapus oleh pengarang.
HapusCoba opsi ini http://jsfiddle.net/w4hyou/6Sr4f/5/
HapusKomentar ini telah dihapus oleh administrator blog.
BalasHapus