Cara Membuat Spoiler di Postingan Blogger dan WordPress

Cara Membuat Spoiler Blog

Bagi seorang Blogger, istilah spoiler mungkin sudah tidak asing lagi. Namun yang justru banyak terjadi adalah ketika kebanyakan Blogger ternyata belum mengetahui secara pasti bagaimana cara membuat spoiler di WordPress.

Untuk itulah pada artikel kali ini saya akan menjelaskannya.

Ada 2 cara yang bisa dilakukan dalam membuat spoiler, yaitu :

  • Menggunakan Plugin
  • Secara manual menggunakan Code Script

Tentu saja hal ini sangat mudah dilakukan, bahkan bagi Anda yang masih pemula sekalipun.

Sebelumnya, saya ingin menjelaskan terlebih dahulu mengenai arti dan kegunaan spoiler. Saya kira ini penting, agar pembaca semuanya dapat memahami arti dan kegunaannya dengan baik sebelum bisa mempraktekkan sendiri membuatnya.

Baiklah,

Spoiler itu berasal dari bahasa Inggris dan arti sebenarnya menurut bahasa Indonesia, spoiler adalah Beberan. Dan inilah penjelasan menurut Wikipedia :

Spoiler (Beberan) adalah tulisan atau keterangan mengenai suatu cerita, yang membeberkan jalan cerita tersebut.

Membaca beberan dari suatu cerita dapat menyebabkan berkurangnya kesenangan membaca cerita itu, karena kesenangan membaca sebuah cerita biasanya tergantung kepada dramatisasi atau ketegangan yang ditimbulkan oleh cerita tersebut.

Biasanya dalam media massa maupun Internet, beberan disembunyikan dengan cara tertentu, sehingga hanya terbaca oleh yang ingin melihat beberan tersebut.

Dalam istilah Blogger spoiler sering diartikan seperti ini :

Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari posting, dengan tujuan untuk menghemat space halaman posting atau untuk membuat pembaca menjadi merasa lebih penasaran.

Biasanya yang disembunyikan dalam spoiler adalah berupa text maupun gambar.

Saya berpikir, Anda pernah melihat beberapa contoh spoiler pada postingan blog. Banyak terdapat di forum-forum atau website yang pengunjungnya banyak, seperti Kaskus.

Jika belum tahu spoiler, inilah beberapa contohnya :

[spoiler show=”1. Contoh Spoiler Teks”]SEPERTI INILAH CONTOH SPOILER TEKS PADA POSTINGAN[/spoiler]

[spoiler show=”2. Contoh Spoiler Gambar”]cara membuat spoiler di wordpress[/spoiler]

[wpspoiler name=”3. Contoh Spoiler Teks” style=”wpui-android”]SEPERTI INILAH CONTOH SPOILER TEKS PADA POSTINGAN[/wpspoiler]

[wpspoiler name=”4. Contoh Spoiler Gambar” style=”wpui-android””]cara membuat spoiler di wordpress[/wpspoiler]

Lalu, bagaimana cara membuatnya ?

Baca : Cara Mengaktifkan dan Mendapatkan API Key Plugin Akismet di WordPress

Dibawah ini adalah penjelasannya,

Ada 2 Cara Membuat Spoiler di Blog WordPress dengan Mudah

1. Menggunakan Plugin

Menurut saya, cara pertama ini jelas merupakan cara termudah membuat spoiler. Di Blog WordPress Self Hosting, Anda disediakan banyak plugin sebagai alat bantu. Nah tinggal install lalu setting plugin tersebut lalu menggunakannya.

Ada beberapa pilihan plugin yang dapat digunakan untuk membuat spoiler di WordPress, namun saya hanya ingin menjelaskan 2 plugin spoiler saja untuk Anda.

A. Advanced Spoiler

Plugin> Add New> Cari dan silahkan ketik Advanced Spoiler> Klik Install dan Aktifkan.

Atau Anda dapat langsung download plugin Advanced Spoiler disini.

Setelah tersinstal dan aktif pluginnya, silahkan klik Setting> Advanced Spoiler. Lakukan setting sesuai yang Anda inginkan. Agar lebih mudah, saya menyarankan untuk langsung mencobanya sehingga terlihat hasilnya.

Lihat gambar di bawah ini,

cara membuat spoiler di wordpress

Untuk Memasang di postingan anda, Gunakan Mode Visual pada post editor Anda, secara otomatis disitu sudah terpasang tool Advanced Spoiler.

Untuk menggunakannya, tulis kalimat yang ingin Anda tampilkan, dan silahkan blok tulisan tersebut tadi. Lalu klik Tool Advanced Spoiler tersebut.

Akan terbuka satu jendela baru, silahkan sesuaikan dengan keinginan Anda. Saat ingin melihat hasilnya, silahkan Preview.

