Divi Toolbox adalah sebuah plugin yang menambahkan banyak efek baru ke Divi yang biasanya memerlukan CSS, JavaScript, PHP, atau banyak plugin individual. Efeknya mudah digunakan, disesuaikan, dan diberikan sesuai keinginan Anda situs jaringan Berikan kilau ekstra agar menonjol dari yang lain.

Efek mencakup perubahan di seluruh situs, menu seluler baru, latar belakang partikel, footer, widget, gaya, animasi, tajuk, navigasi, tata letak blog baru, Presentasi Divi di lokasi baru, kustomisasi layar login, popup, dll. Banyak fitur yang dapat disesuaikan dengan tambahan baru pada penyesuai tema. Divi Toolbox tidak bekerja dengan Extra atau plugin Divi Builder.

Pengaturan umum Divi Toolbox

divi toolbox settings.png

Layar opsi Divi Toolbox ditambahkan ke menu dasbor Divi. Pengaturan diaktifkan di sini, tetapi penyesuaian dilakukan di penyesuai.

Pengaturan umum termasuk gaya tajuk global, halaman masuk khusus, menyembunyikan proyek, izin untuk mengunggah jenis file SVG, bilah gulir browser khusus, pengaturan halaman 404 (pilih tata letak dan sembunyikan header dan footer) dan ikon sosial (aktifkan gaya, buka file). tab baru dan tambahkan lebih banyak ikon).

divi toolbox, parameter umum

Menambahkan ikon sosial akan membuka bidang tempat Anda dapat memasukkan URL dari 9 jejaring sosial tambahan.

tambahkan jejaring sosial divi.png

Ini tabnya Général dari penyesuai, tempat saya dapat menyesuaikan pengaturan yang telah saya aktifkan. Pengaturan termasuk header dan font, scroll bar browser, dan layar login. Dalam contoh ini, saya telah membuat beberapa penyesuaian pada teks dan badan h1, dan menambahkan gaya ke bilah gulir. Saya juga menambahkan lebih banyak ikon sosial.

pengaturan kustomisasi divi toolbox.png

Untuk layar login, Anda harus melakukan perubahan dan kemudian keluar atau melihat layar di browser lain.

layar masuk kustom divi.png

Berikut adalah layar login saya setelah menambahkan gambar latar belakang, logo, dan mengubah ukuran dan warna kolom dan teks. Dibutuhkan sedikit penyesuaian karena Anda tidak dapat melihat layar saat melakukan perubahan.

Pengaturan header Divi Toolbox

pengaturan header divi.png

Pengaturan Header tambahkan gaya ke menu, aktifkan menu drop-down kustom, tambahkan tombol menu CTA, ubah logo pada buruh pelabuhan, aktifkan logo overlay dan tambahkan tata letak Divi sebelum menjelajahi halaman beranda, serta 'format sebelum dan sesudah. menjelajahi halaman lain.

konfigurasi toolbar divi.png

Tombol menu CTA memungkinkan Anda menerapkan CTA ke item menu pertama atau terakhir atau menerapkan kelas khusus. Ini memberikan CSS dan instruksi tentang tempat untuk menambahkannya.

penyesuai header divi.png

Berikut adalah penyesuai untuk tajuk. Saya menambahkan tata letak di atas menu (dalam contoh ini hanya modul teks, tetapi Anda dapat menambahkan tata letak lengkap jika Anda mau). Logo yang tumpang tindih memiliki kotak persegi dengan efek bayangan. Saya mengubah ukuran logo dari 200 menjadi 140 dan memindahkan ikon sosial ke menu utama. Saya mengarahkan kursor ke item menu Layanan sehingga Anda dapat melihat efek CSS.

Pengaturan Footer di Divi Toolbox

pengaturan footer divi.png

Pengaturan footer termasuk footer lengket, footer tampilan, menu kustomisasi dan widget, sesuaikan tombol Kembali ke Atas (yang menambahkan opsi tautan tombol kustom), dan menambahkan sebelum dan sesudah tata letak catatan kaki.

menyesuaikan footer divi.png

Dalam contoh ini, saya mengubah font header dan menu menjadi huruf besar semua dan meningkatkan jarak. Saya juga menyesuaikan warna hover dan menambahkan ikon di sebelah teks hover. Saya menambahkan tata letak setelah tata letak. Ini menggunakan footer terungkap (itulah sebabnya teks berada di belakang modul teks di atas).

Saya menata tombol bagian atas halaman untuk menampilkan teks. Ini memiliki efek bayangan dan saya menyesuaikan lokasinya. Saya meninggalkan warna default. Saya telah memusatkan teks bawah dan ikon sosial. Untuk efek hover, saya memilih Grow (ini juga termasuk shrink, move up, down, wobble, heartbeat, jello, dan pulse).

Pengaturan untuk Divi Toolbox Mobile

pengaturan toolbox untuk mobile.png

Pengaturan mobil sertakan bidang untuk masuk ke breakpoint menu seluler (lebar layar yang tepat saat menu berubah dari desktop ke seluler), gaya khusus, edit logo, pilih efek klik ikon hamburger , ciutkan submenu bersarang dan aktifkan. beberapa kelas CSS. Kelas CSS memungkinkan Anda membalik kolom dan teks tengah, modul, dan tombol.

Divi-Toolbox-Mobile-Settings-for mobile.png

Berikut adalah pratinjau halaman di Google Chrome dengan Responsif dipilih. Segera setelah saya mengambil ukuran layar di bawah 980px, itu berubah menjadi ikon seluler yang saya pilih dan menambahkan menu hamburger dengan animasi yang saya pilih.

menu mobile animation.png

Di layar ini, saya memberi gaya warna latar belakang, warna latar belakang kursor, dan menu hamburger menu seluler. Saya mengubah teks item menu utama menjadi huruf besar dan meninggalkan standar teks CTA. Saya juga mengubah latar belakang untuk item menu CTA. Anda juga dapat menyesuaikan menu dan ukuran ikon.

Pengaturan Blog Divi Toolbox

pengaturan blog divi toolbox.png

Parameter dari blog memungkinkan Anda menyesuaikan sidebar dan widget, memposting meta, mengarsipkan dan halaman kategori, memilih tata letak (dari 6 opsi), menyembunyikan sidebar arsip, dan menyesuaikan teks tombol Baca lebih lajut.

Untuk posting tunggal, Anda dapat memilih tata letak sidebar, menyembunyikan judul posting, menambahkan kotak penulis, menambahkan tautan sebelumnya dan berikutnya, menambahkan posting terkait, dan menyesuaikan bentuk komentar. Anda juga dapat menambahkan tata letak pasca-navigasi khusus ke satu posting, arsip, kategori, halaman penulis, dan halaman hasil pencarian.

sesuaikan penampilan blog divi.png

Untuk halaman blog, saya menambahkan efek bayangan ke sidebar, mengubah font dan gaya, memberi gaya pada kotak pencarian, dan meningkatkan ukuran batas. Ini menggunakan tata letak bergantian dan saya menyesuaikan teks untuk tombol baca lebih lanjut.

hasil kustomisasi antarmuka blog divi.png

Contoh ini adalah layout 6. Saya menyesuaikan warna font untuk bagian meta lagi dan menambahkan warna hover. Saya juga menyesuaikan latar belakang untuk tombol Pelajari Lebih Lanjut.

ubah font dari konten blog divi.png

Entri blog individual memungkinkan Anda menyesuaikan setiap item yang telah Anda tambahkan di pengaturan blog. Di layar ini, saya menyesuaikan artikel terkait, tautan berikutnya dan sebelumnya, serta area penulis. Anda mengontrol semua teks, warna, bayangan, dll.

komentar bagian penyesuaian divi.png

Dalam contoh ini, saya menyesuaikan bentuk komentar. Anda mengontrol warna bidang (fokus dan non-fokus), batas, teks, warna, tombol, dll. Saya mengubah warna latar belakang tombol, warna fokus bidang, menambahkan batas ke bidang, dan mengubah radius.

Lisensi Divi Toolbox

Anda punya pilihan di antara dua lisensi :

  • Lisensi biasa (untuk digunakan pada proyek) - € 49,00
  • Lisensi diperpanjang (untuk digunakan pada proyek tak terbatas) - € 169,00

Apa yang harus diingat?

Saya terkesan dengan jumlah fitur dan pengaturan di plugin ini. Saya sangat menyukai kenyataan bahwa ia dapat menambahkan artikel serupa, tautan sebelumnya dan berikutnya, dan area penulis ke posting blog yang tidak dibuat dengan pembuat Divi. Bilah gulir juga merupakan sentuhan yang bagus.

Anda dapat mengakses beberapa pengaturan dalam modul Divi, seperti teks header, tetapi ini memberikan detail lebih lanjut untuk pengaturan tersebut. Saya ingin menambahkan beberapa penyesuaian lagi (misalnya efek bayangan untuk area komentar, lebih banyak opsi logo, lokasi ikon media sosial, dll.).

Jika Anda ingin menambahkan satu ton efek baru ke Divi dengan cara semudah mungkin, Divi Toolbox layak untuk diputar.