Tuesday, January 9, 2018

Cara Membuat Widget Recent Post Sederhana

Cara Membuat Widget Recent Post Sederhana - Recent Post atau Postingan terbaru adalah suatu hal yang menampilkan artikel-artikel terbaru dari blog kita. Nah kali ini saya ingin membagikan Cara membuat widget recent post sederhana. Caranya cukup simpel dan juga tampilannya recent postnya sangat sederhana dan ringan, kenapa sederhana dan ringan? karena hanya menampilkan Judul Postingan saja tanpa adanya embel-embel Gambar Thumbnail ataupun cuplikan teks konten seperti yang ada pada widget Postingan Populer. Untuk lebih jelasnya silahkan liat gambar dibawah ini.

Cara Membuat Widget Recent Post Sederhana

Baca juga

Bagaimana? Sangat sederhana sekali bukan heheh. Jadi bagi yang berminat untuk memasang widget ini di sidebar blognya, silahkan disimak baik-baik langkah-langkah yang akan saya paparkan dibawah ini :

1. Login ke akun Blogger anda terlebih dahulu
2. Masuk ke Menu Tata Letak atau Layout
3. Klik Tambahkan gadget dan pilih HTML/Javascript
4. Copy dan Paste kode 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 = "https://pendidikan-bareng.blogspot.com/",
numPosts = 5;
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>

5. Terakhir klik simpan dan liat hasilnya.

Catatan :
  • Teks warna Merah adalah URL blog yang ditujukan
  • Teks warna Biru adalah Nilai dari jumlah yang ingin anda tampilkan di recent postnya nanti

Semoga Cara Membuat Widget Recent Post Sederhana ini dapat bermanfaat bagi anda, diakhir kata saya ucapkan Terima kasih atas kunjungannya.

Artikel Terkait

Cara Membuat Widget Recent Post Sederhana
4/ 5
Oleh

Berlangganan

Suka dengan artikel di atas? Silakan berlangganan gratis via email

1 komentar:

January 9, 2018 at 11:13 AM delete

warbiazah ilmu nya (y)
coba mampir ke web saya mana tau nambah juga ilmu nya heheh
serbaviral.net

Reply
avatar