Cara Memasang Widget Artikel Terbaru Responsive di Blog

Cara Pasang Recent Post/Artikel Terbaru di Blog Responsive,- Widget Recent Post atau Artikel Terbaru adalah Sebuah Widget yang bisa dipasang oleh pemilik Blog yang bermanfaat untuk memberitahukan kepada pengunjung mengenai artikel terbaru atau artikel yang baru di Update. Ada banyak sekali Blog diluar sana yang membagikan Cara Memasang Artikel Terbaru ini. dan Kali ini saya juga akan membagikannya.

Widget Recent Post atau Artikel Terbaru terdapat dua Jenis. yaitu yang pertama dengan menggunakan gambar atau Thumbnail dan yang kedua hanya judul saja. Kedua jenis Recent post ini sama saja, namun bila anda menginginkan yang responsive atau fast Loading bisa menggunakan yang judul saja. karena tidak menggunakan gambar widget ini sangat responsive.

Dan Kali ini saya akan membagikan Cara memasang widget artikel terbaru menggunakan Judul saja. yang akan membuat Loading Blog tidak terlalu berat serta sangat responsive. untuk tutorialnya bisa anda ikuti dibawah ini.

Cara Memasang Artikel Terbaru Responsive di Blog

1. Pertama Silahkan Masuk Dasboard - Tata Letak - Tambahkan Gadget dan Pilih Menu HTML/Java Script

2. Kemudian Silahkan Judul Widget Bisa Recent Post, Artikel Terbaru atau Terserah anda. Selanjutnya pada kolom bawah silahkan Isi dengan Kode CSS dibawah ini.

<ul id="recent-posts"></ul>
<script>
//<![CDATA[
var homePage = "http://blogespada.blogspot.com/",
numPosts = 7;
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"><strong><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></strong></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>

Pengaturan

Ganti var homePage: Dengan URL Blog anda
Ganti numPosts: Dengan Jumlah Artikel yang ingin ditampilkan

3. Terakhir Tinggal Simpan dan Lihat Hasilnya.

Baca: Cara Memasang Random Post Responsive di Blog

Demikian Artikel Mengenai Cara Pasang Artikel Terbaru Responsive di Blog, Sekian Tutorial Blog yang dapat saya bagikan dan Semoga Bermanfaat.