Divi Toolbox je doplnok ktorý do Divi pridáva mnoho nových efektov, ktoré bežne vyžadujú CSS, JavaScript, PHP alebo mnoho individuálnych pluginov. Efekty sa ľahko používajú, prispôsobujú a poskytujú svoje webové stránky Dodajte extra lesk, aby ste vynikli z davu.

Medzi efekty patria zmeny na celom webe, nové mobilné ponuky, pozadie častíc, päty, widgety, štýly, animácie, hlavičky, navigácia, nové rozloženia blogov, Prezentácie Divi na nových miestach, prispôsobenie prihlasovacej obrazovky, kontextové okná atď. Mnoho funkcií je možné prispôsobiť novými prírastkami do nástroja na prispôsobenie témy. Sada Divi Toolbox nefunguje s doplnkom Extra ani s doplnkom Divi Builder.

Všeobecné nastavenia Divi Toolbox

divi toolbox settings.png

Obrazovka možností Divi Toolbox je pridaná do ponuky dashboardu Divi. Tu sú nastavenia povolené, ale úpravy sa vykonávajú v nástroji na prispôsobenie.

Nastavenia všeobecný zahŕňajú štýl globálnych hlavičiek, vlastnú prihlasovaciu stránku, skrývanie projektov, povolenie na nahrávanie typov súborov SVG, vlastný posúvač prehľadávača, nastavenie stránky 404 (vyberte rozloženie a skryte hlavička a päta) a sociálne ikony (aktivovať štýl, otvoriť súbor). nová karta a pridať ďalšie ikony).

všeobecné parametre súboru divi.png

Pridaním sociálnych ikon sa otvorí pole, kde môžete zadať adresu URL ďalších 9 sociálnych sietí.

pridať sociálnu sieť divi.png

Tu je karta Všeobecný nástroja na prispôsobenie, kde môžem upraviť nastavenia, ktoré som povolil. Medzi nastavenia patria hlavičky a písma, posúvacia lišta prehliadača a prihlasovacia obrazovka. V tomto príklade som vykonal niekoľko úprav textu a tela h1 a do posúvača som pridal štýl. Pridal som aj viac sociálnych ikon.

divi toolbox customization settings.png

Na prihlasovacej obrazovke budete musieť vykonať zmeny a potom sa odhlásiť alebo zobraziť obrazovku v inom prehliadači.

vlastný prihlasovací displej divi.png

Tu je moja prihlasovacia obrazovka po pridaní obrázka na pozadí, loga a zmene veľkosti a farby polí a textu. Vyžaduje to trochu vylepšenia, pretože pri vykonávaní zmien nevidíte na obrazovku.

Nastavenia hlavičky Divi Toolbox

nastavenie záhlavia divi.png

Nastavenia hlavička pridať štýl do ponuky, aktivovať vlastnú rozbaľovaciu ponuku, pridať tlačidlo ponuky CTA, zmeniť logo na ukotviteľnom paneli, aktivovať logo prekrytia a pred prehliadaním domovskej stránky pridať rozloženie Divi, ako aj "formátovanie pred a po. prehliadanie ďalších stránok.

konfigurácia panela nástrojov divi.png

Tlačidlo ponuky CTA vám umožňuje použiť CTA na prvú alebo poslednú položku ponuky alebo použiť vlastnú triedu. Poskytuje CSS a pokyny, kam ho pridať.

divi.png hlavička prispôsobovač

Tu je nástroj na prispôsobenie hlavičky. Nad ponuku som pridal rozloženie (v tomto príklade je to iba textový modul, ale ak chcete, môžete pridať celé rozloženie). Prekrývajúce sa logo má štvorcový rámček s tieňovými efektmi. Zmenil som veľkosť loga z 200 na 140 a presunul som sociálne ikony do hlavnej ponuky. Vznášam sa nad položkou ponuky Služby, aby ste videli efekt CSS.

Nastavenia päty v paneli nástrojov Divi

footer settings divi.png

Medzi nastavenia päty patrí lepkavá päta, päta displeja, prispôsobenie ponúk a miniaplikácií, prispôsobenie tlačidla Naspäť na začiatok (čím sa pridáva vlastná možnosť prepojenia tlačidla) a pridanie pred a po rozložení pätu.

prispôsobiť pätu divi.png

V tomto príklade som zmenil písma hlavičky a ponuky na všetky veľké písmená a zväčšil medzery. Tiež som upravil farby vznášania a pridal ikonu vedľa textu vznášania. Po rozložení som pridal rozloženie. Toto používa odhalenú pätu (čo je dôvod, prečo je text za textovým modulom vyššie).

