Popup pertama dibuat dari skenario yang dibayangkan oleh Ethan Zukerman untukHotel dari halaman webnya di Tripod pada awal tahun 90an. Penggunanya mengeluh tentang jumlah iklan yang dia tempatkan di situs web tersebut, jadi dia memutuskan untuk menempatkan spanduk tersebut di halaman terpisah yang terbuka saat pengguna mengakses halaman tersebut.
Potongan kecil kode ini masih bukan sembulan nyata seperti yang kita lihat di setiap situs web saat ini, tetapi di situlah semuanya dimulai. Di halaman web modern, pop-up digunakan untuk tujuan yang berbeda, tidak hanya untuk iklan. Formulir kontak, peringatan kebijakan privasi, dan saran berlangganan juga sering ditampilkan sebagai pop-up.
Ada dua hal yang mengganggu pengguna ketika muncul popup: ketika mereka melompat pada Anda ketika Anda tidak menginginkannya; dan ketika penampilannya benar-benar berbeda dari gaya situs web. Dua masalah ini muncul ketika Anda menggunakan plugin yang tampaknya tidak berkualitas tinggi.
Masalah terbesar sebagian besar plugin yang digunakan pengembang pemula membuat pop up adalah kurangnya kontrol atas pesan yang dihasilkan. Namun, Anda dapat menghindari semua masalah ini jika menggunakan Elementor buat situs web.
Dua plugin keren, dibuat khusus untuk Elementor Halaman Builder, membantu Anda membuat sembulan dari jenis, bentuk, dan gaya apa pun yang Anda butuhkan – Elementor Popup Builder et JetPopup. Karena keduanya terbuat dari daging yang sama dengan Elementor, satu-satunya pertanyaan yang harus ditanyakan adalah plugin mana yang harus dipilih. Untuk membantu Anda membuat keputusan ini, saya akan melakukan tinjauan menyeluruh terhadap keduanya dan Anda dapat membandingkan pro dan kontra mereka. Jadi ayo pergi !
Unduh dan instal
Ini bukanlah kriteria terpenting saat memilih plugin mana yang akan digunakan, tetapi untuk mencobanya Anda harus mendapatkannya terlebih dahulu. Itulah mengapa saya akan memulai dari awal dan menguraikan proses untuk mendapatkannya - harga, upaya yang terlibat, dan kesederhanaan proses penyiapan.
Pembuat Popup
Plugin ini dibuat oleh tim Elementor. Karena itu kita bisa memanggilnya "anak" yang sebenarnya. Ini adalah pembaruan terakhir untuk Elementor, dirilis pada Januari 2019 untuk memenuhi kebutuhan pelanggan. Namun, ini tidak tersedia untuk pengguna Elementor versi gratis.
Pembuat Popup termasuk dalam paket langganan profesional. Jadi, untuk memiliki kemampuan membuat popup, Anda harus memiliki Elementor Pro terlebih dahulu. Paket harga paling sederhana yang memungkinkan Anda menggunakan semua variasi fitur Elementor untuk satu situs web berharga $ 49 per tahun. Jadi, dari langkah pertama (pembelian Elementor Pro), berikut adalah algoritma untuk mendapatkan Pembangun Popup:
- Beli Elemen Pro Halaman Builder.
- Buka akun pribadi Anda dan unduh plugin.
- Buka dasbor situs web Anda, Plugin> Tambah baru, klik tombol "Unggah plugin" dan pilih file .zip yang sesuai.
- Saat penginstalan selesai, aktifkan plugin dengan kunci lisensi Anda.
- Berikut adalah Pembuat Popup yang terletak di Templat> tab Popup.
Jalannya agak panjang, tetapi dengan Pembuat Popup Anda juga mendapatkan banyak koleksi elemen berbeda dari Elementor, seperti widget, templat, dan alat tambahan lainnya.
Pembuat Popup
JetPopup
"Keluarga" dari plugin Jet sudah memiliki lebih dari artikel 10 dan JetPopup adalah salah satunya. Itu telah dibuat dengan hati-hati khusus untuk Elementor dan meningkatkan jumlah alat yang tersedia. Plugin ini t
Sepenuhnya kompatibel dengan versi gratis dan berbayar. Jadi, Anda tidak perlu melakukan pembelian tambahan. JetPopup berharga $ 15 dan setelah Anda mendapatkannya, Anda dapat menggunakannya hanya untuk satu situs web. Jika Anda membutuhkannya untuk lebih dari satu proyek, Anda dapat membeli plugin di bawah lisensi pengembang (biayanya $ 45) dan menggunakannya untuk lima situs web. Algoritme untuk mendapatkan plugin ini sedikit lebih sederhana:
- Beli plugin di Marketplace TemplateMonster. Itu akan diunduh ke komputer Anda.
- Buka dasbor situs web Anda, Plugin> Tambah baru, klik tombol "Unggah plugin" dan pilih file .zip yang sesuai.
- Setelah penginstalan selesai, aktifkan plugin.
- Voila! Ketika Anda membuka menu penyesuaian Elementor (dengan mengklik tombol "Edit dengan Elementor"), Anda akan menemukan bagian JetPopup di menu sebelah kiri widget.
Pembuatan munculan
Sekarang, ketika alat-alat sudah ada dan siap, saya dapat mencoba membuat popup dengan kedua plugin dan melihat betapa sederhananya dan mudah dimengerti fitur ini. Selanjutnya, saya akan membuat pop-up dasar dan melihat opsi penyesuaian untuk Popup Builder dan JetPopup.
Pembuat Popup
Dalam Pro Elementor pop-up dilakukan secara terpisah dari halaman situs. Untuk mengubah tampilan situs web, buka halaman yang ingin Anda sesuaikan, klik tombol “Edit dengan Elementor” dan buat perubahan. Tetapi untuk membuat (dan kemudian mengedit) popup Anda harus pergi ke Templates> Popups dan tekan tombol "Add new popup".
Di jendela yang terbuka, Anda harus memilih template yang akan Anda buat (ya, Anda dapat membuat template tidak hanya untuk pop-up, tetapi juga untuk halaman dan item lainnya) dan berikan nama.
Setelah menekan tombol "Buat template" Anda akan diarahkan ke menu personalisasi Elementor. Lebih mudah untuk menyesuaikan item yang ada dengan membangunnya dari awal. Karena itu Anda akan diminta untuk memilih model yang sesuai.
Saya memilih salah satu model yang ditampilkan di bagian atas daftar perpustakaan. Tepat setelah pilihan, Anda mendarat di ruang kerja Elementor yang mungkin biasa Anda gunakan. Pilihan personalisasi ditempatkan di sidebar di sisi kiri layar. Anda memiliki tiga tab di sini.
Tab "Pengaturan" memungkinkan Anda untuk mengubah tata letak sembulan, mengubah nama model dan pratinjau. Pada tab "Gaya" Anda dapat menyesuaikan desain - ubah warna, font, gambar, dan garis tepi. Tab "Advanced" juga memiliki satu set slider tambahan; misalnya, mereka mencegah popup ditutup dengan kunci ESC.
Seperti yang Anda lihat - tidak ada yang tidak terduga, jika Anda telah menggunakan Elementor sebelumnya Anda tidak akan mengalami masalah apa pun dengan plugin ini. Berikut adalah video terperinci yang menjelaskan cara membuat jendela pop-up menggunakan Pembuat Popup:
JetPopup
Plugin ini juga menambahkan tab baru ke dasbor Anda tema WordPress dan dengan bantuannya, popup juga dibuat terpisah dari halaman. Popup out-of-the-box juga disimpan di tab bernama "Perpustakaan popup." Untuk membuat popup baru, Anda dapat menekan tombol “Add” pada template yang telah ditentukan atau pergi ke JetPopup > Add new popup, beri nama template dan tekan “Edit dengan Elementor.”
Bidang pekerjaan sedikit berbeda dari norma karena Anda sekarang membuat jendela yang lebih kecil. Di menu sebelah kiri, Anda dapat menambahkan semua jenis item ke sembulan Anda.
Plugin JetPopup menambahkan satu item ke menu widget - tombol tindakan kontekstual. Ini memungkinkan untuk menentukan jenis tindakan yang akan terjadi saat pengguna menekan tombol.
Tidak terlalu jelas untuk membuka pengaturan dari jendela pop-up. Anda perlu mengklik tombol perawatan di bagian bawah menu. Menu pengaturan sangat mirip dengan yang ada di Popup Builder, tetapi hanya ada dua tab penyesuaian. "Pengaturan Umum" memungkinkan Anda untuk menentukan efek animasi, mengganti nama model atau menentukan kondisi. Pada tab "Gaya" Anda dapat mengubah tata letak, warna, gambar, font, dan batas.
JetPopup memiliki fungsionalitas yang sedikit kurang jelas tetapi mengimbangi tutorial video yang terperinci dan bermanfaat.
pemicu
Agar bermanfaat dan tidak mengganggu pengunjung, munculan harus muncul pada waktu yang tepat. Kondisi di mana popup ditampilkan disebut "pemicu". Semakin rinci ketentuan yang tersedia, semakin fleksibel plugin popup tersebut. Presisi sangat penting jika Anda tidak ingin pengguna meninggalkan situs setelah jendela pop-up formulir berlangganan muncul.
Pembuat Popup
Plugin ini membantu Anda menentukan kondisi yang diperlukan setelah menyesuaikan jendela sembulan. Ketika Anda menekan tombol "Terbitkan" Anda melihat jendela di mana Anda dapat menentukan kondisi (di mana halaman sembulan ini akan ditampilkan), memicu (kapan jendela sembulan akan ditampilkan) dan aturan lanjutan.
Pembuat Popup memiliki enam pemicu, seperti tampilan pada satu gulir dan klik, dan tujuh aturan lanjutan, seperti tampilan setelah sejumlah sesi atau tampilan pada perangkat tertentu. Pemicu dan aturan lanjutan memiliki sakelar slider sederhana dan akan sangat cepat untuk mengatur semua parameter yang Anda inginkan.
JetPopup
Semua pemicu, kondisi, dan acara pembukaan dikelompokkan bersama dalam parameter. Setelah mengklik tombol pemeliharaan, Anda membuka tab pengaturan dan dapat segera mengatur pemicu. Anda dapat mengatur persentase halaman setelah menggulir, menu konteks untuk ditampilkan, atau jumlah detik setelah pengguna akan melihat pesan tersebut.
Jendela hanya dapat ditampilkan sekali atau setiap kali pengguna melakukan tindakan tertentu (saya sangat tidak merekomendasikannya - ini tidak akan membuat pengguna senang). Anda juga dapat memilih dengan tepat posting atau halaman mana yang akan ditampilkan pop-up konkret ini. Secara umum, plugin ini cukup fleksibel dan memungkinkan Anda menampilkan popup dengan sangat presisi.
positioning
Pengguna tentu tidak akan dapat menghindari jendela yang melompat keluar dari tengah layar, tetapi mereka mengalihkan pengunjung dari situs web dan bisa sangat mengganggu. Tidak semua pop-up harus ditempatkan di tengah, pita sempit di atas akan kurang terlihat, tetapi bisa jauh lebih efektif. Artinya, Anda perlu mengontrol posisi jendela dan dapat bergerak di sekitar layar.
Pembuat Popup et JetPopup bagi layar menjadi sembilan sektor dan memungkinkan Anda menempatkan sembulan di salah satunya. Penentuan posisi ditentukan di sepanjang skala kiri-kanan dan atas-bawah. Ini tidak terlalu fleksibel, tapi cukup untuk popup.
Efek animasi
Cara jendela meluncur (atau berguling atau melompat) pada halaman sangat penting. Jika jendela bergerak terlalu cepat atau terlalu lambat, ini tidak akan efektif. Bounce, tickles, dan tremor juga harus digunakan dengan sangat tepat. Efek animasi membuat situs lebih dinamis, tetapi juga dapat merusak keseluruhan kesan.
Pembuat Popup memiliki 36 jenis animasi masukan, termasuk berbagai jenis geser, terbentang, zoom, memantul dan berputar ke berbagai arah. Semua ini, bersama dengan durasi animasi, dapat ditemukan di bagian "Tata Letak" pada tab Pengaturan.
Ada 13 jenis animasi di dalam plugin JetPopup, termasuk fade, flipping vertikal, slide berbeda, memantul dan zoom. Anda akan menemukannya di bagian "Pengaturan" pada tab Pengaturan.
model
Dalam beberapa kasus, Anda ingin membuat popup dengan struktur tertentu dan tahu persis bagaimana tampilannya. Tapi ini adalah kesempatan yang agak langka; lebih sering Anda tidak tahu elemen apa yang harus ada di popup Anda. Di sinilah template berguna. Bahkan jika Anda tidak menggunakan sampel yang telah dikonfigurasi sebelumnya, memprosesnya dapat memberi Anda gambaran umum yang baik. Dan, tentu saja, menyesuaikan item out-of-the-box jauh lebih cepat dan lebih mudah daripada membangunnya dari awal.
Pembuat Popup menambahkan kategori ke perpustakaan template Elementor. Seperti yang saya katakan sebelumnya, Anda dapat melihat ini langsung di awal proses baru membuat munculan. Beraneka ragam template popup cukup besar; ada lebih dari 100 item. Di sudut kiri atas, alat sortir menurut kategori drop-down memungkinkan Anda mempercepat pencarian. Kategorinya dapat dimengerti dan tidak perlu waktu lama untuk menemukan popup yang Anda butuhkan.
JetPopup juga memiliki perpustakaan templat yang sangat besar. Semuanya disimpan di tab Perpustakaan Kontekstual dan memiliki fitur praktis seperti tombol pratinjau dan penghitung penggunaan. Ada lebih banyak opsi pengurutan, daftar dapat dikonfigurasi untuk menampilkan jenis model tertentu dan kemudian ditempatkan dalam urutan apa pun; misalnya, tergantung pada tanggal pembuatan. Saya tidak bisa memberi tahu Anda jumlah pasti model yang tersedia, tetapi pasti ada lebih dari 100.
Tabel perbandingan
| Elementor Popup Builder | JetPopup | |
| prix | 45 $ | 15 $ |
| model | 100 + | 100 + |
| pemicu | 6 memicu, 7 aturan lanjutan | 5 membuka acara dengan parameter tambahan |
| Animatio | Jenis 36 | Jenis 13 |
| tutorial | dokumentasi | dokumentasi, tutorial video 9 |
Kesimpulan
Saya tidak bisa mengatakan mana dari kedua plugin ini yang lebih baik; terlalu rumit untuk menilai mereka. Setiap kasus dan setiap orang memiliki persyaratan mereka sendiri untuk pilihan plugin. Saya kira Anda harus mendefinisikannya sendiri - mana dari keduanya yang terbaik untuk Anda? Saya berharap Anda beruntung dalam menambahkan popup yang luar biasa ke situs web Anda!
