Selasa, 03 Februari 2015

Cara Membuat Widget Daftar Post Berdasarkan Label Dengan Gambar


By on 00.42


Cara Membuat Widget Daftar Post Berdasarkan Label Dengan Gambar. Kembali lagi Blog Jona Rendra hadir memberikan informasi mengenai widget blogger lebih tepatnya widget post. Widget yang satu ini ditampilkan menurut kategori dari blog kita. Dilihat dari tampilannya, terdapat thumbnail post, judul post, deskripsi, tanggal dan jumlah komentar serta tombol read more.

Widget yang satu ini menurut saya cocok dipasang di halaman beranda blog saja, dengan di beri tag kondisional home page. Supaya membuat blog anda terkesan seperti website magazine yang memiliki banyak widget di halaman beranda, tetapi sedikit di halaman posting. Sebab, apabila dipasang pada sidebar, terlihat tidak menarik. Langsung saja saya berikan cara pemasangannya di blogger.

Cara Membuat Widget Post Label Dengan Thumbnail


DEMO Widget

Kode HTML


<style>
img.recent_thumb {padding:1px;width:60px;height:60px;float:left;margin:0 5px 5px 10px;}.recent_posts_with_thumbs {float: right;width: 100%;min-height: 70px;margin: 5px 0px 5px 0px;font-size:12px;}ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:65px;}.recent_posts_with_thumbs a {text-decoration:none;}.recent_posts_with_thumbs strong {font-size:10px;}
</style>
<script src='https://sites.google.com/site/blogjonarendra/data/postlabel.js'/>
<script>
var numposts = 5;var showpostthumbnails = true;var displaymore = true;var displayseparator = true;var showcommentnum = true;var showpostdate = true;var showpostsummary = true;var numchars = 200;
</script>
<script src="http://jonarendra.blogspot.com/feeds/posts/default/-/Blogger?orderby=published&amp;alt=json-in-script&amp;callback=showrecentpostswiththumbs">
</script>

Kustomisasi

5 pada var numposts berarti jumlah post yang ditampilkan
showpostthumbnails = true untuk menampilkan thumbnail, false untuk tidak
200 pada var numchars merupakan jumlah karakter pada deskripsi
Ganti jonarendra.blogspot.com dengan url blog anda
Blogger merupakan contoh label blog ini, ganti dengan label blog anda

Tutorial Pemasangan

1. Masuk ke Blogger lalu Tata Letak / Layout
2. Tentukan kolom, lalu klik tambah gadget
3. Copy kode HTML dari widget ini, lalu paste ke dalam HTML/Javascript
4. Edit edit sedikit sesuai panduan kustomisasi, terakhir Simpan.

Mudah kan pemasangannya? Tampilannya yang sederhana dan simpel tidak membuat loading blog jadi berat alias ringan. Kalau ingin berkreasi lagi, silahkan tambahkan beberapa CSS buatan anda supaya lebih menarik. Sekian info dari Blog Jona Rendra yang berjudul Cara Membuat Widget Daftar Post Menurut Label Dengan Gambar, semoga bermanfaat.

Sumber : jonarendra.blogspot.com


About The Blogger

"Belumkah datang waktunya bagi orang-orang yang beriman, untuk tunduk hati mereka mengingat Allah dan kepada kebenaran yang telah turun (kepada mereka), dan janganlah mereka seperti orang-orang yang sebelumnya telah diturunkan Al Kitab kepadanya, kemudian berlalulah masa yang panjang atas mereka lalu hati mereka menjadi keras. Dan kebanyakan di antara mereka adalah orang-orang yang fasik." (QS. Al Hadid 57 : 16)

0 komentar:

Posting Komentar