Membuat Widget Recent Post Dengan Thumbnail di Blog - Tentunya widget ini sudah tidak asing lagi bagi para blogger semuanya kecuali yang masih pemula . Recent Post atau disebut degan Postingan Terbaru merupakan widget yang berfungsi sebagai mengetahui Artikel ( Postingan ) yang mana yang paling terbaru di blog tersebut , memakai widget Recent Post di blog tentunya pengunjung juga bisa tahu secara langsung di widget, manakah artikel terbaru di blog tersebut ?? .
Baca Juga --> Cara Membuat Widget Recent Comment Valid HTML5 di Blog
Widget Recent post ini juga disertai Thumbnail ( Gambar ) dan scroll pada recent post tersebut, jadi anda atau pengunjung di blog itu bisa tertarik dengan isi artikel atau konten yang paling terbaru pada blog itu. nah dan jika anda tertarik maka artikel ini lah yang pas buat anda semua .
Demo "Widget Recent Comment"
Untuk anda atau kalian semua jika anda tertarik maka anda bisa membuat widget diatas dengan tutorial berikut ini .
Cara Membuat Widget Recent Post Dengan Thumbnail di Blog
1 .Pertama tama yakni anda harus sign ini dulu ke blogger.com.2. Jika sudah pastikan anda sudah ada pada dashboard > Tata letak
3. kemudian pilih Add Gadget, terus akan muncul laman melayang disitu > Pilih HTML/Javascript
4. lalu masukkan kode dibawah ini terus Copy ke dalam laman melayang tersebut.
<style type='text/css'>Penting !! :
.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://cyber-88.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>
- Warna merah ( red ) ganti dengan url blogspot kalian .
- Warna kuning ( yellow ) itu merupakan Jumlah Banyak Artikel di Dalam Recent Post Tersebut ( Anda juga bisa menggantinya sesuai yang kalian mau )
5. Nah jika sudah klik "Simpan" dibagian bawah kiri .
Nah itulah Cara Membuat Widget Recent Post Dengan Thumbnail di Blog dan semoga kalian bisa membuatnya di blogspot kalian . Demikianlah Artikel tentang Membuat Widget Recent Post Dengan Thumbnail di Blog semoga bermanfaat bagi kita semua wassalamualikum wr.wb
wah boleh juga nih pak scriptnya
ReplyDeleteizin make scriptnya ya
keren recent postnya (y) apalagi tutorialnya lengkap banget :D itu memberatkan blog ga gan ?
ReplyDeleteWalah Gan :D , Bisa Dicoba NIH :D
ReplyDeletekeren gan,,
ReplyDeletelangsung gue pasang di blog gue
resen postnya keren mas, ijin pasang di blog saya ya?
ReplyDeletesaya coba dulu gan :-D
ReplyDeleteMemang setelah saya coba menarik juga ya mas widgetnya makasih yah :D
ReplyDeleteArtikel yang menari nich. . .
ReplyDeletevar numposts = 5;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150;
nilai TRUE artinya IYA, Nilai FALSE artinya TIDAK.
jadi jika ingin memuat banyak Summary . . bisa diganti angka 150 dengan jumlah char yang hendak ditampilkan.
nb:
1/. Yang jadi Main consepnya . . ada di files/recent%20post_www.techkgp.com.js . . jadi lebih aman jika diMIRRORin dulu. . biar jika file di host tersebut dihapus. . . kita mash bisa upload ulang ^_^ [cuman saran]
2/. karena script menghasilkan FLOAT maka script ditaruh dimana aja hasilnya akan tetap saja . . . saran saya masukkan di Footer aja biar ndak nunggu lama untuk mbaca artikelnya. .
3/. jika merupakan Theme bikinan sendiri .. alangkah baik jika script disisipkan di Template bukan di widget [jangan lupa diparse dulu yaa]
ooiiyaa.. . jangan lupa alamat blognya diganti alamat blog teman2 yaa... entar biar keluar Thumb recent Rss punyanya sampean . . bukan milik orang lain ^_^
salam
Girilaya Real Groups