Cara Menciptakan Widget Recent Post Ringan Di Blog

Recent post atau sanggup di sebut terkenal postingan merupakan fitur berfungsi menampilkan artikel yang terpopuler yang sering di baca oleh pengunjung. di semua blog niscaya memiliki recent post ini biar memudahkan pengunjung leluasa melihat artikel yang ingin mereka baca. widget sederhana ini juga sanggup menjadikan efek konkret untuk kemajuan blog anda, walaupun simple tetapi banyak manfaat yang sanggup di ambil.

Recent post atau sanggup di sebut terkenal postingan merupakan fitur berfungsi menampilkan Cara Membuat Widget Recent Post Ringan Di Blog

Tampilan recent post banyak jenisnya menyerupai ada gambar dan goresan pena yang menarik pengunjung untuk mengeklik. pada artikel ini aku akan membagikan script recent post ringan dan elegan untuk anda, jadi tidak memerlukan jaringan yang kencang untuk load widget ini. aku mengambil sebagian script nya oleh theme viomag menjadi desain ulang.

Lihat Juga : Cara Memasang Tag Keyword Otomatis Agar Artikel SEO

Cara Memasang Widget Recent Post Terbaru

1. Theme > Edit HTML, cari </style> dengan cara CTRL+F.
2. Salin dan paste script css di bawah ini, sempurna 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"; }

3. Simpan themplate.
4. Buka sajian Tata letak > tambah widget, kemudian salin dan pastekan script di bawah ini kedalamnya dan save.

<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>

Lihat Juga : Cara Membuat Tampilan Blog Menjadi Mode Malam