Cara Pasang Show dan Hide Di Postingan Blog Dengan Mudah

Zona Blog – Mempercantik blog kadang menjadi penghalang bagi pemilik blog itu sendiri, biasanya dia merasa blognya jelek,tampilannya kurang bagus dan seterusnya.

Memang nge-blog sebenarnya seperti seseorang yang sedang garap skripsi, atau bangun rumah, tidak ada habisnya, selalu saja merasa ada yang kurang, ini dan itu.

Cara Membuat Show dan Hide Di Postingan

Namun, biasanya persaan kurang sempurna tersebut justru bisa menjadi kekurangannya. Mengapa? Sebab, sifat dasar manusia termasuk blogger, adalah kurang puas.

Pada prinsipnya, kita akan menganggap blog orang lain lebih bagus daripada blog kita sendiri. Perasaan ini, sebenarnya juga terjadi pada pemilik blog lainnya.

Terlepas dari perasaan pemilik blog tersebut, pada kesempatn kali ini, kami akan berbagi salah sau tips menambah kolom yang dapat ditutup dan dibuka [Show and Hide] tanpa kode java script yang ribet.

Fungsi Kode Show Hide

Ada banyak fungsi penting untuk kode show hide ini, antara lain :

  • Mempercepat Loading Blog, artinya saat kolom ini tidak dibuka, maka pengunjung tidak membutuhkan loading yang lama.
  • Meringkas, khusus blog yang melampirkan file, baik PDF, Doc, Gambar yang ingin ditampilkan, tentu akan terasa banyak jika menampilkan semuanya. Namun tidak jika kita gunakan kode ini.
  • Menambah pundi-pundi penghasilan, khusus bagi pemain Google Adsense, jika and bisa men-setting unit iklan disekitaran kode ini, kemungkinan besar jumlah klik dari pengunjung juga akan lebih banyak, sehingga penghasilan bisa meningkat.

Cara Pasang Kode Show Hide Di Konten Blog

Langsung saja pada tahapan penting, silahkan ikuti langkah-langkah berikut :

  • Login ke Dashbor Blog anda
  • Silahkan Buat Postingan Baru
  • Ganti “Teks” untuk wordpress, dan mode “compose” untuk blogspot, dan Masukkan Kode Di bawah ini:

<div style=”margin-top: 5px; margin: 20px;”>
<div class=”smallfont” style=”margin-bottom: 2px;”>
<b>BACA ONLINE?</b>: <input onclick=”if

(this.parentNode.parentNode.getElementsByTagName(‘div’)

[1].getElementsByTagName(‘div’)[0].style.display != ”) {

this.parentNode.parentNode.getElementsByTagName(‘div’)

[1].getElementsByTagName(‘div’)[0].style.display = ”;

this.innerText = ”; this.value = ‘TUTUP‘; } else {

this.parentNode.parentNode.getElementsByTagName(‘div’)

[1].getElementsByTagName(‘div’)[0].style.display = ‘none’; this.innerText =

”; this.value = ‘BUKA‘; }” style=”margin: 0px; padding: 0px; width: 150px;” type=”button” value=”BUKA” />
</div>
<div class=”alt2″ style=”border: 0px inset; margin: 0px; padding: 0px;”>
<div style=”display: none;”>

KONTEN ANDA DISINI

</div>
</div>
</div>
</center>

  • Sebelum simpan, kembalikan pada mode semula.

Keterangan Kode :

  • Ganti kata-kata TUTUP, BUKA, sesuai dengan keinginan
  • Ganti GRAY, sesuai warna keinginan anda.
  • Ganti KONTEN ANDA DISINI, dengan isi yang anda inginkan, misalnya link gambar, tulisan, PDF, Doc dan lain-lain.

Demikian informasi tentangĀ Cara Mudah Pasang Show dan Hide Di Postingan Blog, semoga informasi ini bisa membantu sahabat yang ingin mempercantik dan design blog.

You may also like...

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *