Divi Toolbox este un plugin care adaugă multe efecte noi la Divi care necesită în mod normal CSS, JavaScript, PHP sau multe plugin-uri individuale. Efectele sunt ușor de utilizat, de personalizat și de oferit site-ul web Oferă acea strălucire suplimentară pentru a ieși în evidență din mulțime.

Efectele includ modificări la nivel de site, noi meniuri mobile, fundaluri de particule, subsoluri, widgeturi, stiluri, animații, anteturi, navigare, noi machete de blog, Prezentări Divi în locații noi, personalizarea ecranului de conectare, ferestre pop-up etc. Multe caracteristici pot fi personalizate cu noi adăugiri la personalizatorul temei. Divi Toolbox nu funcționează cu Extra sau cu pluginul Divi Builder.

Setări generale ale Divi Toolbox

divi toolbox settings.png

Ecranul de opțiuni Divi Toolbox este adăugat la meniul tabloului de bord Divi. Setările sunt activate aici, dar ajustările se fac în personalizator.

Setările general include stilul anteturilor globale, pagina de autentificare personalizată, ascunderea proiectelor, permisiunea de încărcare a tipurilor de fișiere SVG, bara de defilare personalizată a browserului, 404 setări de pagină (alegeți aspectul și ascundeți antet și subsol) și pictograme sociale (activați stilul, deschideți fișierul). filă nouă și adăugați mai multe pictograme).

divi toolbox parametri generali.png

Adăugarea pictogramelor sociale deschide un câmp în care puteți introduce adresa URL a nouă rețele sociale suplimentare.

adăugați rețeaua socială divi.png

Iată fila general a personalizatorului, unde pot regla setările pe care le-am activat. Setările includ anteturi și fonturi, bara de derulare a browserului și ecranul de conectare. În acest exemplu, am făcut câteva ajustări la textul și corpul h1 și am adăugat un stil la bara de derulare. Am adăugat și mai multe pictograme sociale.

divi toolbox settings.png

Pentru ecranul de conectare, va trebui să efectuați modificările, apoi să vă deconectați sau să vizualizați ecranul în alt browser.

Ecran de autentificare personalizat divi.png

Iată ecranul meu de conectare după ce am adăugat o imagine de fundal, o siglă și am schimbat dimensiunea și culoarea câmpurilor și a textului. Este nevoie de puține modificări, deoarece nu puteți vedea ecranul în timp ce efectuați modificările.

Setări antet Divi Toolbox

setări antet divi.png

Setările Antet adăugați un stil la meniu, activați un meniu drop-down personalizat, adăugați un buton de meniu CTA, schimbați sigla de pe dispozitivul de andocare, activați sigla suprapusă și adăugați un aspect Divi înainte de a naviga pe pagina de pornire, precum și „o formatare înainte și după. răsfoind alte pagini.

Configurarea barei de instrumente divi.png

Butonul de meniu CTA vă permite să aplicați CTA la primul sau ultimul element de meniu sau să aplicați o clasă personalizată. Acesta oferă CSS și instrucțiuni despre unde să-l adăugați.

Personalizatorul antetului divi.png

Iată personalizatorul pentru antet. Am adăugat un aspect deasupra meniului (în acest exemplu este doar un modul text, dar puteți adăuga un aspect complet dacă doriți). Logo-ul suprapus are o cutie pătrată cu efecte de umbră. Am schimbat dimensiunea logo-ului de la 200 la 140 și am mutat pictogramele sociale în meniul principal. Plac peste elementul de meniu Servicii, astfel încât să puteți vedea efectul CSS.

Setări subsol în caseta de instrumente Divi

Setări de subsol divi.png

Setările de subsol includ un subsol lipicios, un subsol de afișare, personalizați meniuri și widget-uri, personalizați butonul Înapoi la partea de sus (care adaugă o opțiune de legătură pentru butoane personalizate) și adăugați aspecte înainte și după subsolul.

personalizați subsolul divi.png

În acest exemplu, am schimbat fontul antetului și al meniului în majuscule și am mărit spațiul. Am ajustat, de asemenea, culorile cu hover și am adăugat o pictogramă lângă textul cu hover. Am adăugat un aspect după aspect. Aceasta folosește un subsol dezvăluit (motiv pentru care textul se află în spatele modulului de text de mai sus).

