Cara Membuat Widget Postingan Terbaru Keren di Viomagz Versi Terbaru

Kembali lagi dengan saya admin expxo, pada kesempatan kali ini saya akan membagikan sebuah tutorial bagaimana Cara Membuat Widget Postingan Terbaru Keren di Viomagz. Widget Postingan Terbaru atau biasa kita kenal sengan sebutan Recent Post pada sebuah Blog diperlukan supaya pengunjung mudah melihat yang baru.

Widget  recent post biasanya di menyundak pada belahan kanan atau pada sidebar blog, tapi tidak menjadi  satu keharusan sih pada sisi kanan semua tergantung keinginan sobat. karena tampilan ini membuat pengunjung blog atau visitor di blog sobat bisa mengetahui postingan terbaru, dan artikel yang baru dipublikasipun dapat langsung di baca.

Cara Membuat Widget Postingan Terbaru Keren di Viomagz

1. Silahkan kamu login ke Blogger.com dengan menggunakan Gmail kamu.
2. Masuk ke menu TEMA > Klik Edit HTML dan pastekan kode dibawah ini tepat dibawah kode /* Blogger CSS

/* Recent Post */
.artikel-terbaru ul li {
    border-bottom: 2px dotted $(label.border.color);
    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 $(label.border.color);
    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"; 
}

3. Kalau sudah silahkan klik SIMPAN, selanjutnya
4. Masuk ke menu TATA LETAK > Tambahkan Gadget Sidebar
5. Klik tanda + pada pilihan HTML/JavaScript
6. Silahkan masukan kode HTML dibawah ini tepat dikolom tersebut, dan tuliskan judulnya Artikel Terbaru.

<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=10&alt=json-in-script&callback=artikelterbaru"></script>
</div>

7. Kalau sudah silahkan klik SIMPAN dan Selesai.

Bagaimana mudah bukan untuk tutorial Cara Membuat Widget Postingan Terbaru Keren di Viomagz bagi kamu yang masih bingung atau ada pertanyaan lain seputar blogger silahkan komen di kolom komentar dibawah artikel ini.

Bagikan Artikel ini