Loncat ke Konten Utama

Ulasan plugin WordPress: Divi Mega Pro

Divi: tema WordPress termudah untuk digunakan

Divi: Tema WordPress terbaik sepanjang masa!

lebih 701.000 unduhan, Divi adalah tema WordPress paling populer di dunia. Sudah lengkap, mudah digunakan dan dilengkapi dengan lebih dari 62 template gratis. [Direkomendasikan]

Menu mega adalah elemen desain populer yang dapat memberikan dorongan ramping pada situs web Anda sekaligus memberikan lapisan navigasi tambahan kepada pengunjung. Ada beberapa cara untuk menambahkan mega-menu ke Divi. Salah satu metode paling sederhana yang pernah saya gunakan adalah metodeplug-in pihak ketiga yang disebut Divi Mega Pro .

Divi Mega Pro memudahkan pembuatan menu mega menggunakan Divi Builder. Setiap menu dapat ditambahkan ke elemen apa pun menggunakan kelas CSS. Ini berarti Anda dapat menambahkan tata letak Divi ke tautan mana pun di menu, tetapi Anda dapat melangkah lebih jauh dan menambahkannya ke elemen mana pun dari tata letak Divi hanya dengan menambahkan kelas CSS.

Ini sangat ideal untuk membuat menu dan popup dengan modul toko, gambar, slider, portofolio, ikon, uraian singkat, video, blog, dll. Ini juga bekerja dengan Extra.

Buat Menu Mega Pro Mega

buat menu mega divi dengan divi mega.png

Menu Divi Mega Pro ditambahkan ke menu dasbor. Di sini Anda dapat memasukkan kunci lisensi Anda, melihat menu yang telah Anda buat dan membuat menu baru. Saat Anda mengklik untuk menambahkan menu baru, Anda akan melihat editor untuk jenis posting menu. Layarnya sederhana, tetapi ada banyak hal yang terjadi di sini.

desain menu Mega Pro.png

Penerbit - Anda dapat membuat mega-menu atau tooltip menggunakan Divi Builder.

ubah latar belakang menu mega.png

Latar Belakang Mega Pro - Anda dapat memilih latar belakang dan warna font.

pilih lokasi menu.png

Lihat lokasi - pilih semua halaman atau beri nama halaman tertentu, lalu masukkan pengecualian.

pilih animasi menu.png

Animasi Mega Pro - pilih animasi. Pilih dari offset, offset, perspektif, fade, atau scale.

pilih pemicu css.png

Pemicu Mega Pro - tambahkan pemicu sebagai pemilih CSS. Setelah Anda menyimpannya, Anda akan melihat kelas CSS yang akan Anda tempelkan ke dalam bidang kelas CSS dari item menu, modul, baris, atau bagian. Inilah yang diklik atau di-arahkan untuk menampilkan menu. Semuanya bisa digunakan sebagai pemicu dan bukan hanya item menu. Ini berarti Anda juga dapat menggunakan Divi Mega Pro untuk membuat popup atau tooltips.

konfigurasi menu style divi.png

Pengaturan tampilan Mega Pro : pilih arah tampilan (atas atau bawah), masukkan margin atas dan bawah dalam piksel, pilih persentase lebar dan aktifkan panah. Mengaktifkan panah mengungkapkan lebih banyak penyesuaian di mana Anda dapat memilih jenis panah (segitiga atau bulat), memilih warna, mengatur lebar dan tinggi, dan melihat pratinjau panah.

penyesuaian tombol divi.png

Buat situs web Anda dengan Elementor dengan mudah

Elementor memungkinkan Anda untuk dengan mudah membuat desain situs web apa pun dengan tampilan profesional. Berhentilah membayar mahal untuk apa yang dapat Anda lakukan sendiri. [Gratis]

kustomisasi tombol tutup: aktifkan tombol tutup di desktop atau di ponsel dan sesuaikan tombol tutup. Jika Anda mengaktifkannya, kustomisasi untuk warna teks, warna latar belakang, ukuran font, radius batas, isian, dan tampilan akan dipratinjau.

konfigurasi tambahan divi mega pro.png

Parameter tambahan Mega Pro - pilih jenis pemicu (diarahkan atau diklik), jenis keluaran (diarahkan atau diklik) dan masukkan penundaan keluar.

Model Divi Mega Pro

template berbeda tersedia divi mega pro.png

Pengembang telah menyediakan beberapa model untuk Divi Mega Pro. Saat Anda membeli plugin, template ini tersedia di akun Anda, di tab Template Layout Plugin. Ini bagus untuk membantu Anda mulai merancang menu mega Anda. Saya akan menggunakan beberapa di contoh saya.

Menu Divi Mega Pro

menu divi mega pro.png

Setelah Anda membuat mega menu, itu akan muncul di daftar. Di sini Anda dapat mengedit, mengedit, atau menghapus menu dengan cepat. Anda juga dapat mencari, memfilter berdasarkan tanggal, melihat berdasarkan status, dll. Ini juga menyediakan kelas Mega Pro yang unik sehingga Anda dapat menyalinnya dari sini alih-alih membuka masing-masing untuk mendapatkan kelas.

Saat Anda menyalin kelas, pastikan untuk menempelkannya tanpa spasi tambahan. Jika tidak, semua menu mega pada halaman tidak akan berfungsi lagi.

