Cara Menciptakan Spoiler Di Blogger

Sebagian orang tentunya sudah tahu apa tersebut spoiler, lagipula jika tidak jarang bermain di forum. Spoiler sudah tentu sering digunakan.

Sebagian orang tentunya sudah tahu apa tersebut spoiler Cara Membuat Spoiler Di Blogger

Sebelumnya bila ada yang belum tahu apa tersebut spoiler. aku jelasin singkat saja. Spoiler yaitu tombol yang diguanakan untuk menyingkat lokasi atau menyembunyikan konten (teks, potret atau video) dengan cara button atau tombol buka tutup.

Spoiler sanggup juga diciptakan di blog, biasanya di terapkan pada dipostingan dan digunakan untuk membuat ingin tau si pembaca dengan menyembunyikan terlebih dahulu. Bagi melihatnya dengan mengklik tombol spoiler itu.

Selain tersebut juga untuk menghemat tempat, ya alasannya buka tutup tersebut (spoiler). Lalu bagaimana teknik membuat spoiler di blog? Langsung simak tutorial di bawah ini.

Cara Membuat Spoiler Di Postingan Blogger


Pertama, masuk ke Blogger kemudian buka sajian Tema dan pindah ke Edit HTML.

Kedua, Copy dan letakan arahan di bawah ini sebelum Kode ]]></b:skin> atau </style>.

.centerspoiler{text-align:center} .spoiler{text-align:center} button.spoiler{background:#aa65c7;color:#fff;text-align:center;margin:0 auto;border:none;border-radius:3px;padding:8px 16px;margin:10px auto;font-size:14px;font-weight:bold;box-shadow:0 3px 0 0 #883da7;vertical-align:middle;cursor:pointer;text-shadow:0 1px rgba(0,0,0,0.3);transition:background 0.1s ease-in-out} .spoiler button:hover,.spoiler button:focus{background:#9e4fbf;outline:none} .spoilerpanel{padding:1px;text-align:left;background:#f5f5f5;border:0} .spoilerpanel{padding:24px;display:none}

Ketiga, Copy arahan javascript berikut ini dan letakan sebelum arahan </body>.

<script> $(function(){   $(".spoiler").on("click", function(){     $(this).parent().children(".spoilerpanel").slideToggle("normal");   }); }); </script>

Keempat, Cara memasang Spoiler di postingan Blog
1. Login ke Blogger
2. Pilih New Post atau Entri Baru menyerupai membuat postingan biasa
3. Pilihlah pada mode Edit HTML atau HTML ketika membuat postingan
4. Gunakan arahan berikut ini untuk membuat spoiler:

<div class="centerspoiler"><button class="spoiler">Spoiler</button> <div class="spoilerpanel"> ---ISI KONTEN ANDA DISINI--- </div> </div>

Contoh penerapan sanggup dilihat dibawah ini:

Tulisan:


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eget molestie libero. Proin purus nunc, fringilla vehicula egestas at, pellentesque id urna. Donec malesuada nec dekat vitae rutrum. Ut malesuada leo in pulvinar vulputate.

In commodo volutpat luctus. Pellentesque id fringilla dolor. Sed vulputate mauris eu lacus dapibus aliquam in non ipsum. Nunc varius feugiat justo, a auctor libero sodales eget. Sed magna augue, tempor id molestie ac, bibendum quis orci.

Vivamus volutpat enim dignissim libero sodales eleifend. Cras ullamcorper elit et dolor commodo, sed porttitor membisu hendrerit. Sed pellentesque pulvinar dolor. Nullam viverra massa tellus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

Gambar:


Sebagian orang tentunya sudah tahu apa tersebut spoiler Cara Membuat Spoiler Di Blogger

Video:



Demikian untuk tips kali ini, biar bermanfaat.

Source : https://turuninsay.blogspot.com/search?q=memasang-spoiler-di-postingan

Sumber https://www.denylistianto.com/

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel