Cara Pasang Widget Recent Post/Artikel Terbaru

Cara Pasang Widget Recent Post/Artikel Terbaru - Assalmualaikum gan, hari ini cuaca di sini hujan tapi enaknya posting tapi di sini saya mau berbagi ilmu sedikit, yaaaaahhh nambah-nambah pahala dikit lah.
setelah tanya-tanya sana sini akhirnya di kasih juga scriptnya.

Langsun aja dech, berikut adalah sedikit cara-caranya, perhatian baik-baik ya,,,,
semoga cara ini bermanfaat........

Pertama masuk dulu ke akun Blogger
Lalu klik Rancangan
klik tambah Gadget lalu pilih Html/Java script
lalu copy kode di bawah ini

<style>

img.recent_thumb {padding-right:5px;padding-left:padding-bottom:0px;0px;width:55px;height:55px;border:0;float:left;margin:0 0 5px 0px;}

.recent_posts_with_thumbs {float: left;width: 100%;min-height: 50px;margin: 0px 0px 5px 0px;padding: 0;font-size:13px;font-color:black;}

ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;}

.recent_posts_with_thumbs a {text-decoration:none;}

.recent_posts_with_thumbs normal {font-size:13px;}

</style>

<script style="text/javascript" src="http://bloggerplugins.org/scripts/recentpostswiththumbs.js"></script>

<script style="text/javascript">

var numposts = 7;

var showpostthumbnails = true;

var displaymore = false;

var displayseparator = false;

var showcommentnum = false;

var showpostdate = false;

var showpostsummary = false;

var numchars = 75;

</script>

<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>

5.Jika ingin menambahkan border dan warna background, saya menambahkan kode seperti ini

.recent_posts_with_thumbs {height:auto;width:auto;padding:5px;background:#FFFFFF;border:1px solid #4169E1;}

Jika ingin menganti warna background ganti kode :#FFFFFF ini dengan warna yang anda sukai

dan jika ingin mengganti ketebalan border ;border:1px solid ubah ukuran 1px menjadi yang anda inginkan dan jika anda ingin menganti warna border ganti kode #4169E1 lalu tempatkan kode di atas di atas kode <style> maka akan menjadi seperti ini

<style>
img.recent_thumb {padding-right:5px;padding-left:padding-bottom:0px;0px;width:55px;height:55px;border:0;float:left;margin:0 0 5px 0px;}
.recent_posts_with_thumbs {float: left;width: 100%;min-height: 50px;margin: 0px 0px 5px 0px;padding: 0;font-size:13px;font-color:black;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;padding-left:0px;padding-right:20px;min-height:50px;list-style:normal;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs normal {font-size:13px;}
.recent_posts_with_thumbs {height:auto;width:auto;padding:5px;background:#FFFFFF;border:1px solid #4169E1;}
</style>
<script style="text/javascript" src="http://bloggerplugins.org/scripts/recentpostswiththumbs.js"></script>
<script style="text/javascript">
var numposts = 7;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = false;
var numchars = 75;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>

maka hasilnya akan seperti ini