Cara Sembunyikan Gambar/Tulisan Posting Blog

Published: Wednesday

Terkadang saat kita keasyikan menulis sebuah artikel untuk menjadi bahan postingan di blog tanpa disadari tulisan tersebut sudah terlalu panjang ke bawah. Bahkan bisa dibilang untuk ukuran normal seharusnya kita te;ah membuat 2 postingan. Belum lagi jika dalam artikel yang kita buat disisipi dengan beberapa gambar sebagai pendukung artikel.

Hal ini tentu saja bukan masalah besar bagi kita tapi cukup menghilangkan seni ngeblog, juga mengakibatkan loading halaman blog menjadi berat karena harus memuat begitu banyak tulisan plus gambar. Untuk mengatasi hal tersebut agar laman blog tetap rapi saat pertama kali dikunjungi visitor maka kita harus membagi tulisan tersebut.

Cara membagi tulisan postingan blog yang cukup panjang tersebut bermacam-macam, dari yang menggunakan script yang rumit sampai dengan cara sederhana semisal membagi postingan menjadi "bagian 1 dan bagian 2" tapi cara ini sama saja kita telah membuat 2 postingan.

Nah agar postingan artikel blog kita tetap satu saja maka kita bisa memanfaatkan fungsi hide/show melalui kode html sederhana yang akan kita bahas berikut ini ; ikuti saja langkah-langkahnya sobat tekno ;

1. Buat Tulisan sebagaimana biasanya di bagian Compose

2. Copy kode di bawah ini ;

<div id="spoiler"><div>
<input style="font-size: 13px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'TUTUP GAMBAR'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'LIHAT GAMBAR'; }" name="button" type="button" value="Klik Untuk Melihat" /></div>
<div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;">
BAGIAN YANG AKAN DISEMBUNYIKAN (GAMBAR/TULISAN)
</div><div id="hide"></div></div></div>

3. Klik kotak HTML (kiri atas sebelah compose)

4. Dan paste-kan di atas tulisan atau gambar yang akan disembunyikan

5. Selanjutnya... klik icon lihat gambar

6. Hehe... seperti inilah jadinya sobat tekno, dan jangan lupa untuk save/publish postingan sobat. Sobat juga bisa merubah ukuran huruf dan Kata-kata yang akan tampil pada button (ubah kata/angka yang ditebalkan)

Selanjutnya ; Cara Mengetahui Blog Terinfeksi Malware/Virus

Labels: Blog dan SEO