Loading...
Home » » Cara Membuat Recent Post dengan Thumbnail (Grid Layout)

Cara Membuat Recent Post dengan Thumbnail (Grid Layout)

Diposkan oleh Belajar Bisnis Online Gratis | 15:51 | | 2 komentar »

Cara Membuat Recent Post dengan Thumbnail

Terkadang kita bosan dengan tampilan Recent Post secara default di blogspot yang tidak menyertakan images (thumbnail), serta terbatasnya kuota (hanya 5 artikel). Salah satu cara menghilangkan kebosanan itu yaitu dengan membuat tampilan recent post dengan thumbnail.

Secara desain tampilan ini akan menambah elegan suatu blog dan secara SEO (search engine optimization) menampilkan recent post dengan thumbnail termasuk User Friendly (memberi kemudahan navigasi kepada user).

Langkah-langkah dalam membuat recent post ini adalah :

1. Login ke Dashboard, klik Menu Design;



2. Pada menu Desain, klik Add Gadget, pilih HTML/Javascript;





3. Copy paste kode berikut ke dalam menu HTML/Javascript di atas;

<div id='bp_recent'></div><div class='bp_footer'><small><a id='bp_recent_link' target='_blank' href='http://belajarbisnisonlines.blogspot.com/2011/10/cara-membuat-recent-post-dengan.html' style='padding: 1px 0px 0px 19px;text-decoration:none;'><img src='http://image.bloggerplugins.org/blogger-widgets.png' alt='recent posts with thumbnails for blogger' style='border:none' /></a>Powered By <a href='http://www.bloggerplugins.org/?utm_src=bp_recent' target='_blank' title='blogger widgets'>Blogger Widgets</a> <a href='http://belajarbisnisonlines.blogspot.com/' target='_blank' title='Belajar Bisnis Online Gratis'>BBO</a></small></div>
<script style='text/javascript' src='http://blogergadgets.googlecode.com/svn/trunk/recentposts.js'></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 = 5;
var mediaThumbsOnly = true;
var showReadMore = false;
</script>
<script src='/feeds/posts/summary?max-results=10&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>

4. SAVE

Untuk penempatan optimal agar user friendly, anda bisa meletakkan recent post dengan thumbail di bagian bawah artikel. Tujuannya saat user selesai membaca salah satu artikel blog, dia akan merasa ditawari untuk membuka artikel yang lain.

Ok guys semoga bermanfaat & thx untuk Blogger Widgets atas kodenya :)

Belajar Bisnis Online Gratis

2 komentar

  1. Obat Pembesar // 25 Oktober 2011 08:28  

    bagus banget ni tutorialnya... thanks.

  2. [admin] gamers-zone // 3 November 2011 21:50  

    kk gimana klow script ini diubah buat popular post, bisa ga ya ???

Artikel Terbaru