Cara Memasang Widget Recent Post di Blogger

Cara Memasang Widget Recent Post di Blogger Sederhana. Widget recent posts atau bisa disebut dengan artikel terbaru merupakan salah satu cara untuk memperkecil bounce rate blog dengan memberikan informasi untuk postingan terbaru pada pembaca.

Dengan begitu akan lebih membantu pembaca agar lebih mudah untuk mengetahui postingan-postingan yang paling terbaru pada blog tersebut tanpa harus beralih pada halaman depan atau beranda.

Selain simple, widget recent posts ini memiliki loading yang cukup ringan, jadi tidak perlu khawatir akan menambah beban loading pada blog Anda.

Cara Memasang Widget Recent Post di Blogger

Silakan simpan kode CSS berikut di atas kode </head> atau &lt;/head&gt;&lt;!--<head/>--&gt;

<style type='text/css'>
/*<![CDATA[*/
ul#recent-posts{width:100%;margin:0 auto;padding:0!important;list-style-type:none}
ul#recent-posts li{background:#FFF;padding:0!important;margin-bottom:10px;overflow:hidden;width:100%;height:auto;box-shadow:2px 2px 3px rgba(0,0,0,.05)}
ul#recent-posts li img{width:90px;height:70px;margin:0 10px 0 0;float:left}
ul#recent-posts li .title_post{padding:10px!important;line-height:1;position:relative;margin-left:90px}
ul#recent-posts li a{color:#333;font-family:inherit;font-size:14px;font-weight:500;text-decoration:none}
ul#recent-posts li a:hover{color:#8e8efa}
ul#recent-posts:after{content:"";display:block;clear:both}
/*]]>*/
</style>

Jika tampilanya kurang sesuai dengan keinginan Anda, Anda bisa menyesuaikan beberapa bagian untuk menyesuaikan tampilannya dengan template yang Anda gunakan.

Kemudian silakan simpan kode javascript berikut di atas kode </body>

<script type='text/javascript'>
//<![CDATA[
var homePage = window.location.origin,numPosts = 5;
function downloadJSAtOnload(){var d=document.createElement("script");d.src="https://cdn.rawgit.com/Indzign/InSEO/3c89739e/recentposty.js",document.body.appendChild(d)}window.addEventListener?window.addEventListener("load",downloadJSAtOnload,!1):window.attachEvent?window.attachEvent("onload",downloadJSAtOnload):window.onload=downloadJSAtOnload;
//]]>
</script>

Perhatikan kode yang ditandai, ubah angkanya sesuai kebutuhan.

Setelah itu Simpan tema.

Terakhir silakan simpan kode berikut di sidebar melalui tata letak/layout pada gadget HTML/JavaScript.

<ul id="recent-posts"></ul>

Selesai, lihat hasilnya di blog Anda.

• DEMO

Begitulah Cara Memasang Widget Recent Post di Blogger, semoga bermanfaat bagi Anda.

Share Share Tweet Share Share Share

KLIK

DONASI VIA PAYPAL Bantu berikan donasi jika artikelnya dirasa bermanfaat. Donasi Anda membantu Admin untuk lebih giat lagi dalam membagikan template blog yang berkualitas. Terima kasih.