Cara Sembunyikan Gambar Dalam Artikel Menjadi Thumbnail Postingan Blog

my_id       Blog    Comment   

Mengenai tulisan di blog, sebuah gambar tentu benar-benar di perlukan, untuk semata-mata memberi rasa penasaran pengunjungnya. Sebenarnya saya selalu menerbitkan tulisan bersama dengan 1 gambar di atas tulisan untuk menjadi thumbnail, harapan saya supaya tampilan di page home menjadi lebih menarik bersama dengan adanya gambar. Namun sesudah saya menulis beberapa artikel, lama-lama saya mulai bahwa gambar di atas tulisan itu tambah mengakibatkan tmpilan artikel saya menjadi tidak baik dan kurang sedap untuk di baca.

Padahal artikel yang bagus itu artikel yang bisa mengakibatkan pembacanya mulai nyaman didalam membaca. Sayapun mulai berfikir ini sebuah artikel bukan komix. Jadi saya rasa gambar tidak benar-benar punyai peran mutlak didalam sebuah artikel, tapi jikalau saya tidak memberi gambar mirip sekali terhadap artikel saya, maka tampilan home page bakal menjadi tidak baik dan kurang memikat, sebab pembacanya tidak meliki rasa penasaran yang kuat, rasa penasaran yang di ciptakan oleh sebuah gambar. 

Dari pada bingung, selanjutnya saya putuskan untuk membawa dampak thumbnail. Jadi gambar atau foto yang saya buat thumbnail ini akan tampil di home page saja dan tidak akan tampil di di dalam artikel.

Bagaimana cara membuat thumbnail atau gambar yang hanya tampil di home page?

1. Masuk blog kalian ya gengs.

2. Pilih template/tema.

3. Edit HTML.

4. Cari kode </head> atau &lt;/head&gt;&lt;!--<head/>--&gt;

5. Pastekan kode di bawah ini di atas kode </head> atau &lt;/head&gt;&lt;!--<head/>--&gt;

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
.thumbnail {display:none}
</style>
</b:if>

6. Simpan template.

Selanjutnya kita akan mencoba untuk membuat postingan dan upload sebuah file gambar dalam postingan tersebut untuk kita jadikan thumbnail dan tidak akan tampil di dalam artikel.

Cara membuat thumbnail gambar tidak tampil dalam artikel.

1. Setelah gambar di upload, kita ganti mode penulisan dari "compose" menjadi "HTML" letaknya ada di pojok kiri atas.

2. Di mode penulisan HTML akan muncul kode seperti di bawah ini.

<div class="separator" style="clear: both; text-align: center;">

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGkO8vZKSdXVe2d0PVKGulsiHB1UaB37rOCIa_PVRKVgNEIBDLnQIsVtdXJ6Ry7ilBqxIXP4mjJ7cOmMKvXP0-RPQO_xKgKPC4OdNC60hnF8MJgGVLJRuntX29UyW3L1woiqZGXz-t7-lk/s1600/mengatasi+pulsa+indosat+sering+terpotong+1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="565" data-original-width="734" height="246" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGkO8vZKSdXVe2d0PVKGulsiHB1UaB37rOCIa_PVRKVgNEIBDLnQIsVtdXJ6Ry7ilBqxIXP4mjJ7cOmMKvXP0-RPQO_xKgKPC4OdNC60hnF8MJgGVLJRuntX29UyW3L1woiqZGXz-t7-lk/s320/mengatasi+pulsa+indosat+sering+terpotong+1.jpg" width="320" /></a></div>

<div>

3. Ganti "separator" menjadi "thumbnail", hingga menjadi seperti ini.

<div class="thumbnail" style="clear: both; text-align: center;">

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGkO8vZKSdXVe2d0PVKGulsiHB1UaB37rOCIa_PVRKVgNEIBDLnQIsVtdXJ6Ry7ilBqxIXP4mjJ7cOmMKvXP0-RPQO_xKgKPC4OdNC60hnF8MJgGVLJRuntX29UyW3L1woiqZGXz-t7-lk/s1600/mengatasi+pulsa+indosat+sering+terpotong+1.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="565" data-original-width="734" height="246" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGkO8vZKSdXVe2d0PVKGulsiHB1UaB37rOCIa_PVRKVgNEIBDLnQIsVtdXJ6Ry7ilBqxIXP4mjJ7cOmMKvXP0-RPQO_xKgKPC4OdNC60hnF8MJgGVLJRuntX29UyW3L1woiqZGXz-t7-lk/s320/mengatasi+pulsa+indosat+sering+terpotong+1.jpg" width="320" /></a></div>

<div>

Dengan megganti "separator" menjadi "thumbnail" maka gambar tersebut akan otomatis berubah menjadi thumbnail saja dan tidak terlihat di dalam artikel ketika di publikasikan.

Begitulah cara membuat thumbnail postingan blog, dengan gambar tidak terlihat di dalam artikel. Semoga bermanfaat!!!