Cara Membuat Kotak Peringatan di WordPress
Diterbitkan: 2023-02-12Jika situs web Anda mendapatkan jumlah pengunjung yang solid, tetapi pendaftaran atau konversi lebih rendah dari yang Anda inginkan, Anda tidak sendiri. Ada banyak sekali sumber daya yang tersedia untuk membantu meningkatkan lalu lintas Anda – tetapi membuat lalu lintas itu mengambil tindakan yang tepat di situs Anda adalah cerita lain.
Salah satu solusi yang mungkin adalah menggunakan kotak peringatan. Ini adalah alat yang ampuh dan sederhana yang dapat secara dramatis meningkatkan konversi di situs WordPress Anda. Terlebih lagi, sangat mudah untuk membuat dan menyesuaikan fitur ini.
Pada artikel ini, kami akan membahas apa itu kotak peringatan dan mengapa Anda harus menggunakannya. Kemudian kami akan menunjukkan cara membuat kotak peringatan Anda sendiri di WordPress. Ayo selami!
Apa Itu Kotak Peringatan?
Kotak peringatan persis seperti apa suaranya. Ini adalah peringatan yang muncul di situs web untuk memberi tahu pengunjung bahwa sesuatu telah terjadi. Anda mungkin tahu fitur ini lebih baik sebagai 'munculan'.
Kotak peringatan di WordPress biasanya mengambil salah satu dari dua bentuk. Anda mungkin melihat munculan yang muncul di layar, atau bilah yang berjalan di sepanjang bagian atas laman Anda (terkadang disebut 'bilah halo').
Mengapa Membuat Kotak Peringatan?
Kotak peringatan biasanya digunakan untuk memberi tahu (atau mengingatkan) pengguna tentang sesuatu yang penting terjadi di situs Anda. Misalnya, Anda mungkin menggunakan kotak peringatan WordPress untuk memberi tahu pengunjung tentang obral khusus pada produk yang mungkin tidak mereka lihat di tempat lain, atau rangkaian postingan unggulan.
Penggunaan lain yang sangat umum untuk fitur ini adalah untuk menangkap alamat email pengunjung. Banyak plugin kotak peringatan WordPress dapat diatur untuk muncul saat pengguna memindahkan kursor menjauh dari situs (untuk menutup tab atau menekan tombol kembali, misalnya).
Lansiran 'menit terakhir' ini bisa menjadi cara yang bagus untuk mencatat detail kontak pengunjung sebelum mereka pergi, yang berpotensi menghasilkan konversi di kemudian hari. Lansiran ini bisa sangat efektif – sembulan berperforma terbaik memiliki tingkat konversi lebih dari 9 persen. Dengan kata lain, mereka sepadan dengan usaha untuk diterapkan.
Membuat Kotak Peringatan Dengan Plugin
Berkat plugin WordPress, membuat kotak peringatan Anda sendiri menjadi mudah. Kami akan memandu Anda melalui setiap langkah menggunakan plugin Pembuat Popup yang kuat (dan gratis).
Langkah 1: Unduh Plugin (Seperti Popup Maker)
Hal pertama yang perlu Anda lakukan adalah mengambil plugin khusus. Seperti yang kami sebutkan di atas, plugin Popup Maker gratis telah ditinjau dengan baik dan merupakan pilihan yang solid.
Untuk menginstal alat ini, buka dasbor WordPress Anda dan arahkan ke Plugins > Add New . Cari "pembuat popup", dan itu harus menjadi entri pertama:
Kemudian klik Instal Sekarang . Jika sudah selesai install, jangan lupa aktifkan plugin dengan memilih Activate . Perhatikan bahwa meskipun Pembuat Popup itu sendiri gratis, beberapa fitur memerlukan paket premium untuk digunakan.
Langkah 2: Buat Munculan
Dengan Popup Maker terinstal, Anda akan melihat entri baru di sidebar WordPress Anda yang diberi nama setelah plugin . Klik untuk membuka daftar semua popup Anda. Awalnya akan kosong, tetapi Anda akan memperbaikinya.
Untuk membuat munculan, klik Tambahkan Munculan Baru di bagian atas layar. Ini akan membuka editor WordPress:
Saat Anda mengunjungi layar ini, sebuah tutorial akan muncul yang menunjukkan kepada Anda cara membuat sembulan. Hal pertama yang diminta untuk Anda lakukan adalah memasukkan nama, sehingga Anda dapat mengidentifikasi popup nanti.

