Sorotan Plugin Divi: Solusi Overlay Sederhana

Simple Overlay Solution adalah plugin pihak ketiga untuk Divi yang memudahkan pembuatan overlay layar penuh, popup, dan menu mega dengan Divi Builder. Tambahkan beberapa overlay ke halaman mana pun. Pilih antara klik atau pemicu penundaan waktu otomatis, pemuat terang atau gelap, dan latar belakang terang atau gelap. Gaya tombol tutup, atau buat latar belakang dan tombol Anda sendiri dengan Divi Builder. Setiap hamparan memiliki cookie 30 hari.

Solusi Hamparan Sederhana

Unggah dan aktifkan plugin seperti biasa. Kemudian, Anda harus mengaktifkan lisensi. Di menu dasbor, buka Pengaturan > Aktivasi Divi SOS dan masukkan kunci API dan email Anda.

Impor Sampel SOS

Plugin SOS dilengkapi dengan satu set demo sebagai file JSON yang dapat Anda impor ke perpustakaan SOS. Pertama, unzip file unduhan untuk mengakses file JSON. Ini bagus untuk membantu Anda memulai.

Di menu dasbor, buka Divi > SOS . Pilih Impor & Ekspor.

Impor file JSON seperti tata letak apa pun.

Anda sekarang memiliki 5 demo di perpustakaan SOS. Anda dapat melihat demo di situs web pengembang.

Membuat Tata Letak SOS

Tata Letak SOS juga dibuat di perpustakaan SOS. Buka perpustakaan dan klik Tambah Baru .

Beri nama tata letak sesuatu yang masuk akal bagi Anda. Pilih Tata Letak untuk Jenis Tata Letak.

Pilih Tata Letak SOS untuk kategori tersebut.

Saya memilih tata letak yang dibuat sebelumnya dan kemudian memilih halaman Kontak dari paket tata letak Resor. Di sebelah kanan (atau di bagian bawah jika Anda melihat dengan mode visual) adalah pengaturan tata letak. Ini memberi Anda kode HREF untuk tata letak sehingga Anda dapat memicunya di halaman mana pun (di mana pun yang memungkinkan untuk URL). Ini adalah tautan yang akan Anda gunakan untuk tombol, teks, dll., untuk memicu hamparan.

Anda juga dapat menampilkannya secara otomatis (ini akan membuka pengaturan waktu dan mengaktifkan cookie sehingga pengunjung mengetahui overlay atau popup). Atur transisi ke fade, slide, atau none. Pilih terang, gelap, atau tanpa latar belakang. Pilih warna loader terang atau gelap. Pilih apakah akan menampilkan tombol tutup atau tidak. Anda dapat mengatur gaya tombol dan latar belakangnya.

Loader bisa terang atau gelap. Inilah pemuat gelap di atas latar belakang terang.

Contoh Overlay SOS

Saya membuat overlay yang akan menampilkan informasi pemesanan saat pengunjung mengklik tombol Pesan Liburan Anda . Tambahkan tautan ke URL tombol Anda untuk memicu hamparan.

Saya mengatur latar belakang bagian menjadi transparan, memilih latar belakang terang dalam pengaturan SOS, dan menyesuaikan tata letak untuk hanya menggunakan salah satu bagian. Mengklik tombol Pesan Liburan Anda akan membuka bagian untuk memesan penginapan. Latar belakang termasuk hamparan putih. Saya juga telah menambahkan tombol tutup dan menatanya agar sesuai dengan tata letak. Tata letak ditempatkan di bagian atas layar dan mengambil lebar penuh. Ini dapat disesuaikan dengan bantalan.

Saya telah menambahkan sedikit padding ke bagian atas bagian. Saya juga telah menonaktifkan latar belakang sehingga saya dapat mengontrolnya dengan Divi Builder.

Untuk yang ini, saya menggunakan formulir kontak dari tata letak yang sama. Kali ini, saya telah menambahkan bayangan kotak ke baris bawah sehingga akan menonjol dari latar belakang overlay.

Saya menambahkan tautan ke tombol di halaman yang sama dengan hamparan pertama (Anda dapat menambahkan sebanyak yang Anda mau). Yang ini membuka formulir kontak ketika mereka mengklik tombol Pesan Kami .

Hasilnya terlihat menarik. Saya tidak menambahkan tombol tutup untuk yang ini. Pengunjung dapat mengklik di mana saja dari formulir untuk menutup overlay. Saya telah menambahkan latar belakang ke baris dan mengatur opacity sehingga hanya sedikit dari latar belakang yang terlihat.

