Cara Membuat Recent Post Warna-Warni By CaraNia.com

Widget Recent Post adalah widget yang menayangkan Artikel-artikel terbaru di blog kita mirip seperti  Widget Popular Post hanya saja Popular Post berisi artikel-artikel yang paling banyak di kunjungi pengunjung blog anda..
Widget recent post juga sangat bermanfaat agar pengunjung tahu artikel apa yang terbaru di blog kita tanpa harus pergi ke homepage. saya sendiri Widget Recent post saya sembunyikan ketika di homepage jika teman-teman ingin seperti saya di hilangkan ketika pada saat di home page silahkan berkomentar di blog saya.. insyaallah besok saya akan buatkan artikelnya jika memang banyak yang mau :)

Cara Membuat Recent Post Warna-Warni By CaraNia.com

1. Masuk ke blogger.com
2. Masuk ke blog anda
3. Pilih Tata Letak atau
4. lalu pilih Tambahkan Gadget
5. pilih HTML/Javascript
6. Dibagian judul isi dengan judul yang anda mau contoh : Artikel Terhangat
lalu di bagian Konten masukan Script Ini

<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/helplogger/recentpoststhumbs.js"></script>
<script style="text/javascript">
var posts_no = 5;
var showpoststhumbs = true;
var readmorelink = false;
var showcommentslink = false;
var posts_date = false;
var post_summary = false;
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://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<link href='http://fonts.googleapis.com/css?family=Ubuntu+Condensed' rel='stylesheet' type='text/css' />
<style type="text/css">
img.recent-post-thumb {width:50px;height:50px;float:right;margin: 5px -5px 0px 0px; border-radius: 100%; padding: 3px;background: #fff}
.recent-posts-container {font-family: 'Ubuntu Condensed', sans-serif; float: left;width: 100%;min-height: 55px;margin: 5px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent-posts-container {list-style-type: none; background: #fff;padding: 0px; }
ul.recent-posts-container li:nth-child(1n+0) {background: #F49A9A; width: 90%}
ul.recent-posts-container li:nth-child(2n+0) {background: #FCD092; width: 90%}
ul.recent-posts-container li:nth-child(3n+0) {background: #FFF59E; width: 90%;}
ul.recent-posts-container li:nth-child(4n+0) {background: #E1EFA0; width: 90%;}
ul.recent-posts-container li:nth-child(5n+0) {background: #B1DAEF; width: 90%;}
ul.recent-posts-container li {padding:5px 10px;min-height:50px; list-style-type: none; margin: 0px 5px -5px 5px; color: #777;}
.recent-posts-container a { text-decoration:none; }
.recent-posts-container a:hover { color: #222;}
.post-date {color:#e0c0c6; font-size: 11px; }
.recent-post-title a {font-size: 14px;color: #444; font-weight: bold;}
.recent-post-title {padding: 6px 0px;}
.recent-posts-details a{ color: #222;}
.recent-posts-details {padding: 5px 0px 5px; }
</style>

8. Jika sudah klik simpan
9. silahkan cek blog anda :)

jika ada yang ingin di tanyakan silahkan ke komentar akan saya jawab komentar anda :)

Related Posts:

Tweet