Rabu, 20 Juni 2012

SHARE AJA : MEMBUAT RECENT POST PER LABEL

Do you want to share?

Do you like this story?

YOUR GOOGLE ADSENSE CODE HERE (300x250)
YOUR GOOGLE ADSENSE CODE HERE (300x250)
SHARE AJA. Membuat Recent Post per Label - Jika kita mempunyai suatu blog semacam SHARE AJA ini, tentu akan terlihat lebih professional jika pada blog kita mempunyai Recent Post per Label yang tertata rapi.  Pada tutorial kali ini, Saya akan berbagi cara membuat recent post berdasarkan label dengan ada thumbnail pada gambar yang ada pada postingan terbaru kita. Widget ini akan otomatis menampilkan update posting kita hanya pada label/kategori yang tentunya bisa anda pilih sendiri label mana yang akan ditampilkan.

Dengan menyajikan lebih banyak menu dan pilihan menu bisa jadi pembaca akan banyak mengklik postingan-postingan terbaru yang tertata rapi sesuai dengan labelnya. Nah bagi anda yang tertarik untuk mempraktekkannya, silahkan ikuti langkah berikut ini.

Cara Membuat Recent Post Per Label With Thumbnail

1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget
4. Masukkan kode css berikut di atas kode ]]></b:skin>
img.label_thumb{float:left; padding:5px; border:1px solid #8f8f8f; background:#D2D0D0; margin-right:10px; height:55px; width:55px}
img.label_thumb:hover{background:#f7f6f6}
.label_with_thumbs{float:left; width:100%; min-height:70px; margin:0px 10px 2px 0px; adding:0}
ul.label_with_thumbs li{padding:8px 0; min-height:65px; margin-bottom:10px}
.label_with_thumbs a{}
.label_with_thumbs strong{}
5. Lalu cari kode </head> dan letakkan kode di bawah ini tepat di atas
<script src='http://adablogku.googlecode.com/files/lebelgambar.js' type='text/javascript'/>
6. Simpan Template jika sudah selesai.

Langkah-langkah di atas adalah untuk mengkostumisasi template. Jika sudah selesai kita ke langkah berikutnya untuk menambahkan recent post per label, yaitu :

7. Pilih Tata Letak lalu Tambah Gadget >> HTML/Javascript
8. Kemudian masukan kode berikut ini:
<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = false;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 80;</script>

<script type="text/javascript" src="/feeds/posts/default/-/NAMALABEL?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
9. Kita dapat menkostumisasi tampilan dengan mengubah kode yang berwarna merah. Dan ganti teks NAMALABEL dengan nama label yang akan ditampilkan.

10. Simpan jika sudah selesai.

Selamat mencoba, semoga berhasil dan juga semoga dapat memberikan manfaat.

YOU MIGHT ALSO LIKE

7 comments:

seniman fotografi mengatakan...

wow ini yg lagi di cari, ijin praktek sob..^_^

DUNIA BLOG mengatakan...

Informasi tips trik template blog yang mantap, terima kasih telah berbagi, salam blogger persahabatan

DUNIA BLOG 88 mengatakan...

Mantap mas bro, sukses selalu, happy blogging

JOHAN PURNOMO mengatakan...

@DUNIA BLOG 88Terima kasih atas atensi anda

zamroniys mengatakan...

mantap gan.. makasih..

kang three mengatakan...

nice info gan... ne mesti dicoba gan :) sukses selalu ya gan..
mampir jga gan ke blog ane di
http://infokangthree.blogspot.com

Zamrud Hijau mengatakan...

Info yang baguz sekali untuk disimak.....
Bermanfaat sekali untuk saya....

Mohon kunjungan baliknya yaa....
Dan saya juga sangat berterima kasih sekali kalau anda berkenan FOLLOW dan Backlink Blog sederhana saya.... :-)

Title: Zamrud News
( www.zamrudnews.com )

Posting Komentar

Advertisements

YOUR ADVERTISEMENTS HERE (300x250)

Advertisements

YOUR ADVERTISEMENTS HERE (300x250)