Seperti gambar di bawah,

cara membuat spoiler di wordpress

 

Dan silahkan Anda lihat hasilnya. Lakukan beberapa setting di atas sesuai yang Anda inginkan nanti ketika tampil pada postingan.

Bagaimana, mudah kan?

B. Plugin WP UI – Tabs, Accordions, Sliders

Cara membuat spoiler di WordPress ke-2 dengan menggunakan plugin WP UI.

Silahkan Download Pluginnya disini
Seperti biasa, Install lalu Aktifkan. Setting plugin di menu Settings>WP UI.

cara membuat spoiler di wordpress

Sesuai dengan tittlenya, plugin ini mempunyai fitur yang cukup lengkap dan kalau saya bilang, plugin ini sangat kaya fitur dan tentu saja keren.

Anda dapat menyesuaikan keinginan dengan menggunakan beberapa fitur di dalamnya. Bukan hanya itu, Anda juga dapat membuat tab, accordions dan slider dengan menggunakan plugin ini.

Anda bisa mengatur sesuai yang anda inginkan, dan sekaligus Anda bisa melihat demonya secara langsung melalui menu Setting Style.

Untuk Memasang di postingan Anda, Gunakan mode text pada post editor Anda, secara otomatis disitu sudah ada Add Tabs, Wrap Tabs, Spoiler dan dialog. Anda tinggal klik dan pop up akan otomatis muncul dan isi sesuai dengan yang ingin Anda tampilkan.

cara membuat spoiler di wordpress

Klik Spoiler untuk menampilkan pop up dialog.

cara membuat spoiler di wordpress

Silahkan Anda coba sendiri untuk dapat hasil spoiler yang diinginkan. Gunakan fitur lengkap WP UI dengan sebaik mungkin agar hasil spoiler yang diinginkan bisa tampil dengan baik juga.

Itulah cara membuat spoiler di WordPress dengan menggunakan plugin.

Saya lanjut ke poin berikutnya, yaitu :

2. Secara Manual Menggunakan Code Script

Sejujurnya, cara ini juga mudah dilakukan. Namun agak sedikit ribet menurut saya karena harus memasukan code script pada postingan Anda.

Hanya saja, cara membuat spoiler pada posting WordPress dengan menggunakan code script ini ternyata masih banyak dan sering dilakukan para blogger.

Dan inilah caranya,

Dalam membuat spoiler di WordPress dengan script, masukan code di mode Teks/HTML jika ingin ditempatkan pada postingan atau halaman. Namun jika Anda ingin menempatkan spoiler di widget atau sidebar, tinggal tempatkan code pada Widget Teks.

Kira-kira seperti pada gambar di bawah ini,

cara membuat spoiler di wordpress

Anda hanya tinggal copy pastekan script yang nanti saya akan bagikan untuk Anda ke dalam posting atau halaman website Anda. Ingat, pastekan code scriptnya dalam mode text/HTML!

Dan inilah code scriptnya,

Ada 3 script pilihan untuk spoiler yang dan silahkan Anda pilih salah satunya atau Anda ingin mencobanya satu per satu.

[wpspoiler name=”Code Script” style=”ui-darkness”][otw_shortcode_button href=”https://drive.google.com/open?id=0B6cJLNQOh3fRTC1SMU4tUFBMRUk” size=”medium” icon_position=”left” shape=”radius”]DOWNLOAD[/otw_shortcode_button][/wpspoiler]

 

Cara ke dua ini juga dapat Anda terapkan pada Blogspot. Next time, saya akan menguraikannya lebih jelas lagi tentang bikin spoiler dipostingan blog.

Itulah yang dapat saya sampaikan pada kesempatan kali ini mengenai 2 Cara Membuat Spoiler di Blog WordPress. Semoga bermanfaat.

5 pemikiran pada “Cara Membuat Spoiler di Postingan Blogger dan WordPress”

  1. Terimakasih banyak, tambah ilmu lagi nih, kebetulan saya masih bingung dengan model artikel/tulisan yang bisa di hide, ternyata namanya di spoiler ya, terimakasih ilmunya.

  2. Pada kode ke 3 (ada dibawah) kenapa hanya bisa bekerja 1 kode saja jika menerapkan dua kode secara bersamaan ?

    function toggle() {
    var ele = document.getElementById(“sembunyikan”);
    var text = document.getElementById(“tampilkan”);
    if(ele.style.display == “block”) {
    ele.style.display = “none”;
    text.innerHTML = “+ TAMPILKAN SPOILER”;
    }
    else {
    ele.style.display = “block”;
    text.innerHTML = “- SEMBUNYIKAN SPOILER”;
    }}

    + TAMPILKAN SPOILER
    TULIS KALIMAT DISINI SEBAGAI ISI DALAM SPOILER

Tinggalkan komentar