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........



  1. Pertama masuk dulu ke akun Blogger
  2. Lalu klik Rancangan 
  3. klik tambah Gadget lalu pilih Html/Java script 
  4. 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

Keterangan :
angka yang berwarna merah ganti dengan jumlah postingan yang ingin anda tampilkan..

6. Dan klik SIMPAN

10 Responses to "Cara Pasang Widget Recent Post/Artikel Terbaru"

  1. thanx udh share,,makasih infonya

    BalasHapus
  2. @kankerpayudara yup
    @OBK sama" gan

    BalasHapus
  3. @komakblogger maksudnya apa gan, kok nungu berapa lama...

    BalasHapus
  4. kok saya nggak bisa ya sob?
    mungkin ada yang salah kali kodenya .
    :)

    BalasHapus
  5. enggak kok sob coba aja lagi....

    BalasHapus
  6. terimakasihh atas ilmunya !!

    BalasHapus

Jangan Menulis Komentar Mengandung
SPAM, SARA, P*RNO Atau KATA KASAR..!!