Info Penting

Tutorial Blogger Terlengkap Sistematis dilengkapi Video Tutorial

T utorial blogger di internet sangat banyak pilihannya, anda bisa memilih tutorial mana yang akan anda ikuti dan praktikkan supaya anda bi...

Artikel Terbaru

Membuat Tombol Show Hide Gambar - Text di Blog (spoiler)

30 Sep 2010 - - 24

Tombol Show Hide pada Blog (spoiler) ini berfungsi untuk menyembunyikan gambar atau text yang terlalu panjang sehingga bisa menghemat tempat posting. bisa juga digunakan untuk menyembunyikan gambar unik atau gambar yang mengejutkan pembaca.contohnya lihat di posting disini.

Untuk cara-caranya silahkan ikuti tutorial berikut:
  1. Login kehalaman admin blog anda
  2. CoPas code yang ada dibawah ini kedalam posting atau sidebar anda.
  3. selesai.
Berikut Codenya:
<div style="text-align: center;"><div class="button-spoiler"><input value="Contoh Tombol Spoiler" 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 = 'Sembuntikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampak'; }" type="button"></div><div class="spoiler"><div style="display: none;"><br /><br /> <div style="text-align: left; padding: 10px; border: 3px inset #333; font-size: small;"><br /><br /><br /><br />Silahkan tulis text atau gambar disini <br /><br /><br /><br /><br /><br /> </div></div></div></div>


Penjelasan Code:
Yang saya blok silahkan anda isi dengan teks atau kode gambar yang ingin anda sembunyikan.

kalau di Kaskus untuk membuat spoiler caranya menggunakan kode berikut:

[spoiler=pesan]isi pesan[/spoiler]

Selamat mencoba, semoga bermanfaat.

24 komentar

  1. thanks kawand ada HTML nya,. ^_^

    jalan-jalan ke Blog ku kawand hehee
    http://bontangkreatif.blogspot.com/

    BalasHapus
  2. MANTAPZ GAN NICE POST !!!
    KUJUNGI http://www.duniapascalle.blogspot.com

    BalasHapus
  3. Wah mantab gan artikelnya......

    visit my blog donk....
    http://www.artikelkomputer.net/

    BalasHapus
  4. Wah mantab gan artikelnya......

    visit my blog donk....
    http://www.artikelkomputer.net/

    BalasHapus
  5. ... thanks artikel yg bermanfaat sekali !

    BalasHapus
  6. templatenya pikirku facebook :D mantap templatenya

    BalasHapus
  7. makasih dah bagi2 ilmunya, ringan dan jelas

    BalasHapus
  8. @All: makasih kunjunganya, semoga bermanfaat.

    BalasHapus
  9. lum mudeng cara masukin kode gambar,,..

    BalasHapus
  10. yang kurang jelas mengenai memasukan kode gambar, bisa baca posting ini:
    http://www.mrmung.com/2010/12/cara-mendapat-hosting-gambar-gratis.html

    BalasHapus
  11. Trimakasih sangat mas broo, tutorial ini sangat mempesonakan diriku, izin sedot..!!

    Visit: www.frangkyblog.blogspot.com

    BalasHapus
  12. tapi bro kalo pngen bikin di artikel posting gimana yaakunujngin dong http://baguzzzen.blogspot.com/

    BalasHapus
  13. Nice info, perlu dicoba juga nih tipsnya.

    BalasHapus
  14. izin nyoba gan..buat hiding banner partner saya...dh tll bnyk..mksh infonya ya

    BalasHapus
  15. sipp tutornya.. mampir kak
    http://pakarilmu.web.id
    PAKAR ILMU

    BalasHapus
  16. Mantap bos...
    udah ak pake..
    please visit my blog...
    http://blackroom13.blogspot.com

    BalasHapus
  17. Bermanfaat bro
    show hide dipasang
    :D

    BalasHapus

Follow Me


Iklan

Tutorial Blogger

Arsip Blog