Yang ini menggunakan bagian dari tata letak Perusahaan Investasi. Saya ingin membuat popup dengan ajakan bertindak. Saya telah mengaturnya untuk ditampilkan secara otomatis dengan penundaan 1000 milidetik. Saat ditampilkan secara otomatis, Anda tidak perlu menambahkan tautan di mana pun. Secara otomatis ditampilkan di setiap halaman. Saya juga telah mengatur cookie untuk hanya menampilkan popup sekali setiap 30 hari.

Munculan menunjukkan 1 detik setelah halaman dimuat. Ini membuat CTA sebagai sembulan, dan hanya akan ditampilkan setiap 30 hari sekali. Anda tidak dapat membedakan dalam gambar ini, tetapi saya juga memberikannya latar belakang paralaks, hanya karena. Ini memungkinkan Anda untuk berkreasi dengan popup seperti halnya desain halaman apa pun.

Saya memindahkan opsi tutup dari tombol di sudut kanan atas ke tombol yang dibuat dengan Divi Builder. Saya mengkloning tombol dari tata letak, mengubah teks, dan menambahkan tautan dekat ke URL.

Hasilnya adalah desain bersih yang berfungsi sangat baik sebagai CTA.

Saya kembali ke desain dan menambahkan latar belakang baru dan tombol yang membuka halaman lain.

Untuk yang satu ini, saya membuat popup buletin berdasarkan tata letak Esports. Saya telah mengatur popup untuk terbuka secara otomatis setelah 30 detik. Latar belakang diatur ke gelap dan loader diatur ke terang. Saya juga akan menyertakan tombol tutup menggunakan warna dari tata letak.

Popup berlangganan terlihat bagus dan sangat cocok dengan desain situs karena sebenarnya berasal dari desain situs. Saya suka itu dapat menggunakan tata letak Divi biasa untuk membuat sembulan.

Menu Mega

Anda juga dapat membuat menu mega dengan SOS. Buat tautan khusus sebagai item menu, lalu tambahkan tautan hamparan ke URL item menu.

Saya telah menambahkan hamparan ke tautan Tentang di menu slide-in saya. Anda dapat memiliki hamparan berbeda untuk setiap tautan di menu jika Anda mau, dan itu bisa berupa apa saja yang dapat Anda buat dengan Divi.

Harga Solusi Overlay Sederhana

Ada dua lisensi untuk SOS. Keduanya memiliki biaya satu kali dan termasuk pembaruan seumur hidup.

• 1 situs web dan 1 situs pengembang – $25
• Situs web tidak terbatas – $45

Anda dapat membeli SOS dari situs web pengembang.

Mengakhiri Pikiran

Solusi Overlay Sederhana mudah digunakan. Kontrolnya sederhana dan intuitif. Membangun overlay hampir sama dengan membangun halaman dengan Divi. Jika Anda dapat menggunakan Divi Builder, Anda dapat menggunakan SOS. Halaman Divi dimuat dengan cepat karena overlay tidak dimuat sebelumnya. Hamparan dan munculan juga dimuat dengan cepat.

Saya suka bahwa ia memiliki kue. Ini memberi Anda kendali atas popup sehingga pengunjung yang sama tidak perlu melihat penawaran setiap kali mereka mengunjungi situs web. Saya yakin itu tidak akan mudah dilakukan, tetapi saya ingin melihat beberapa opsi cookie. Misalnya, mungkin mengaturnya untuk ditampilkan sekali per minggu, sekali per hari, dua kali per bulan, dll. Beberapa opsi pemuat juga akan bagus. Mungkin pilihan dan kustomisasi warna yang berbeda. Saya juga ingin kemampuan untuk mengecualikan halaman agar tidak menampilkan overlay otomatis.

Saya suka bahwa tombol Divi biasa dapat digunakan untuk tombol tutup. Ini membuka banyak kemungkinan desain dan Anda tidak terbatas pada penggunaan tombol bawaan. Jika Anda ingin menggunakan tombol, itu memang memiliki banyak pilihan warna.

SOS adalah plugin yang mudah untuk direkomendasikan. Jika Anda tertarik dengan cara mudah untuk membuat overlay, popup, dan menu mega dengan Divi Builder, Simple Overlay Solution (SOS) mungkin merupakan plugin yang Anda butuhkan.

Kami ingin mendengar dari Anda. Sudahkah Anda mencoba plugin Simple Overlay Solution untuk membuat overlay dan popup? Beri tahu kami pendapat Anda tentang hal itu di komentar.

Gambar Unggulan melalui Bakhtiar Zein / shutterstock.com