Pada kesempatan kali ini saya akan share cara untuk membuat widget pada blog yakni Recent Post Grid Thumbnail. widget ini merupakan widget yang menampilkan post / artikel terbaru dari blog sobat, dan menyajikanya dalam bentuk grid / kotak . recent post sendiri juga ada yang berbentuk list . tp pada tutrial kali ini saya akan share yang berbentuk grid.
Baca juga : " Cara membuat kotak script "
Untuk membuat recent post gridnya sobat hanya tinggal membuat widget baru dengan cara masuk ke blogger. kemudian tataletak , Tambahkan widget . pilih widget HTML. kemudian pastekan kode di bawah ini .
<div id='bp_recent'></div>
<script src="https://googledrive.com/host/0B-wlJZNCsAtTLWtoZGpta2Y2ZUE" type="text/javascript"></script>
<script style='text/javascript'>
var numberOfPosts = 10;
var showPostDate = false;
var showSummary = false;
var titleLength = 0;
var showCommentCount = false;
var showThumbs = true;
var showNoImage = true;
var imgDim = 70;
var imgFloat = 'left';
var myMargin = 3;
var mediaThumbsOnly = true;
var showReadMore = false;
</script>
<script src='http://hammitech.blogspot.co.id/feeds/posts/summary?max-results=10&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>
<script src="https://googledrive.com/host/0B-wlJZNCsAtTLWtoZGpta2Y2ZUE" type="text/javascript"></script>
<script style='text/javascript'>
var numberOfPosts = 10;
var showPostDate = false;
var showSummary = false;
var titleLength = 0;
var showCommentCount = false;
var showThumbs = true;
var showNoImage = true;
var imgDim = 70;
var imgFloat = 'left';
var myMargin = 3;
var mediaThumbsOnly = true;
var showReadMore = false;
</script>
<script src='http://hammitech.blogspot.co.id/feeds/posts/summary?max-results=10&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>
Sebelum sobat menyimpan widgetnya edit terlebih dahulu kode script di atas. sobat hanyaperlu mengedit kode yang saya beri tanda warna biru.
Jika sudah klik save . dan lihat sendiri hasilnya .
var numberOfPosts = 10 : Jumlah post yang akan di tampilkanvar imgDim = 70; : Ukuran gambar http://hammitech.blogspot.co.id : Alamat Website sobat
Jika sudah klik save . dan lihat sendiri hasilnya .
3 komentar
terima kasih gan triknya 100% work lanjutkan memberi info yg bermanfaat bgi pra blogerrs gan..
Oke gan . thanks
Nice gan, ijin bookmark ya
EmoticonEmoticon