Cara Membuat Recent Post dengan Thumbnail & Ringkasan

Widget-Recent-Post-Umstrieduatiga

Membuat widget recent post atau tulisan terbaru bisa dibuat dengan tampilan yang menarik. Widget recent post ini tidak hanya menampilkan judul saja tetapi juga thumbnail (gambar) dan sinepet (ringkasan) isi post terbaru blog.

Tampilan recent post yang kita buat ini sama seperti widget popular post milik blogger.com. Widget yang juga menampilkan cuplikan gambar dan ringkasan post ini selaras dengan widget popular post. Bagaimana cara membuatnya?

Cara Membuat Recent Post dengan Thumbnail & Ringkasan
1. Login ke Dashboard 
2. Pilih Tata Letak kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:


<style type='text/css'>
img.recent_thumb {padding:1px;width:72px;height:72px;border:0;
float:left;margin: 10px 10px 5px 0px;}
.recent_posts_with_thumbs {float: left;width: 100%;margin: 10px 10px 5px 0px;padding: 0;font-size:13px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;}
.recent_posts_with_thumbs strong {font-size:12px;}</style>
<script style='text/javascript' src='http://recent-post-techkgp.googlecode.com/files/recent%20post_www.techkgp.com.js'></script>
<script style='text/javascript'>
var numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150; </script>
<script src='http:// www.umstrieduatiga.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>

Ganti www.umstrieduatiga.blogspot.com dengan alamat url blog sendiri

5. Jangan lupa Simpan Widget jika sudah selesai. 


SHARE

Milan Tomic

Hi. I’m Designer of Blog Magic. I’m CEO/Founder of ThemeXpose. I’m Creative Art Director, Web Designer, UI/UX Designer, Interaction Designer, Industrial Designer, Web Developer, Business Enthusiast, StartUp Enthusiast, Speaker, Writer and Photographer. Inspired to make things looks better.

  • Image
  • Image
  • Image
  • Image
  • Image
    Blogger Comment
    Facebook Comment

19 comments:

  1. di blog saya kok gk muncul ya recent postnya

    ReplyDelete
    Replies
    1. buka layoutnya blognya, cek apakah agan sudah menambahkan widget recent postnya

      Delete
  2. Keren sob tipsnya.. makasih.

    ReplyDelete
  3. Keren sob artikelnya sangat bermanfaat. Terimakasih akan saya coba langsung di blog saya perawatanwajah.co.id

    ReplyDelete
  4. makasih gan, work.. saya sudah pasang di blog saya : http://free-ssh-update.blogspot.com/

    ReplyDelete
  5. mau ane coba kawan tutornya
    http://acemaxs31.com/obat-darah-tinggi-tradisional/

    ReplyDelete
  6. makasih bnayak buat tutornya,, ijin coba yaa...


    http://toko-greenworld.com/

    ReplyDelete
  7. lah um ini kira2 kalau di hapus gambarnya bisa gak? terimakasih

    ReplyDelete
    Replies
    1. widget recent post standar bawaan blogger ada opsi untuk tidak menampilkan gambar, so coba aja gan !!!

      Delete
  8. Makasih om

    www.guiltyanimesub.com
    guiltyanimenews.blogspot.com
    mikublogging.blogspot.com

    ReplyDelete
  9. Terimakasih gan... ini sangat membantu untuk saya yang masih pemula...

    kunjungi juga blog saya...

    tenpouindrei.blogspot.com

    ReplyDelete
  10. Mas, kok nggak jalan ya widget-nya?

    ReplyDelete
  11. Gan saya sdh psg widged recent post trs sdh cb jg bkn postingan tp di sidebar recent post saya kok kosong ya
    Pencerahan nya dong

    ReplyDelete
  12. gak muncul di gan http://www.dendietutorial.com/

    ReplyDelete
  13. Wuihh kerrennn

    alx-bot.blogspot.com

    ReplyDelete
  14. ijin dicoba gan...

    ReplyDelete
  15. Gan, cara membuat recent post biar di branda blog bagaimana gan?
    Mohon solusi nya.

    ReplyDelete