Am stilat butonul din partea de sus a paginii pentru a afișa textul. Are efect de umbră și i-am reglat locația. Am lăsat culorile implicite. Am centrat textul de jos și pictogramele sociale. Pentru efectul de hover, am ales Grow (include, de asemenea, micșorarea, deplasarea în sus, în jos, oscilația, bătăile inimii, jello și pulsul).

Setări pentru Divi Toolbox Mobile

Setări pentru setul de instrumente pentru mobile.png

Setările mobil includeți un câmp pentru a introduce punctul de întrerupere al meniului mobil (lățimea exactă a ecranului când meniul se schimbă de pe desktop la mobil), stiluri personalizate, editați sigla, alegeți efectul de clic pe pictograma hamburger , restrângeți submeniul imbricat și activați. mai multe clase CSS. Clasele CSS vă permit să inversați coloanele și să centrați textul, modulele și butoanele.

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

Iată o previzualizare a paginii în Google Chrome cu receptiv selectat. De îndată ce am luat dimensiunea ecranului mai mică de 980 de pixeli, s-a schimbat în pictograma mobilă pe care am selectat-o ​​și a adăugat meniul de hamburger cu o animație pe care am ales-o.

animație meniu mobil.png

În acest ecran, stilez culoarea de fundal, culoarea fundalului și meniul mobil hamburger. Am schimbat textul meniului principal cu majuscule și am lăsat standardul de text CTA. De asemenea, am schimbat fundalul pentru elementul de meniu CTA. De asemenea, puteți regla dimensiunea meniului și a pictogramei.

Setări Blog Divi Toolbox

setări blog divi toolbox.png

Parametrii de blogul vă permite să personalizați bara laterală și widgeturile, să postați meta, arhivați și pagini de categorii, să alegeți un aspect (din 6 opțiuni), să ascundeți bara laterală a arhivei și să personalizați textul butoanelor Citeste mai mult.

Pentru postările individuale, puteți alege aspectul barei laterale, ascunde titlul postării, adăuga o casetă de autor, adăuga link-uri anterioare și următoare, adăuga postări asociate și personaliza formă de comentarii. De asemenea, puteți adăuga machete personalizate post-navigare la postări unice, arhive, categorii, pagini de autor și pagini cu rezultatele căutării.

personalizați aspectul blogului divi.png

Pentru pagina blogului, am adăugat un efect de umbră în bara laterală, am schimbat fonturile și stilul, am stilizat caseta de căutare și am mărit dimensiunea chenarului. Folosește un aspect alternativ și am personalizat textul pentru butonul de citire mai mult.

rezultat blog interfață de personalizare divi.png

Acest exemplu este aspectul 6. Am personalizat din nou culorile fontului pentru secțiunea meta și am adăugat o culoare cu mouse-ul. De asemenea, am personalizat fundalul pentru butonul Aflați mai multe.

schimbați fontul conținutului blogului divi.png

Postările de blog individuale vă permit să personalizați fiecare dintre articolele pe care le-ați adăugat în setările blogului. În acest ecran, personalizez articolele asociate, linkurile următoare și anterioare, precum și zona de autor. Controlați tot textul, culorile, umbrele etc.

comentariu secțiune personalizare divi.png

În acest exemplu, personalizez formă de comentarii. Controlați culorile câmpului (focalizare și nefocalizare), chenarul, textul, culorile, butonul etc. Am schimbat culoarea de fundal a butonului, culoarea focalizării câmpului, am adăugat un chenar la câmp și am schimbat raza.

Licența Divi Toolbox

Ai de ales între două licențiere :

  • Licență obișnuită (de utilizat pentru un proiect) - 49,00 €
  • Licență extinsă (pentru utilizare în proiecte nelimitate) - 169,00 €

Ce să-ți amintești

Sunt impresionat de cantitatea de funcții și setări din acest plugin. Îmi place în mod special faptul că poate adăuga articole similare, linkuri anterioare și următoare și o zonă de autor la postările de blog care nu sunt create cu generatorul Divi. Bara de defilare este, de asemenea, o atingere plăcută.

Puteți accesa câteva setări în modulele Divi, cum ar fi textul antetului, dar oferă mai multe detalii pentru acele setări. Aș dori să mai fie adăugate câteva modificări (de exemplu, efecte de umbră pentru zona de comentarii, mai multe opțiuni de sigle, locații de pictograme de socializare etc.).

Dacă doriți să adăugați o tonă de efecte noi la Divi în cel mai simplu mod posibil, Divi Toolbox merită ocolită.