Jumat, 15 Maret 2013

Menampilkan Thumbnail Hanya di Halaman Depan

Menampilkan Thumbnail Hanya di Halaman Depan. Mungkin trik ini sobat sudah pada tau, ya itung2 sharing buat pemula aja, bagaimana cara menampilkan thumbnail gambar hanya pada halaman depan (home page), dan tidak akan tampil pada halaman postingan. Apabila menggunakan platform WordPress istilah ini disebut Featured Image.

Supaya lebih jelas silahkan lihat contoh gambar, pada halaman depan blog saya muncul thumbnail gambar, sedangkan pada halaman postingan akan hilang / tidak ditampilkan.



thumbnail

Langkah ke-1 (Pastikan gambar sudah diupload)

Sebelum melanjutkan ke cara menampilkan thumbnail hanya pada halaman depan, pastikan gambar sudah diupload ke Blogger. Bagi yang belum tau caranya (Baca: Cara Menyimpan Gambar di Blogger)

Langkah ke-2 (Menyimpan kode Kondisional di Template)

1. Login ke Blogger
2. Klik Template > Edit HTML
3. Simpan kode di bawah ini sebelum </head>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.thumbnail {display:none}
</style>
</b:if>
4. Simpan Template

Langkah ke-3 (Saat membuat Postingan)

Pada saat membuat postingan, masuk ke mode HTML kemudian sisipkan kode class="thumbnail" sebelum kode gambar. Penerapannya kurang lebih seperti contoh di bawah
<img class="thumbnail" src="link-gambar-yang-sudah-diupoad" alt="penjelasan gambar" />
pada contoh gambar di atas, kode yang saya pakai seperti ini :
<img class="thumbnail" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqfigg5EEhXARI44LUcPQf-fgfuNeIR6oTpFp4-e-qgBgfIPDbru_UC7DcEEmeHZO6zvFzViXFFWYZF8xkOt9yjtYo9HHN4zu5HoLdp6lVChZeExvKYe0SB3eDOgAUje70NT2jjm22Z4g/s1600/blogger-3d.png" alt="blogger logo" />
Apabila masuk mode Compose, gambar itu muncul, akan tetapi setelah di Publish akan disembunyikan pada halaman posting.

Semoga bermanfaat buat sobat

Tidak ada komentar:

Posting Komentar