Cara Membuat Widget Recents Post Seperti VioMagz Terbaru

Recents post atau artikel terbaru yang dijadikan widget pada bagian sidebar blog dirasa cukup memberikan manfaat tersendiri bagi blog tersebut, karena dengan itu setiap pengunjung yang mengunjung sebuah artikel akan selalu melihat update-an terbaru dari blog tersebut dan apabila menarik maka akan menambah jumlah pengunjung baru untuk artikel terbaru yang di update.

Hal ini tentu akan meningkatkan trafik kunjungan dari visitor anda, dengan begitu ada kemungkinan untuk widget recents post ini akan memberikan efek penambahan pengunjung yang lebih baik tentunya untuk setiap artikel terbaru yang telah anda posting.

Sebelumnya, jika recents post yang tersebar di internet untuk blogger sudah cukup banyak, namun tentu saja pada artikel kali ini cukup berbeda karena recents post yang saya bagikan berasal dari template legendaris dari mas sugeng yaitu VioMagz.

Source kode dari recents post ini saya ambil dari template tersebut dan dapat  diterapkan pada template apa saja asalkan masih menggunakan platform blogger,hehe.
Okee ... berikut adalah langkah membuat widget recents post blogger seperti viomagz yang sangat keren.

Cara Membuat Widget Recents Post Seperti VioMagz Terbaru

1. Masuk ke dashboard blogger anda, dan klik pada menu Theme / Tema.

2. Pilih Edit Tema dan masuk pada bagian edit html nya.

3. Pastekan css berikut ini di atas </style>
/* Artikel Terbaru */
.artikel-terbaru ul li {
border-bottom: 2px dotted #d0e0e3;
padding-bottom: 8px;
margin-bottom: 8px;
font-weight: 500;
}
.list-label-widget-content ul li, .LinkList ul li, .PageList ul li {
border-bottom: 2px dotted #d0e0e3;
padding-bottom: 5px;
}
.artikel-terbaru ul li:before, .list-label-widget-content ul li:before, .LinkList ul li:before, .PageList ul li:before {
content: "\f14b";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
margin-right: 6px;
}
.artikel-terbaru ul li:before {
content: "\f14b";
}
.list-label-widget-content ul li:before {
content: "\f07b";
}
.LinkList ul li:before {
content: "\f14c";
}
.PageList ul li:before {
content: "\f249";
}
4. Kemudian save template / tema tersebut.

5. Lalu pastekan kode script berikut pada bagian widget HTML di sidebar anda dengan cara masuk ke tata letak blogger.
<div class='artikel-terbaru'>
<script>
function artikelterbaru(e){document.write("<ul>");for(var t=0;t<e.feed.entry.length;t++){for(var r=0;r<e.feed.entry[t].link.length&&"alternate"!=e.feed.entry[t].link[r].rel;r++);var n="<li><a href="+("'"+e.feed.entry[t].link[r].href+"'")+'">'+e.feed.entry[t].title.$t+"</a> </li>";document.write(n)}document.write("</ul>")}
</script>
<script src="/feeds/posts/summary/?max-results=8&alt=json-in-script&callback=artikelterbaru"></script>
</div>
6. Save / simpan dan lihat hasilnya.

nahh .. begitulah cara singkat untuk membuat widget recents post keren seperti viomagz yang bisa saya bagikan kepada anda, semoga bermanfaat dan terima kasih atas kunjungannya.
Nurhadi Bachtiar
Sebaik-baik manusia adalah yang bermanfaat bagi orang lain. Tidak akan putus amalan seseorang kecuali 3 hal "Sedekah Jariyah, Ilmu yang Bermanfaat, dan Do'a Anak yang Shaleh."

Related Posts

Posting Komentar

Subscribe Our Newsletter