Ok sobat sebagai lanjutan postingan kemarin widget recent post Blogger (Part 2) maka kali ini saya akan membagikan parttiganya widget recent post untuk Blogger blog (Part 3), widget ini menampilkan artikel terlama ehhh artikel terbaru di blog kita, hehehe. Ok langsung saja...

How add Recent Post Widget on Blogger Blog (Part 3)
Widget Recent Post Untuk Blogger Blog (Part 3)

Berikut adalah kodenya:

<script style="text/javascript" src="https://cdn.rawgit.com/Brando07/share/master/recentpost-seocips-3.js"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = true;
var showcommentslink = true;
var posts_date = true;
var post_summary = true;
var summary_chars = 70;</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showlatestpostswiththumbs"></script>
<a style="font-size: 9px; color: #CECECE; float: right; margin: 5px;" href="http://www.seocips.com/2016/01/widget-recent-post-untuk-blogger-blog-part-3.html">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'/>
<style type="text/css">
img.recent-post-thumb {padding:2px;width:65px;height:65px;float:left;margin: 0px 10px 10px; background: #fff; border: 1px solid #69B7E2;}
.recent-posts-container {font-family: 'Oswald', sans-serif;  float: left;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container li {position:relative;padding:5px 0px;min-height:65px; list-style-type: none; margin-bottom: 5px;}
ul.recent-posts-container {counter-reset: countposts;list-style-type: none;}
ul.recent-posts-container li:before {content: counter(countposts,decimal);counter-increment: countposts;z-index: 2;position:absolute; left: 15px; font-size: 13px;font-weight: bold;color: #fff;background: #69B7E2;padding: 4px 10px; border-radius: 100%;}
.recent-posts-container a { text-decoration:none; }
.recent-post-title a {font-size: 13px; text-transform: uppercase; color: #2aace3;}
.recent-posts-details {margin: 5px 0px 0px 92px; }
.recent-posts-details a{ color: #777;}
</style>


Cara memasang widget Recent Posts di Blogger

Step 1. Di Blogger dan pilih blog yang ingin di pasangi widget ini
Step 2. Pilih Layout kemudian pilih Add a gadget dimana kamu ingin meletakan widget
Step 3. Muncul pop-up window, kemudian pilh HTML/JavaScript:

How to Add Recent Posts Widget on Blogger

Step 4. Masukan kode diatas di kotak ini.
Step 5. Save dan selesai. Kini Recent Post Widget Blogger (Part 3) telah terpasang di blog kamu. Salam Blogger.
0 Komentar untuk "Widget Recent Post Untuk Blogger Blog (Part 3)"