Iklanheader(ada)

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.

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.

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.ekopriantoblogs.top",
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๐Ÿ˜‚


0 Response to "Cara Membuat Widget Recent Post Keren Dan Simple Seperti Di Blog Ini"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1 ada

Iklan Tengah Artikel 2

Iklan Bawah Artikel ada