Home » Teknologi » Cara Membuat Spoiler Pada Postingan Blog

Cara Membuat Spoiler Pada Postingan Blog

Posted by Ritzberbagiilmu Sunday, 14 July 2013 1 comment

Cara Membuat Spoiler Pada Postingan Blog - Kali ini saya akan mengshare tentang Cara Membuat Spoiler Pada Postingan Blog. Sebelumnya ada yang tau gak apa itu Spoiler? Spoiler adalah Salah satu cara kita untuk menghemat tempat pada postingan kita dikarenakan postingan yang memiliki gambar/script yang panjang dengan memakai Spoiler akan menghemat tempat sekaligus loading semakin cepat. 

Lalu Bagaimana Cara Membuat Spoiler tersebut di Postingan Blog kita? Disni saya akan membahasnya tentang Bagaimana Cara Membuat Spoiler di Postingan Blog kita. Berikut langkah-langkah yang harus anda jalankan untuk membuat Spoiler tersebut.

Langkah-Langkah Membuat Spoiler di Postingan Blog:

Langkah 1, Yang pasti anda harus Login terlebih dahulu di Blog anda.

Langkah 2, Kemudian buat Postingan Baru

Langkah 3, Jika sudah, Pada menu Entri, Pilih mode penulisan HTML (jangan Compose), karena jika anda menggunakan Compose, Code Script ini tidak akan berfungsi.

Langkah 4, Masukkan Kode Script dibawah ini
Code Script:
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;">
 Judul Spoiler:
<input value="Show"style="margin: 0px; padding: 0px; width: 60px;
font-size: 12px;" 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 = 'Show'; } else { this.parentNode
.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0]
.style.display = 'none'; this.innerText = ''; this.value = 'Close'; }" type="button">
</div>
<div class="alt2" style="border: 2px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">Letakan Gambar/Code Script/Postingan Anda di sini<br>
</div>
</div>
</div>
Keterangan:
Merah : Anda bisa pilih ganti dengan kalimat lain untuk membuka Spoiler
Biru : Anda bisa pilih ganti dengan kalimat lain untuk menutup Spoiler
Hijau : Anda bisa pilih ganti dengan kalimat lain untuk memberikan judul pada Spoiler
Ungu : Anda bisa isikan dengan Gambar/Script/Postingan yang akan anda berikan

Notice
Untuk menyisipkan gambar gunakan Atribut <center><img src="Letakkan URL Gambar anda disini"></center>

Langkah 5, Jika sudah selesai Klik Publikasikan, sekarang lihat hasilnya.


Sekian artikel dari saya tentang bagaimana Cara Membuat Spoiler Pada Postingan Blog. Semoga bermanfaat bagi anda dan dapat menambah ilmu anda dalam dunia Blog. Jika anda mengalami kesulitan bisa tinggalkan komentar dibawah ini oke:)

Categories: icon
Pin It

Related Post:



1 komentar:

  1. Anonymous19 July 2013 at 15:56

    Artikel yang bermanfaat gan, ntar akan ane coba iy.


    Oh iya gan gimana caranya membuat Data Blog seperti contoh di blog agan?? mohon bantuannya iya. :)

    jawab di Berbagi Ilmu gan. ane tunggu.

    ReplyDelete

Jika ada sebuah Link yang sudah tidak bisa di gunakan, silahkan tinggalkan komentar di bawah ini untuk di Update

Blog ini sudah menerapkan Dofollow :
1. Berkomentar dengan Baik dan Sopan.
2. Tidak komentar SPAM.
3. Tidak menempatkan Link Hidup saat berkomentar.

Copyright © 2012 RitzNews.com. All rights reserved.

Super SEO created by Blogger Tuts | Published by GalleryBloggerTemplates.com