-->
MASIGNCLEAN101

Cara Membuat Widget Recent Post Responsive di Blog

Bantu Klik Subscribe Teman-teman!
Cara Membuat Widget Recent Post di Blog
Cara Membuat, Memasang, Menampilkan Widget Recent Post Responsive di Blogger - Recent Post dalam arti Postingan Terbaru ini sangat diperlukan bagi para blogger atau website untuk mempermudahkan pengunjung melihat artikel yang baru saja terbit di blog atau web tersebut. Sehingga artikel yang baru terbit tersebut mudah untuk dibaca oleh pengunjung blog atau website.

Recent Post adalah salah satu widget yang sering dipasang dalam suatu blog atau website selain Populer Post dan Random Post


Cara Membuat Recent Post di Blog - Dalam fitur Blogger belum ada fitur untuk Membuat Recent Post, jadi anda harus berusaha sedikit untuk mencari cara membuat recent post di blogger. Ini dia Cara Membuat Recent Post Responsive Fast Loading di Blogger. 

Sebelum memasang widget recent post, anda bisa melihat demonya diatas postingan ini. Jika anda tertarik langsung saja coba :)

Cara Membuat, Memasang, Menampilkan Recent Post Responsive di Blog:

1. Pergi ke "Tata Letak" > "Add Widget atau Tambahkan Widget" > Pilih "HTML/Javascript"
2. Copy dan Paste Script Recent Post dibawah ini ke Widget yang sudah ditambahkan tadi.

<div class="recentpoststyle"> <!--<script src="https://cdn.rawgit.com/Brando07/share/newbe/recent-post-seocips-1.js"></script>--> <script type='text/javascript'> function showlatestposts(a){for(var b=0;b<posts_no;b++){var e,c=a.feed.entry[b],d=c.title.$t;if(b==a.feed.entry.length)break;for(var f=0;f<c.link.length;f++)if("alternate"==c.link[f].rel){e=c.link[f].href;break}d=d.link(e);var g="... read more";g=g.link(e);var h=c.published.$t,i=h.substring(0,4),j=h.substring(5,7),k=h.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 c)var m=c.content.$t;else if("summary"in c)var m=c.summary.$t;else var m="";var n=/<\S[^>]*>/g;if(m=m.replace(n,""),document.write('<li class="recent-post-title">'),document.write(d),document.write('</li><div class="recent-post-summ">'),1==post_summary)if(m.length<summary_chars)document.write(m);else{m=m.substring(0,summary_chars);var o=m.lastIndexOf(" ");m=m.substring(0,o),document.write(m+" "+g)}document.write("</div>"),1==posts_date&&document.write('<div class="post-date">'+l[parseInt(j,10)]+" "+k+" "+i+"</div>")}} </script> <script> var posts_no = 5;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> <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: #000;} .recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 2;position:relative;font-size: 20px;font-weight: bold;color: #fff;background: #69B7E2; margin: 15px 5px 0px -6px; padding: 0px 10px; border-radius: 100%;} li.recent-post-title { padding: 5px 0px;} .recent-post-title { font-family: "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;} .recent-post-title a {color: #444;font-size: 13px; text-decoration: none; padding: 2px; font-weight: bold;} .post-date {padding: 5px 2px 5px 30px; font-size: 11px; color: #999; margin-bottom: 5px;} .recent-post-summ { border-left: 1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 11px; font-family: Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif; font-size: 15px;} </style></div>

3. Ganti Warna Merah dengan Nama blog anda dan berapa postingan yang ingin anda tampilkan di Recent Post tersebut.

Terima kasih sudah berkunjung ke artikel Cara Membuat Recent Post Responsive di Blog. Jangan lupa untuk berlangganan dengan kami dan jangan lupa untuk di share keteman-teman anda yang belum tau soal Recent Posts.
Bantu Klik Subscribe Teman-teman!
Share This :

iWasOtaku

Seorang Blogger Yang Menyukai Hal Tentang Budaya Jepang

Syarat & Ketentuan Berkomentar

1. Jangan cantukan link mati maupun hidup
2. Gunakan bahasa yang dapat dimengerti
3. Jangan spam link
4. Koment yang relevan sesuai dengan topik yang di bahas
5. Jangan copy psate artikel, jika ingin dihargai maka hargailah orang