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 blogger.com
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.fajarshinichy.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
Ganti www.fajarshinichy.blogspot.com dengan alamat url blogmu sendiri, dan mengganti kode yang berwarna merah agar sesuai dengan keinginan atau tampilan blogmu.
5. Jangan lupa Simpan Widget jika sudah selesai.
0 comments:
Post a Comment