Berbagi itu Indah

Sunday 22 February 2015

Cara Membuat Recent Post Dengan Thumbnail di Blog


Di Post sebelumnya ane pernah share tentang "Cara Membuat Recent Post Tanpa Gambar di Blog" , nah kali ini ane akan share tutorial tentang recent post kembali tapi kali ini menggunakan Thumbnail / bergambar di blog , mungkin banyak dari agan-agan yang lebih menyukai sesuatu yang bergambar ketimbang yang hanya tulisan saja , jadi ane akan memberi petunjuk cara membuat recent post dengan thumbnail di blog ini, jika agan tertarik membuatnya bisa menyimak caranya di bawah ini gan :
  • Login ke akun blogger Anda
  • Setelah itu pilihlah rancangan template
  • Lalu pilih Add Widget => Pilihlah HTML/Javascript
  • Copylah Script di bawah ini
<style type='text/css'>.recent_posts_with_thumbs{overflow:auto;height:300px;}img.recent_thumb {padding:1px;width:72px;height:72px;border:1px solid #aaa;border-radius:100px;box-shadow: 3px 3px 0 #333;float:left;margin: 0px 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://kamigajekingdom.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
  • Klik Simpan/Save. -->>> Lalu simpan template anda.
  • Dan Lihatlah Hasilnya ,
NB* Coba agan liat tulisan berwarna "http://kamigajekingdom.blogspot.com/" , agan menggantinya dengan URL Blog agan dan tulisan var numposts = 5 , adalah jumlah ostingan yang akan agan tampilkan di Recent Post tersebut.

Sekian dulu gan Tutorial cara membuat recent post dengan thumbnail di blog , apabila agan-agan memiliki pertanyaan bisa di beritahu melalui komentar, terima kasih
Artikel Terkait




Klik untuk melihat kode: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@

TOP