Saya yakin tidak akan mudah untuk menambahkannya, tetapi fitur salin dan edit akan berguna. Anda dapat menyimpan tata letak Divi ke perpustakaan Anda untuk digunakan kembali, tetapi itu tidak termasuk pengaturan sekitarnya.

Menambahkan pemicu

pilih pemilih divi.png

Di bidang Mega Pro Triggers, Anda akan melihat satu kelas Mega Pro. Salin dan tempelkan ke bidang Kelas CSS dari elemen yang ingin Anda gunakan sebagai pemicu.

kelas css.jpg

Untuk menambahkan bidang Kelas CSS ke item menu, Anda harus mengaktifkan kelas CSS. Dari layar menu, pilih Opsi layar dan aktifkan Kelas CSS.

tambahkan menu css kelas divi.png

Apakah Anda mencari tema dan plugin WordPress terbaik?

Unduh plugin terbaik dan tema WordPress di Envato dan buat situs web Anda dengan mudah. Sudah lebih dari 49.720.000 unduhan. [EKSKLUSIF]

Tempel kelas CSS ke dalam bidang menu. Sekarang item menu ini akan menampilkan menu mega saat melayang dan membawa Anda ke halaman saat diklik.

divi mega menu design pro.png

Anda akan melihat bahwa Divi Mega Pro juga merupakan opsi di opsi tautan menu. Mereka bagus untuk menambahkan item menu ke menu yang sebenarnya tidak ke mana-mana. Tambahkan kelas CSS seperti item menu lainnya.

Bagian kontak pada menu mega

bagian kontak mega menu pro.png

Menu terbuka di hover. Saya selalu dapat mengklik tautan Kontak untuk membuka halaman kontak jika saya mau. Jika saya hanya ingin menu mega ditampilkan, saya cukup menggunakan tautan menu utama Kontak dan mengganti namanya (seperti pada contoh di atas).

Yang satu ini, saya mengubah sedikit warna menggunakan latar belakang dan pengaturan tampilan daripada menggunakan Divi Builder. Ia menambahkan sebuah bar di bagian bawah menu.

Ajakan bertindak sederhana dengan kolom menu

desain bagian kontak divi mega pro.png

Ini adalah salah satu model yang menambahkan banyak kolom. Saya melakukan penyesuaian pada latar belakang dan warna font. Saya juga menambahkan panah dan membuat lebarnya 75%.

ubah warna latar belakang divi mega pro.png

Warna latar belakang dan opsi font menambahkan sedikit lebih banyak untuk membuatnya menonjol. Saya meninggalkan perataan default, yang menempatkan menu di sebelah kanan layar. Anda dapat mengatur posisi di pengaturan.

tab

desain menu dengan tab menu mega divi.png

Template tab menyertakan modul kode dengan jQuery untuk membuat efek hover.

menu demo dengan tab divi mega pro.png

Saya menambahkan konten ke tab dan menyesuaikannya dengan situs. Setiap tautan di sebelah kiri menunjukkan tab berbeda di sebagian besar menu.

Konfigurasi info Bubbles

demo infobulles divi.png

Untuk yang ini, saya menambahkan kelas CSS ke beberapa uraian sehingga membuka pop-up kecil saat melayang. Popup hanyalah gambar dengan bayangan di bawah.

Pada gambar di atas mouse saya melayang di atas kata-kata SITUS LANGSUNG. Saya belum menyesuaikan posisinya, tetapi mudah untuk membuatnya muncul di mana pun Anda inginkan.

info desain bull divi mega pro.png

Buat Toko Online Anda dengan mudah

Unduh WooCommerce gratis, plugin e-commerce terbaik untuk menjual produk fisik dan digital Anda di WordPress. [Rekomendasi]

Untuk yang ini, saya membuat popup untuk menampilkan gambar dengan beberapa teks. Saya mengatur arah tampilan ke Rendah dan, untuk membuatnya muncul di sebelah gambar yang ingin saya tambahkan, saya menambahkan margin -300.

info hasil bubble divi.png

Pop-up sekarang muncul di kiri dan atas gambar saat saya mengarahkan kursor ke atasnya. Saya menambahkan warna latar belakang transparan, warna batas, isi dan garis bulat.

Lisensi dan dokumentasi

lisensi dan demonstration.png

Anda memiliki pilihan antara empat lisensi:

  • Situs tunggal - $ 15 per tahun
  • Tiga situs - $ 29 per tahun
  • Situs tak terbatas - $ 59 per tahun
  • Seumur Hidup Tidak Terbatas - $ 129 satu kali

Dokumentasi disediakan oleh demonstrasi video dan artikel di situs menjelaskan fitur dan menjelaskan, langkah demi langkah, cara menggunakan plugin.

Tutorial Divi lainnya

Artikel ini berisi komentar 2

  1. Hello:
    Di mana saya bisa melihat bagaimana jendela pop-up dibuat?
    Saya tidak punya cara untuk mendapatkannya. Saya hanya dapat membuat menu mega, tetapi pop-up yang saya tautkan tidak terbuka.
    Saya menemukan beberapa email dengan Divi Life tetapi mereka tidak mengklarifikasi apa pun kepada saya.
    Merci beaucoup.

Tinggalkan komentar

Alamat email Anda tidak akan dipublikasikan. Bidang yang harus diisi ditandai *

Situs ini menggunakan Akismet untuk mengurangi yang tidak diinginkan. Pelajari lebih lanjut tentang bagaimana data komentar Anda digunakan.

Kembali ke atas
4 saham
saham4
menciak
Register