Tuesday, December 22, 2015

Cara Membuat Featured Post Tanpa Slider ala New Johny Wuss

Featured Post Thumbnail tanpa Slider
POSTINGcara membuat Featured Post Tanpa Slider ala New Johny Wuss di blog blogspot ini, CB buat sekaligus menjawab pertanyaan salah satu pengunjung blog ini, Bung Edi.

Yang dimaksud Featured Post Tanpa Slider yaitu... ya... tampilan posting teratas di halaman depan blog ini.

Tutorial ini tentu saja sudah dipraktekkan di Template New Johny Wuss. Bahkan, sebelum CB share di sini, caraMembuat Featured Post Tanpa Slider ini sudah CB praktekkan juga di template blog SEO ResponsiveThe Simple Theme, yaitu modifikasi Template Johny Ribet yang masih sedang CB modifikasi.

Kenapa "Tanpa Slider"? Karena CB ngikut pendapat bahwa Slider Tidak Baik buat SEO.

Fungsi utama Featured Post adalah menampilkan posting terbaru dan/atau posting yang kita anggap "Killer Blog Post" di halaman depan (homepage).

Cara Membuat Featured Post di Homepage Blogger

1. Ucapkan basmalah, baca doa dulu biar berhasil ^_^2. Di Dashboard Blog, klik Template > Edit HTML
3. Cari (CTRL+F) kode ]]>
4. Copy & Pasta kode berikut ini DI ATASkode ]]>

#featuredpost {background:#000;float:left;margin:10px 10px 20px 10px; padding:0 0 10px;width:97%; position:relative;color:#eee;}
#featuredpost .featured-thumb {float:left; margin:15px; padding:0px;}
#featuredpost .container {height:205px; margin:0 10px 0 0;overflow:hidden; position:relative;font-family: Arial;font-size: 13px;font-style: normal;font-variant: normal;font-weight: normal;line-height: 1.3em;}
.featuredTitle{padding-top:15px;font:17px Oswald;}
.featuredTitle a{color:#f5ff88}
.featuredTitle a:hover{color:#c00}

*** Catatan: Anda bisa mengganti background warna hitam (#000) dengan warna lain. Kode-kodenya ada di Kode Warna HTML.

5. Cari kode dan Copy & Paste kode berikut ini DI ATAS kode


*** Catatan: tulisan yang di-highligt dengan warna merah bisa Anda ganti dengan URL Image versi Anda. Fungsinya sebagai "default image" --akan muncul jika dalam postingan Anda tidak ada gambar.

6. Cari (CTRL+F) kode
dan simpan kode berikut ini DI BAWAHNYA atau DI ATAS










Catatan:
Kode yang dikasi warna merah adalah untuk memunculkan posting terbaru di Featured Post tanpa Slider. Anda bisa mengubahnya jika memunculkan posting terbaru di label/kategori tertentu.

Misalnya, yang mau dimunculkan posting terbaru di label "Blogging", maka ganti menjadi /feeds/posts/default/-/Blogging

7. Save Template!

CAUTION!
Pastikan di template blog Anda sudah ada kode jQuery, seperti ini:



Related video : Cara Membuat Featured Post Tanpa Slider ala New Johny Wuss


0 comments:

Post a Comment