Cara Membuat Recent Post Keren Blogspot Ala Template Viomagz

Cara Memasang Recent Post Keren Ala Template Viomagz - Artikel Terbaru atau Recent Post widget sidebar blog memiliki fungsi sebagai informasi mengenai update artikel terbaru di sebuah blog atau website. Dengan adanya Recent Post, pengunjung dapat mengetahui bahwa blog atau website yang mereka kunjungi telah melakukan update artikel terbaru.

Recent Post widget terletak dibagian sidebar atau samping sebuah blog beserta dengan widget widget lainya seperti popular post, label, iklan sidebar dan widget lainya. Saat ini beberapa template blogger telah menyediakan tampilan recent post yang keren dan responsif.

Artikel Terbaru widget yang ada di beberapa template blog biasanya disertai dengan gambar thumbnail. Namun sayangnya untuk memunculkan widget Recent Post menggunakan thumbnail seringkali menyebabkan loading blog menjadi lama atau lola.

Apalagi disaat ini google telah megupdate alogaritma terbarunya yaitu mobile friendly dengan kecepatan loading tinggi. Blog dengan loading lama akan mudah sekali tergeser oleh blog yang memiliki kecepatan loading tinggi. Untuk mengetahui kecepatan halaman blog Anda, silahkan (Baca: Cara Mempercepat Loading Blog Secara Akurat Menggunakan Google PageSpeed)

Memasang Artikel Terbaru di Blogspot Sidebar (Dafault)

Artikel Terbaru atau Recent Post sebenarnya secara default telah tersedia di blogspot. Untuk memasang secara default Recen Post silahkan pilih: Tata Letak >> Tambahkan Gadget >> Feed. Setelah itu masukkan kode dibawah.


https://www.gratisiana.net/feeds/posts/default?orderby=published

Jangan Lupa ! Ganti tulisan warna merah dengan alamat URL blogspot milik Anda.

Recent Post Keren Tanpa Thumbnail Ala Viomagz 

Mungkin bagi sebagian blogger pastinya tidak asing dengan mas sugeng. Mas sugeng adalah salah satu master blogger indonesia yang sudah malang melintang dalam dunia perbloggingan. Banyak sekali tulisan-tulisan mas sugeng mengenai seputar blogging yang sangat bermanfaat tehadap para blogger nusantara, termasuk Admin pribadi banyak belajar dari beliau. 

Mas sugeng juga memiliki beberapa karya template blogger yang banyak digunakan oleh blogger indonesia. Beberapa template blogger terkenal mas sugeng adalah Evomagz, Fatestmagz, BroSense dan baru-baru template keluaran terbaru yaitu Viomagz. 

Template viomagz memiliki tampilan responsif, seo friendly dan tentunya memiliki kecepatan loading yang baik pula. Sebagaimana widget recent post Viomagz sengaja tidak dilengkapi dengan thumbnail agar loading blog semakin wuzz.

Contoh Recent Post Viomagz
Untuk memasang widget artikel terbaru ala viomagz silakan ikuti langkah-langkah berikut:

  • Login dulu ke akun Anda: Blogger > TemaEdit HTML 
  • Cari kode: ]]></b:skin>
  • Letakkan kode berikut diatasnya
/* Artikel Terbaru */
.artikel-terbaru ul li {
border-bottom: 2px dotted #efefef;
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 #efefef;
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";
}

Sedangkan untuk memasang pada bagian widget samping silakan ikuti langkah-langkah berikut:
  • Login ke “Blogger” > Plih Bagian “Tata Letak” > Plih “Tambahkan gadget“ 
  • Pilih Gadget “HTML/JavaScript“ 
  • Untuk bagian judul silahkan isi sesuai dengan judul recent post yang Anda inginkan. Contoh "Artikel Teranyar"
  • Kemudian bagian konten isi dengan kode berikut ini:
<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=3&alt=json-in-script&callback=artikelterbaru"></script>
</div>

Bagaimana ? Mudah bukan. Demikian tutorial cara membuat recent post keren ala template viomagz, semoga bermanfaat bagi sobat yang sedang belajar blogging. Selamat mencoba semoga berhasil !
Discaimer: Kami tidak bertanggung jawab dunia akhirat terhadap iklan yang tampil di blog, karena iklan berasal dari google dan blog ini hanya sebagai media. Semua penggunaan konten (video, gambar, dan teks) Gratisiana.Net diambil dari label yang bebas untuk didistribusikan. Jika Anda menemukan pelanggaran hak cipta, silahkan hubungi kontak kami. Dengan senang hati kami akan segera menghapusnya.

Berlangganan update artikel terbaru via email:

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel