Sorotan Plugin Divi: Divi Accordions Plus

Divi Accordions Plus adalah modul pihak ketiga untuk Divi Builder yang menambahkan pembuat akordeon baru. Gunakan beberapa Modul Divi Accordions Plus bersama-sama pada satu halaman dan berfungsi sebagai akordeon tunggal, jadi ketika satu membuka yang lain menutup. Atur gaya akordeon bersama-sama atau satu per satu, tampilkan ikon dan gambar, dan banyak lagi. Dalam posting ini, kita akan melihat Divi Accordions Plus, melihat apa yang dapat dilakukannya, dan melihat betapa mudahnya digunakan untuk membantu Anda memutuskan apakah itu produk yang tepat untuk kebutuhan Anda. Kami akan menggunakan Poke Restaurant About Page Layout sebagai latar belakang untuk tutorial ini. Jadi, jika Anda belum mengunduhnya, Anda dapat mengambilnya sekarang dengan keanggotaan Divi Anda.

Modul Divi Accordions Plus

Divi Accordions Plus menambahkan modul baru ke Divi Builder. Cukup tambahkan modul di mana pun Anda inginkan dalam tata letak Divi Anda.

Submodul Akordeon

Submodul membuat akordeon individual. Tambahkan sebanyak yang Anda inginkan dengan mengklik Tambahkan Item Baru. Anda juga dapat mengkloningnya, mengatur ulang, dan menghapusnya. Mereka mengikuti pengaturan di modul utama, tetapi mereka memiliki pengaturan konten dan desain khusus yang perlu Anda gunakan.

Isi

Tambahkan judul, subjudul (yang dapat dinonaktifkan jika diinginkan), dan isi isi. Ini adalah elemen utama akordeon.

Status Barang

Item State mengatur keadaan akordeon terbuka atau tertutup saat halaman dimuat. Ini mati secara default, jadi akordeon ditutup. Saya tidak membuka akordeon dalam contoh ini. Itu terbuka secara otomatis ketika saya mengaktifkan Item State.

Divi Accordions Plus Accordion Submodul Pengaturan Desain

Tab Desain untuk submodul mengontrol pengaturan untuk satu akordeon tersebut. Anda dapat menyesuaikannya di pengaturan modul utama jika ingin terlihat sama, tetapi Anda masih perlu menggunakan pengaturan ini untuk memilih gambar dan ikon. Mari kita lihat pengaturan yang unik untuk submodule.

Ikon Kiri

Ikon Kiri mengontrol elemen grafis yang muncul di sebelah kiri akordeon. Aktifkan atau nonaktifkan, putar saat terbuka, pilih ikon atau gambar, dan beri gaya dengan alat Divi standar. Gambar atau ikon seperti logo berfungsi dengan baik di sebelah kiri. Dalam contoh ini, saya memilih gambar dan mengaktifkan Ikon Putar Kiri (Toggle Terbuka), sehingga gambar diputar saat saya membuka akordeon.

Untuk contoh ini, saya telah menyesuaikan warna latar belakang dan ikon.

Ikon Kanan

Ikon Kanan mengontrol elemen grafis yang muncul di sebelah kanan akordeon. Aktifkan atau nonaktifkan, putar saat terbuka, pilih ikon atau gambar, dan beri gaya dengan alat Divi standar. Ikon yang menunjukkan keadaan akordeon terbuka atau tertutup berfungsi dengan baik di sebelah kanan.

Dalam contoh ini, saya telah memilih ikon yang berbeda, mengubah warna ikon, warna latar belakang, dan menambahkan batas gaya.

Pengaturan Konten Divi Accordions Plus

Tab Konten mencakup pengaturan dasar Divi dan beberapa pengaturan khusus untuk Divi Accordions Plus.

Kecepatan

Kecepatan mengontrol seberapa cepat matikan membuka dan menutup. Ini diatur dalam milidetik.

Mode

Mode mengubah cara kerja akordeon.

Modus Akordeon

Accordion Mode memungkinkan Anda memilih antara beberapa toggle aktif dan satu toggle aktif. Banyak Matikan Aktif biarkan semua matikan terbuka sampai pengguna menutupnya. Contoh di bawah ini menunjukkan Beberapa Matikan Aktif.

Single Active Toggles hanya memungkinkan satu toggle terbuka pada satu waktu. Ini menutup sakelar terbuka saat pengguna memilih sakelar baru. Contoh ini menunjukkan Single Active Toggles.

Mode Akordeon Global

Mode Akordeon Global adalah fitur baru yang menarik. Ini memungkinkan satu sakelar terbuka terlepas dari jumlah Modul Divi Accordion Plus di halaman. Aktifkan Mode Akordeon Global dalam setiap modul Divi Accordions Plus di halaman tempat Anda ingin menggunakan Mode Akordeon Global. Setiap modul yang tidak mengaktifkan mode ini tidak akan terpengaruh oleh mode tersebut. Ini sangat bagus untuk membuat akordeon multi-kolom di Baris yang sama.

Pada contoh di bawah ini, saya telah menambahkan modul Divi Accordions Plus lainnya dan mengaktifkan Global Accordion Mode untuk keduanya. Saat saya membuka akordeon di salah satu modul, akordeon terbuka di modul lain akan tertutup.

Pengaturan Desain Divi Accordions Plus

Pengaturan Desain mengontrol gaya default untuk semua akordeon. Pengaturan ini ditimpa oleh pengaturan submodul individual.

Tajuk

Header mengontrol warna latar belakang, warna latar toggle terbuka, spasi, batas, dan bayangan kotak. Dalam contoh ini, saya telah mengubah warna latar belakang untuk toggle terbuka dan tertutup.

Ikon Kiri

Ikon Kiri mengontrol warna ikon, warna sakelar buka ikon, warna latar belakang, warna latar sakelar terbuka, spasi, batas, dan bayangan kotak untuk seluruh modul akordeon. Jika Anda ingin memiliki keseragaman dalam gaya, sebaiknya atur warna ikon di sini, lalu pilih ikon Anda satu per satu untuk setiap sakelar di akordeon. Dalam contoh ini, saya telah menambahkan dan menata batas di sekitar ikon untuk membuatnya lebih mulus dengan warna latar belakang.

Ikon Kanan

Ikon Kanan mengontrol warna ikon, warna sakelar buka ikon, warna latar belakang, warna latar sakelar buka, spasi, batas, dan bayangan kotak. Dalam contoh, saya telah menyesuaikan warna toggle terbuka, batas, dan mengubah warna ikon pada toggle terbuka.

Judul

Judul mengontrol warna latar judul, warna latar toggle terbuka, spasi, batas, dan bayangan kotak.

Tubuh

Tubuh mengontrol badan item, spasi, batas, dan bayangan kotak. Saya telah menyesuaikan batas dalam contoh ini.

Teks Tajuk

Teks Header mengontrol teks sakelar terbuka dan memungkinkan Anda untuk mengontrol judul dan subjudul secara terpisah dari menu yang sama. Ini mencakup semua kontrol teks standar. Saya telah menyesuaikan warna judul dan subtitle, mengubah ukuran font judul, dan mengaturnya menjadi tebal pada contoh di bawah ini.

Judul Tubuh

Judul Isi menyertakan semua kontrol teks standar untuk judul isi yang telah Anda tentukan di area konten. Pada contoh di bawah ini, saya telah menambahkan tag heading H2 dan H3 ke konten body. Saya mengubah bobot dan warna font untuk kedua judul di dalam konten tubuh.

Teks Tubuh

Teks Isi menyertakan semua kontrol teks standar untuk teks isi di area konten. Dalam contoh ini, saya mengubah font, membuatnya miring, mengubah warna, dan mengubah ukuran font.

Demo Terakhir dengan Restoran Divi Poke

Seperti inilah tampilan akordeon terakhir dalam Tata Letak Halaman Tentang Kami untuk Paket Tata Letak Restoran Divi Poke.

Divi Accordion Plus Demo

Divi Accordions Plus hadir dengan tujuh demo untuk membantu Anda memulai.

Demo 1

Demo pertama menyertakan akordeon multikolom dengan ikon multiwarna. Akordeon memiliki satu batas, dan isinya dibatasi di semua sisi.

Demo 2

Demo kedua kami menghadirkan akordeon dalam satu kolom dengan highlight biru dan bayangan kotak. Ikon memiliki latar belakang biru.

Demo 3

Demo ketiga kami menggunakan tata letak dua kolom dan menggunakan warna berbeda untuk setiap akordeon.

Demo 4

Demo keempat menggunakan akordeon satu kolom dengan warna-warna hangat dan batas terang.

Demo 5

Demo lima menggunakan judul dan ikon merah dan menyertakan latar belakang cokelat untuk badan dan latar belakang hijau untuk tajuk. Akordeon ditempatkan dalam dua kolom.

Demo 6

Demo keenam menggunakan latar belakang header biru muda dengan biru tua untuk teks judul dan latar belakang ikon untuk akordeon terbuka.

Demo 7

Demo tujuh menampilkan setiap elemen akordeon secara terpisah dengan bayangan kotak untuk setiap elemen.

Beli Divi Accordions Plus

Divi Accordions Plus tersedia di Divi Marketplace seharga $9. Ini mencakup penggunaan tanpa batas, jaminan uang kembali 30 hari, dan dukungan serta pembaruan selama satu tahun.

Mengakhiri Pikiran

Itulah tampilan kami di Divi Accordions Plus. Ini adalah modul sederhana, tetapi mencakup banyak fitur untuk akordeon. Saya terutama suka itu bekerja dengan banyak modul di halaman yang sama. Saya menemukan pengaturannya intuitif dan setiap pengaturan yang ingin saya sesuaikan ada di sana. Jika Anda tertarik dengan pembuat akordeon tangguh yang mudah digunakan, Divi Accordions Plus layak untuk dicoba.

Kami ingin mendengar dari Anda. Sudahkah Anda mencoba Divi Accordions Plus? Beri tahu kami pendapat Anda tentang hal itu di komentar.