Na zobrazenie textu som navrhol tlačidlo hornej časti stránky. Má efekt tieňa a upravil som jeho umiestnenie. Nechal som predvolené farby. Spodný text a sociálne ikony som vycentroval. Pre efekt vznášania som zvolil Grow (zahŕňa tiež zmenšenie, posun hore, dole, kolísanie, tlkot srdca, želé a pulz).

Nastavenia pre Divi Toolbox Mobile

nastavenia panela nástrojov pre mobil.png

Nastavenia mobilný zahrnúť pole na zadanie zarážky mobilnej ponuky (presná šírka obrazovky pri zmene ponuky z pracovnej plochy na mobilnú), vlastné štýly, upraviť logo, zvoliť ikonu hamburgeru kliknúť na efekt , zbalte vnorené submenu a aktivujte. niekoľko tried CSS. Triedy CSS umožňujú obrátiť stĺpce a vycentrovať text, moduly a tlačidlá.

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

Tu je náhľad stránky v Google Chrome s vybratou možnosťou Responzívny. Akonáhle som stiahol veľkosť obrazovky pod 980 pixelov, zmenila sa na ikonu mobilu, ktorú som vybral, a pridal som ponuku hamburgerov s animáciou, ktorú som si vybral.

mobilné menu animation.png

Na tejto obrazovke upravujem farbu pozadia, pohyblivú farbu pozadia a ponuku mobilných hamburgerov. Zmenil som text položky hlavnej ponuky na veľké písmená a nechal som textový štandard CTA. Tiež som zmenil pozadie položky ponuky CTA. Môžete tiež upraviť veľkosť ponuky a ikon.

Nastavenia blogu Divi Toolbox

nastavenia blogu divi toolbox.png

Parametre blog vám umožní prispôsobiť bočný panel a widgety, zverejniť meta, archivovať a stránky kategórií, zvoliť rozloženie (zo 6 možností), skryť bočný panel archívu a prispôsobiť text tlačidla Čítaj viac.

Pre jednotlivé príspevky si môžete vybrať rozloženie bočného panela, skryť názov príspevku, pridať pole autora, pridať predchádzajúce a nasledujúce odkazy, pridať súvisiace príspevky a prispôsobiť formulár komentárov. Môžete tiež pridať vlastné rozloženia po navigácii do jednotlivých príspevkov, archívov, kategórií, stránok autorov a stránok s výsledkami vyhľadávania.

prispôsobiť vzhľad blogu divi.png

Pre stránku blogu som do bočného panela pridal tieňový efekt, zmenil písma a štýl, upravil štýl vyhľadávacieho poľa a zväčšil veľkosť okraja. Používa striedavé rozloženie a prispôsobil som text pre tlačidlo prečítať viac.

rozhranie na prispôsobenie výsledkov blog divi.png

Tento príklad je rozloženie 6. Znova som upravil farby písma pre meta sekciu a pridal farbu vznášania. Tiež som prispôsobil pozadie pre tlačidlo Viac informácií.

zmeniť písmo obsahu blogu divi.png

Jednotlivé blogové príspevky vám umožňujú prispôsobiť každú z položiek, ktoré ste pridali v nastaveniach blogu. Na tejto obrazovke upravujem súvisiace články, ďalší a predchádzajúci odkaz, ako aj oblasť autora. Ovládate všetok text, farby, tiene atď.

časť prispôsobenia časti divi.png

V tomto príklade prispôsobujem formulár komentárov. Ovládate farby poľa (zaostrené a neostré), orámovanie, text, farby, tlačidlo atď. Zmenil som farbu pozadia tlačidla, farbu zaostrenia poľa, pridal som orámovanie poľa a zmenil som polomer.

Licencia Divi Toolbox

Máte na výber medzi dvoma licencií :

  • Bežná licencia (na použitie na projekte) - 49,00 €
  • Predĺžená licencia (pre použitie na neobmedzených projektoch) - 169,00 €

Čo si pamätať

Množstvo funkcií a nastavení v tomto doplnku na mňa urobilo dojem. Páči sa mi najmä to, že môže pridávať podobné články, predchádzajúce a nasledujúce odkazy a autorskú oblasť do blogových príspevkov, ktoré nie sú vytvorené pomocou nástroja na tvorbu súborov Divi. Príjemným dotykom je aj posúvač.

V moduloch Divi máte prístup k niekoľkým nastaveniam, napríklad k textom hlavičky, tieto nastavenia však poskytujú viac podrobností. Bol by som rád, keby bolo pridaných niekoľko ďalších vylepšení (napr. Tieňové efekty pre oblasť komentárov, viac možností loga, umiestnenie ikon na sociálnych sieťach atď.).

Ak chcete do Divi pridať najjednoduchším možným spôsobom veľa nových efektov, za obchádzku stojí Divi Toolbox.