Cara Menampilkan Gambar/Thumbnail Postingan Hanya di Homepage Blog

HaiSob, pada kesempatan ini saya akan membagikan mengenai bagaimana cara menampilkan gambar postingan hanya di homepage saja. Ada banyak alasan sehingga ingin menampilkan gambar hanya di homepage atau ingin menampilkan gambar di homepage berbeda dengan gambar di postingan, tiap orang pasti beda alasannya.

Tutorial ini mungkin sudah tidak asing lagi untuk para Bloggers senior, tapi misalkan anda seorang Newbe (seperti saya) dalam dunia Blog dan belum tahu cara menyembunyikan gambar yang ada di postingan dan hanya menampilkannya di homepage blog maka berikut ini saya bagikan triknya.

Menampilkan Gambar Postingan Hanya pada Homepage Blog


Menampilkan Gambar Hanya di Homepage dan menyembunyikannya di postingan

Jadi tutorial berikut ini kita akan mencoba menyembunyikan gambar tertentu yang kita inginkan yang ada pada artikel/postingan blog dan gambar hanya akan tampil pada homepage blog.

Cara 1: Menampilkan gambar postingan hanya pada homepage Blog di Blogger


1. Di Blog Blogger 😊
2. Pilih menu Template ➔ Edit HTML
Cara Menampilkan Gambar/Thumbnail Postingan Hanya di Homepage Blogger
Template - Edit HTML

3. Letakan kode dibawah ini di atas kode ]]></b:skin> atau di atas </style>
.gambarku {display:none}
4. Pada saat anda membuat postingan, masuk ke mode HTML kemudian sisipkan kode class="gambarku" pada kode gambar yang ingin kamu sembunyikan di postingan. Contoh penerapannya adalah seperti dibawah ini:
<img class="gambarku" src="https://4.bp.blogspot.com/-nAOJ13BqXj4/WZ51mzr2pZI/AAAAAAAAIkY/JtJMuvlUHKgCMtF2AQQD5YHFXZquz1LvACLcBGAs/s600/haisob-blogger.jpg" height="233" width="320" />
Jika sudah selesai tinggal publikasikan artikelnya dan lihat hasilnya. Oh iya jika ada banyak gambar di postingan dan salah satunya ingin sobat tampilkan hanya di Homepage maka letakanlah gambar yang sudah di tambahkan kode di paling atas artikel.

Cara 2: Menampilkan gambar postingan hanya pada homepage Blog di Blogger


Cara berikut ini mungkin lebih mudah atau lebih simple karena sobat tidak perlu masuk ke edit template blog. Nah langsung saja berikut adalah caranya.

Pada saat membuat postingan pilih mode HTML bukan COMPOSE dan sisipkan kode style="display: none;" pada gambar anda. Contoh penerapannya adalah seperti dibawah ini:
<img style="display: none;" src="https://4.bp.blogspot.com/-nAOJ13BqXj4/WZ51mzr2pZI/AAAAAAAAIkY/JtJMuvlUHKgCMtF2AQQD5YHFXZquz1LvACLcBGAs/s600/haisob-blogger.jpg" height="233" width="320" />
Kode warna hijau diatas adalah ukuran gambarnya, silahkan disesuaikan.

Sekian cara menampilkan gambar postingan hanya pada homepage, selamat mencoba.
Join This Site