2 Cara Menampilkan Postingan Terbaru Di Sidebar Blog (Blogger) Keren Ringan

Pada artikel kali ini saya memberikan cara menampilkan postingan terbaru di blog yang unik dan sangat ringan hanya menggunakan widget. Fungsi memasang postingan terbaru ini adalah supaya postingan yang baru kita buat akan muncul di setiap halaman yang dibuka oleh pengunjung. Hal ini akan menambahkan view blog anda yakni ketika pengunjung melihat postingan terbaru pada widget blog anda, maka kemungkinan besar postingan terbaru anda akan banyak yang dilihat pembaca.

Jadi, setelah membaca penjelasan diatas saya asumsikan anda sudah paham apa itu fungsi dan guna menampilkan postingan terbaru di sidebar blog. Adapun pada tutorial kali ini yang akan saya berikan bagaimana tutorialnya cara membuat postingan terbaru di blog. Sebelumnya saya akan memberikan contoh tampilannya pada gambar dibawah ini.

Terdiri dari postingan paling baru menyusun ke bawah disertai tangggal postingan (bulan, tanggal dan tahun) dibawah judul artikel. Untuk tutorialnya silahkan Anda ikuti langkah-langkahnya.

Langkah #1 – Buka Dashbor blogger anda masuk ke Tata Letak > Tambahkan Gadget (dimanapun yang anda inginkan).

Langkah #2 – Silahkan pilih Gadget bernama Html/JavaScript maka muncul jendela baru. Berikan nama judul (pada kolom pertama) dan pastekan script dibawah ini dibawah kolom ke 2 (setelah kolom judul) 

<div class=”recentpoststyle” style=”padding:0.5rem;”>

<script type=”text/javascript”>

function showlatestposts(e){for(var t=0;t<posts_no;t++){var r,s=e.feed.entry[t],n=s.title.$t;if(t==e.feed.entry.length)break;for(var a=0;a<s.link.length;a++)if(“alternate”==s.link[a].rel){r=s.link[a].href;break}n=n.link(r);var i=”… baca selengkapnya”;i=i.link(r);var l=s.published.$t,o=l.substring(0,4),u=l.substring(5,7),c=l.substring(8,10),m=new Array;if(m[1]=”Jan”,m[2]=”Feb”,m[3]=”Mar”,m[4]=”Apr”,m[5]=”May”,m[6]=”Jun”,m[7]=”Jul”,m[8]=”Aug”,m[9]=”Sep”,m[10]=”Oct”,m[11]=”Nov”,m[12]=”Dec”,”no content”in s)var d=s.content.$t;else if(“summary”in s)var d=s.summary.$t;else var d=””;var v=/<S[^>]*>/g;if(d=d.replace(v,””),document.write(‘<li class=”recent-post-title”>’),document.write(n),document.write(‘</li><div class=”recent-post-summ”>’),1==post_summary)if(d.length<summary_chars)document.write(d);else{d=d.substring(0,summary_chars);var f=d.lastIndexOf(” “);d=d.substring(0,f),document.write(d+” “+i)}document.write(“</div>”),1==posts_date&&document.write(‘<div class=”post-date”>’+m[parseInt(u,10)]+” “+c+” “+o+”</div>”)}}

</script>

<script type=”text/javascript”>

var posts_no = 8;var posts_date = true;var post_summary = true;var summary_chars = 80;</script>

<script src=”/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts”>

</script><a style=”font-size: 9px; color: #CECECE;margin-top:10px;” href=”https://hardifal.com/” rel=”nofollow”><abbr title=”Hardifal”;>Recent Posts Widget By</abbr></a>

<noscript>Your browser does not support JavaScript!</noscript>

<style type=”text/css”>

.recentpoststyle {counter-reset: countposts;list-style-type: none;}

.recentpoststyle a {text-decoration: none;color: #49A8D1;}

.recentpoststyle a:hover {color: #3987E8;}

.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 1;position:relative;font-size: 15px;font-weight: bold;color:#fff;background:#002F63; margin:13px 5px 0px -6px;line-height:30px;width:30px;height:30px;text-align:center;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;}li.recent-post-title{margin-bottom: 5px;padding: 0;}

.recent-post-title a {color: #000;text-decoration: none;font: bold 15px “Avant Garde”,Avantgarde,”Century Gothic”,CenturyGothic,AppleGothic,sans-serif;}

.post-date {font-size: 11px;color: #999;margin:5px 0px 15px 32px;}

.recent-post-summ {border-left:1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 10px; font: 15px Garamond,Baskerville,”Baskerville Old Face”,”Hoefler Text”,”Times New Roman”,serif;}

</style></div>

Keterangan : Tanda mark script diatas

Silahkan ganti dan edit tampilan postingan terbaru ini sesuai dengan yang anda sukai / inginkan.

Tutorial yang kedua ini adalah untuk anda yang tidak mau berurusan dengan script, yakni dengan menggunakan fitur Gadget blogger. Tapi ingat, tampilannya tentu akan jauh berbeda dengan cara yang pertama, cara ke-2 ini akan tampil biasa akan tetapi lebih ringan.

Langkah #1 – Buka Tata Letak > Tambahkan Gadget

Langkah #2 – Scroll ke bawah dan pilih Gadget Feed lalu masukan URL Feed blog anda sebagai berikut :

Https://namabloganda.com/feeds/posts/default

Itulah cara menampilkan postingan terbaru di blog keren tanpa ribet yang bisa anda coba gunakan pada blog anda.