Setelah itu, Anda dapat memasukkan judul opsional yang akan muncul dalam sembulan sebagai judul. Di kolom editor utama, Anda juga dapat memasukkan konten yang ingin ditampilkan di popup. Jika Anda hanya ingin membuat formulir kontak sederhana, Anda juga dapat menggunakan shortcode yang telah ditentukan sebelumnya.
Kode pendek ini ditemukan di bawah tombol baru dengan logo Pembuat Popup di bilah alat:
Klik Formulir Berlangganan untuk memasukkan formulir kontak dasar untuk menangkap email. Teks untuk bidang dan penafian privasi dapat disesuaikan dengan mengklik formulir dan memilih tombol edit. Ada sejumlah opsi untuk gaya dan tata letak, selain teks.
Langkah 3: Konfigurasikan Pemicu untuk Munculan Anda
Dengan formulir popup Anda dibuat, langkah selanjutnya adalah mengonfigurasi pemicunya. Ini menentukan kapan kotak peringatan muncul.
Pada layar editor popup, gulir ke bawah ke Pengaturan Popup dan pilih Pemicu dari daftar. Kemudian klik Tambah Pemicu Baru :
Plugin Popup Maker dasar berisi tiga opsi di sini: Click Open , Time Delay/Auto Open , dan Form Submission . Anda juga dapat memilih Exit Intent sebagai pemicu jika Anda menggunakan paket premium – ini adalah opsi untuk digunakan jika Anda ingin popup muncul saat pengguna mencoba meninggalkan situs Anda.
Anda juga dapat menyesuaikan halaman mana yang menampilkan kotak peringatan di bawah tab Penargetan . Pastikan untuk menyesuaikan setelan ini jika Anda ingin mengecualikan laman atau jenis perangkat tertentu agar tidak melihat lansiran.
Langkah 4: Gaya Kotak Peringatan Anda
Terakhir, Anda dapat mengubah tampilan kotak peringatan baru agar lebih cocok dengan tema situs Anda. Di area Pengaturan Munculan , pilih Tampilan . Di sana, Anda dapat mengubah tempat munculan muncul di layar (termasuk sebagai bilah atas), mengatur ukuran dan posisinya, dan memilih salah satu dari beberapa tema yang tersedia:
Setelah selesai, pastikan untuk memilih tombol Terbitkan untuk menyimpan perubahan dan mengaktifkan munculan Anda.
Membuat Kotak Peringatan Tanpa Plugin
Jika Anda memilih untuk tidak menggunakan plugin, Anda juga dapat membuat sendiri kotak peringatan menggunakan beberapa kode dan sedikit minyak siku. Anda harus mengedit file header.php dan menambahkan beberapa CSS ke situs Anda. Untuk contoh ini, kami akan membuat bilah peringatan di bagian atas halaman.
Langkah 1: Edit File header.php Anda
Hal pertama yang perlu Anda lakukan adalah menambahkan beberapa kode ke file header.php Anda. Ini dapat diakses menggunakan Editor Tema WordPress. Dari dasbor Anda, arahkan ke Appearance > Theme Editor . Kemudian pilih Theme Header (header.php) dari sidebar di sebelah kanan:
Salin dan tempel kode berikut ke dalam file di akhir bagian <head> :
<div class="alertbar">All items 20% off!</div>
Inilah tampilan file setelah penambahan ini:
Ini akan menampilkan pesan "Semua item diskon 20%!" di bilah peringatan Anda. Anda dapat menyesuaikan teks sesuka Anda.
Langkah 2: Tambahkan CSS Kustom
Terakhir, Anda harus menggunakan Cascading Style Sheets (CSS) untuk menata lansiran Anda. Anda dapat menambahkan CSS menggunakan Penyesuai WordPress.
Untuk melakukannya, buka dasbor WordPress Anda dan arahkan ke Tampilan > Sesuaikan. Ini akan membuka situs Anda di Customizer. Di bilah sisi, pilih CSS Tambahan . Ini membuka kotak kode tempat Anda dapat memasukkan CSS khusus.
Rekatkan kode berikut ke dalam bidang teks:
.alertbar {
background-color: #A9A9A9;
color: #FFFFFF;
display: block;
line-height: 45px;
height: 50px;
position: relative;
text-align: center;
text-decoration: none;
top: 0px;
width: 100%;
z-index: 100;
}
Berikut tampilan lansiran tersebut:
Kode di atas membuat bilah abu-abu tua dengan teks putih – tetapi Anda dapat menyesuaikan warna dan ukuran sesuka Anda agar sesuai dengan tema Anda. Setelah selesai, klik Terbitkan untuk menyimpan perubahan Anda.
Tingkatkan Situs Anda Dengan Mesin WP
Baik Anda ingin meningkatkan pendaftaran email atau memerlukan cara sederhana untuk memberi tahu pengunjung tentang penawaran khusus, kotak peringatan adalah solusi yang elegan dan efektif. Menerapkannya di situs WordPress Anda dapat secara dramatis meningkatkan tingkat konversi Anda.
Anda dapat menerapkan kotak peringatan dengan plugin WordPress seperti Popup Maker. Anda juga dapat membuat kode sendiri dengan relatif mudah dengan sedikit CSS. Bagaimanapun, Anda akan mendapatkan lansiran yang dapat disesuaikan yang dirancang untuk meningkatkan pendaftaran dan konversi.
Jika Anda ingin menyempurnakan situs Anda lebih jauh lagi, pastikan untuk memeriksa paket hosting WordPress khusus kami!