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>
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.
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.
di blog saya kok gk muncul ya recent postnya
ReplyDeletebuka layoutnya blognya, cek apakah agan sudah menambahkan widget recent postnya
DeleteKeren sob tipsnya.. makasih.
ReplyDeletesama sama gan
Deleteterima kasih kunjungannya
Keren sob artikelnya sangat bermanfaat. Terimakasih akan saya coba langsung di blog saya perawatanwajah.co.id
ReplyDeletemakasih gan, work.. saya sudah pasang di blog saya : http://free-ssh-update.blogspot.com/
ReplyDeletemau ane coba kawan tutornya
ReplyDeletehttp://acemaxs31.com/obat-darah-tinggi-tradisional/
makasih bnayak buat tutornya,, ijin coba yaa...
ReplyDeletehttp://toko-greenworld.com/
lah um ini kira2 kalau di hapus gambarnya bisa gak? terimakasih
ReplyDeletewidget recent post standar bawaan blogger ada opsi untuk tidak menampilkan gambar, so coba aja gan !!!
DeleteTerimakasih gan... ini sangat membantu untuk saya yang masih pemula...
ReplyDeletekunjungi juga blog saya...
tenpouindrei.blogspot.com
Mas, kok nggak jalan ya widget-nya?
ReplyDeleteGan saya sdh psg widged recent post trs sdh cb jg bkn postingan tp di sidebar recent post saya kok kosong ya
ReplyDeletePencerahan nya dong
Sip... www.djtulloh.ga
ReplyDeletegak muncul di gan http://www.dendietutorial.com/
ReplyDeleteijin dicoba gan...
ReplyDeleteGan, cara membuat recent post biar di branda blog bagaimana gan?
ReplyDeleteMohon solusi nya.