Skip to content Skip to sidebar Skip to footer

Widget Atas Posting

Cara Membuat Widget Recent Post Keren Dan Simple Seperti Di Blog Ini

halo ketemu lagi dengan saya. Pada postingan kali ini saya akan berbagi tutorial cara membuat widget recent post yang simple,keren dan ringan. SEO friendly juga tentunya. Contohnya bisa kamu lihat di bagian sidebar blog ini.

Tapi sebenarnya apa sih widget recent post itu? Widget recent post adalah sebuah widget untuk blog yang berfungsi untuk menampilkan postingan terbaru blog kita. Jadi memudahkan pengunjung untuk melihat apa saja postingan terbaru di blog kita.
Cara membuat widget recent post atau postingan terbaru di blogger
Cara membuat widget recent post atau postingan terbaru di blogger
Dengan adanya widget ini diharap pengunjung betah berlama lama di blog kita. Karena membuka buka postingan terbaru blog kita. Tentunya ini bermanfaat untuk meningkatkan page view blog kita.

Ok langsung menuju tutorialnya. Tutorialnya sangat mudah. Silakan simak caranya dibawah ini.

Cara membuat widget recent post atau postingan terbaru di blogger

Yang pertama dilakukan yaitu
Pilih tata letak>>>tambahkan widget>>>lalu pilih html/javascript>>>lalu copy kode script dibawah ini.

<style scoped='' type="text/css">
ul#recent-posts{list-style:none;margin:0;padding:0}li.recent-posts{display:block;clear:both;overflow:hidden;list-style:none;border-bottom:1px solid #e3e3e3;word-break:break-word;padding:10px 0;margin:0;}
li.recent-posts:last-child{border-bottom:0;}
li.recent-posts a{color:#444;}li.recent-posts a:hover{color:#444;text-decoration:underline}
</style>
<ul id="recent-posts"></ul>
<script>
//<![CDATA[
var homePage = "http://www.ekopriantoblog.id",
numPosts = 10;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank" rel="nofollow">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script>

Lalu paste dan simpan.

Ganti alamat url yang berwarna hijau dengan alamat blog kamu.
Dan ganti angka 10 yang berwarna merah dengan jumlah postingan yang akan ditampilkan.

Ok itu dia cara membuat widget recent post yang keren dan simple. Bila ada pertanyaan masalah ini bisa ditanyakan di kolom komentar. see ya😂

6 comments for "Cara Membuat Widget Recent Post Keren Dan Simple Seperti Di Blog Ini"

  1. Oke gan nanti saya coba. Thanks gan

    ReplyDelete
  2. kok punya saya tidak ada tombol tambah widget nya ya gan ?

    ReplyDelete
  3. Caranya mudah sekali ya, hanya tinggap copy-paste. kalau punya saya ada photonya.

    ReplyDelete