Skip to main content

follow us


Memperlihatkan postingan terbaru kita kepada pengunjung adalah salah satu cara agar pageview blog kita meningkat. Apalagi untuk anda yang blognya sudah memiliki banyak pengunjung organik dari search engine google. Anda wajib memasang widget yang satu ini, yaitu widget recent post.
Dengan memasang widget recent post pengunjung bisa melihat postingan atau artikel terbaru di blog kita. dan berpeluang untuk meningkatkan pageview blog kita. Ada banyak sekali widget recent post yang sudah dibagikan oleh teman blogger lainnya. Namun kali ini saya akan membagikan salah satu widget saja. Yaitu widget recent post yang simple dan sederhana yang di detakan di bagian sidebar.
Cara pemasangannya pun sangat mudah, Tidak perlu ribet utak-atik kode html, widget langsung bisa dimasang melalui menu layout di blogger.



Hal-hal yang bisa anda sesuaikan atau edit dari widget ini adalah sebagai berikut,
  • Hanya menampilkan judul postingan atau artikelnya saja.
  • Mengganti jumlah postingan yang ditampilkan.
  • Jika anda ingin menapilkan cuplikan atau snippet dari artikelnya, anda juga bisa mengatur panjang cuplikannya.


Widget Recent Post Hanya Judul Postingan


<div id="hlrpsb">
<script type="text/javascript">
function showrecentposts(t){for(var e=0;e<numposts;e++){var n,r=t.feed.entry[e],i=r.title.$t;if(e==t.feed.entry.length)break;for(var d=0;d<r.link.length;d++)if("alternate"==r.link[d].rel){n=r.link[d].href;break}i=i.link(n);var s=r.published.$t,a=s.substring(0,4),o=s.substring(5,7),l=s.substring(8,10),u=new Array;u[1]="Jan",u[2]="Feb",u[3]="Mar",u[4]="Apr",u[5]="May",u[6]="Jun",u[7]="Jul",u[8]="Aug",u[9]="Sep",u[10]="Oct",u[11]="Nov",u[12]="Dec",standardstyling||document.write(""),document.write('<div class="rctitles2">'),standardstyling&&document.write(""),document.write(i),standardstyling&&document.write(""),1==showpostdate&&document.write(" - "+l+" "+u[parseInt(o,10)]+" "+a),standardstyling||document.write("</div>"),document.write("</div>"),standardstyling&&document.write("")}standardstyling||document.write('<div class="bbwidgetfooter">'),standardstyling&&document.write(""),document.write(""),standardstyling||document.write("/div")}
</script>
<script type="text/javascript">var numposts = 10;var showpostdate = false;var standardstyling = true;</script>
<script src="http://domainkamu.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div><a style="font-size: 9px; color: #CECECE; float: right; margin-top: 10px;" href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html" > Recent Posts Widget</a><a style="font-size: 9px; color: #fcfcfc; float: right; margin-top: 10px;" href="http://www.idmarimo.com/2018/12/cara-memasang-widget-recent-post-untuk.html" >Widget Recent Post </a>
<noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #000000;font-size:13px;text-transform:capitalize;}.rctitles2 {padding-bottom:10px;margin-bottom:10px;border-bottom: 1px dotted #cccccc;}
</style>

Keterangan:

  • 10 untuk mengatur jumlah postingan yang ditampilkan
  • #000000 untuk mengatur warna link (untuk merubah gunakan kode warna html)
  • 13px untuk mengatur ukuran font link


Widget Recent Post Dengan Snippet atau Cuplikan


<div id="hlrpsa">
<script type="text/javascript">
function showrecentposts(t){for(var e=0;e<numposts;e++){var n,r=t.feed.entry[e],i=r.title.$t;if(e==t.feed.entry.length)break;for(var s=0;s<r.link.length;s++)if("alternate"==r.link[s].rel){n=r.link[s].href;break}i=i.link(n);var a="...",d=r.published.$t,u=d.substring(0,4),o=d.substring(5,7),c=d.substring(8,10),l=new Array;if(l[1]="Jan",l[2]="Feb",l[3]="Mar",l[4]="Apr",l[5]="May",l[6]="Jun",l[7]="Jul",l[8]="Aug",l[9]="Sep",l[10]="Oct",l[11]="Nov",l[12]="Dec","content"in r)var m=r.content.$t;else if("summary"in r)var m=r.summary.$t;else var m="";var w=/<\S[^>]*>/g;if(m=m.replace(w,""),document.write('<div class="rctitle">'),standardstyling&&document.write("<br/>"),document.write(i),1==showpostdate&&document.write(" - "+l[parseInt(o,10)]+" "+c+" "+u),document.write('</div><div class="rcsumm">'),1==showpostsummary)if(standardstyling&&document.write(""),m.length<numchars)standardstyling&&document.write("<i>"),document.write(m),standardstyling&&document.write("</i>");else{standardstyling&&document.write(""),m=m.substring(0,numchars);var g=m.lastIndexOf(" ");m=m.substring(0,g),document.write(m+a),standardstyling&&document.write("")}document.write("</div>"),standardstyling&&document.write("")}standardstyling||document.write('<div class="bbwidgetfooter">'),standardstyling&&document.write(""),document.write(""),standardstyling||document.write("")}
</script>
<script type="text/javascript">
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://domainkamu.blogspot.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts">
</script></div><a style="font-size: 9px; color: #CECECE; float: right; margin-top: 10px;" href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html"> Recent Posts Widget</a><a style="font-size: 9px; color: #fcfcfc; float: right; margin-top: 10px;" href="http://www.idmarimo.com/2018/12/cara-memasang-widget-recent-post-untuk.html">Widget Recent Post</a>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
.rctitle a{color:#000000;text-transform:capitalize;font-size:13px;}#hlrpsa {color: #999999; font-size: 12px;}.rcsumm {border-bottom:1px dotted #cccccc; padding-bottom:10px;margin-top:5px;}
</style>


Keterangan:

  • 5 untuk mengatur jumlah postingan yang ditampilkan
  • 100 untuk mengatur panjang karakter cuplikan atau snippet
  • #000000 untuk mengatur warna link (gunakan kode warna html)
  • 13px untuk mengatur ukuran font link
  • #999999 untuk mengatur ukuran font cuplikan (gunakan kode warna html)
  • 12px untuk mengatur ukuran font cuplikan



Cara memasangnya sangat mudah seperti pemasangan widget pada umumnya,

1. Masuk ke Blogger  >> Lalu masuk ke menu Layout atau Tata letak  >>  Kemudian klik Add a Gadget atau Tambahkan Gadget. lihat gambar berikut,





2. Dari tab yang baru terbuka, pilihlah HTML/Java script





3. Lalu pastekan salah satu kode yang anda pilih di atas kedalam kotak yang tersedia.
Jangan lupa pada bagian http://domainkamu.blogspot.com diganti dengan url blog anda sendiri.

4. Lalu klik simpan atau save, dan lihat hasilnya di blog anda.

Baca Juga Lainnya:

Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar