Apa Itu Popup?
Popup adalah jendela berukuran kecil yang biasanya muncul di halaman website sebagai pendorong pengunjung website agar melakukan tindakan. Misalnya seperti mengisi form, subscribe newsletter, subscribe blog, sampai membeli produk.
Perhatikan gambar di bawah ini, gambar tersebut adalah contoh popup:
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128442293/original/9IA4yWnzlkOXnCxm7j7tGeVdO6ZvPCIQaw.png?1694398794)
Popup sangat berguna membuat pengunjung website tinggal berlama-lama di website, asalkan jendela popup yang Anda tampilkan mengandung informasi yang dinilai menarik oleh pengunjung website, seperti promo akhir tahun, diskon besar-besaran dan lain sebagainya.
Apakah Anda pernah ingin meninggalkan website, tapi Anda urungkan niat tersebut karena melihat informasi menarik dari jendela popup yang muncul? Yang awalnya ingin meninggalkan halaman website tersebut, tanpa sadar Anda malah berlama-lama karena ada info yang menurut Anda menarik.Nah itu adalah salah satu peran popup yaitu mencegah pengunjung meninggalkan website,
Jenis Popup yang Kami Sarankan
Mari kita lihat berbagai jenis popup yang kami sarankan dan bagaimana popup ini tidak akan berdampak negatif terhadap SEO website Anda.
Overlay Popup
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128442612/original/yVdhPMCZ_WxC0X_qS5Yi-0ec5rcIih9woA.png?1694399642)
Popup overlay adalah jenis popup yang terbuka di jendela browser yang sama tepat diatas konten halaman website Anda. Overlay popup biasanya tidak banyak memakan tempat, jenis popup ini ramah SEO, bagus untuk notifikasi seluler, bisa digunakan untuk menampilkan pesan penting dan efektif dalam mengumpulkan data pengunjung berupa email dan kontak lainnya.
Tentu saja semua itu bisa Anda dapatkan jika digunakan dengan baik dan benar serta konten popup relevan dengan konten di website Anda.
Modal Popup
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128442624/original/fy2nz_wVTEa6khx_lN3jzLvS3RZ_e06Rzw.png?1694399675)
Bisa dibilang jenis popup yang satu ini sama dengan overlay popup. Perbedaannya adalah bahwa modal popup digunakan untuk tindakan seperti pemberitahuan, untuk form login dan untuk jendela masuk yang lainnya.
Modal popup adalah jenis popup yang cukup SEO friendly, bisa mendatangkan klik dan efektif dalam mengumpulkan database seperti alamat email.
Cara Membuat Popup di WordPress Tanpa Plugin
Kami percaya dari banyaknya kemudahan yang ditawarkan plugin, ada saja pengguna website berbasis WordPress yang lebih memilih tanpa menggunakan plugin untuk memenuhi kebutuhan fitur website mereka.
Alasan mereka beragam dari mulai ingin menghemat space hosting Indonesia dan memang lebih suka tidak menggunakan plugin. Maka dari itu, bagi Anda yang ingin menggunakan tanpa plugin wajib mengikuti langkah-langkah cara membuat popup di WordPress berikut ini:
Buat Popup
Langkah 1: Kunjungi website https://popupsmart.com/.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128442695/original/moqUC4bgyXhq0LtCdRg_fBJy9jfEewOgxg.png?1694399849)
Langkah 2: Buat akun gratis popupsmart.com dengan klik Get Started dan isi data diri di kolom yang disediakan atau agar praktis klik Register With Your Google.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128442703/original/z3QBsA44RSqA95_zr6XpWi6Mi47RmW1nMw.png?1694399863)
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443055/original/Zo_kOqygNm9dPQ9dF1W9T_6jISSB0M95RQ.png?1694400988)
Langkah 3: Setelah membuat akun, login dan buat popup baru dengan klik Create a New Popup.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443068/original/4NquZhzPA7LD9YSm49PS0J9Qcr6tUXxoIw.png?1694400998)
Langkah 4: Pilih salah satu tujuan Anda membuat popup. Dalam hal ini kami memilih Grow your email list, karena kami ingin mengumpulkan email pengguna.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443080/original/K3lcDD8-a_rzh4G9LpO-J9EGVTdNPmvNrA.png?1694401008)
Langkah 5: Akan muncul jendela popup untuk mengisikan nama campaign dan menambahkan domain, kemudian klik save & close.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443083/original/n0xa-WDYWTMQtGjrMMgYGp3nYVxSSGiwRA.png?1694401019)
Langkah 6: Rancang desain pop up melalui editor cerdas dari Popup Smart.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443088/original/pSIEcLlHhgk_qYl_7wPItZMQHRXlcmvflQ.png?1694401029)
Di halaman editor tersebut terdapat 4 menu di antaranya ada menu Layouts, Customize, Target dan Publish.
Berikut penjelasan masing-masing menu tersebut:
- Layouts: Di menu ini tempat Anda memilih layouts dari template yang sudah disediakan, pilih yang menurut Anda cocok dan bagus.
- Customize: Tentukan Headline, Image, Email Input dan lain sebagainya.
- Target: Tentukan target dari popup yang Anda buat, ada 5 kategori target di popup smart ini di antaranya adalah Schedule, Audience, Visitor Behavior, Visitor Device, dan View Frequency.
- Publish: Menu untuk mempublikasikan popup hasil rancangan Anda.
Langkah 6: Setelah Anda menentukan layout nya, kustomisasi, menentukan target, sekarang kita simpan dan publikasikan hasil rancangannya dengan klik Save & Publish.
Langkah 7: Salin kode popup yang muncul, caranya klik tombol copy to clipboard.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443092/original/V0rrZE-8S4HJhP3IoDJYHWA2_v7_W4V__Q.png?1694401040)
Pasang Popup di WordPress
Setelah Anda membuat popup di popsmart.com dan mendapatkan kode popup, saatnya Anda memasang kode tersebut di WordPress.
Langkah 1: Login ke halaman admin WordPress Anda.
Langkah 2: Klik Appearance > Theme Editor.
Langkah 3: Buka file header.php.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443109/original/HM8aycTEktO-ZrW6GruGpCZ-X5WXU6ElLA.png?1694401107)
Langkah 4: Paste kode yang sudah sebelumnya di copy ke halaman Header.php dan klik tombol update file.
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443110/original/ocIJJnax9v96MohdwBc4nibJjQvVJWB15Q.png?1694401116)
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443121/original/wNtm5i3284G2PEoI3rWhUIrAv-YcBqvztA.png?1694401128)
Selesai, hasilnya kurang lebih akan seperti di bawah ini:
![](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/14128443126/original/im773M2KqukZqfKBBjRNaGa3zUPNYztzSA.png?1694401141)