Divi Toolbox is een plug-in die veel nieuwe effecten aan Divi toevoegt waarvoor normaal gesproken CSS, JavaScript, PHP of veel individuele plug-ins nodig zijn. De effecten zijn eenvoudig te gebruiken, aan te passen en te geven Site web Geef die extra sprankeling om je te onderscheiden van de massa.
Effecten zijn onder meer wijzigingen voor de hele site, nieuwe mobiele menu's, partikelachtergronden, voetteksten, widgets, stijlen, animaties, kopteksten, navigatie, nieuwe bloglay-outs, Divi-presentaties op nieuwe locaties, aanpassing van het inlogscherm, pop-ups, etc. Veel functies kunnen worden aangepast met nieuwe toevoegingen aan de thema-aanpasser. Divi Toolbox werkt niet met Extra of de Divi Builder-plug-in.
Algemene instellingen van Divi Toolbox
Het Divi Toolbox-optiescherm is toegevoegd aan het Divi-dashboardmenu. Instellingen zijn hier ingeschakeld, maar aanpassingen worden gemaakt in de customizer.
De instellingen algemeen omvatten globale koptekststijl, aangepaste inlogpagina, projecten verbergen, toestemming om SVG-bestandstypen te uploaden, aangepaste browser-schuifbalk, 404 pagina-instellingen (kies lay-out en verberg koptekst en voettekst) en sociale pictogrammen (stijl activeren, bestand openen). nieuw tabblad en voeg meer pictogrammen toe).
Door sociale pictogrammen toe te voegen, wordt een veld geopend waarin u de URL van 9 extra sociale netwerken kunt invoeren.
Hier is het tabblad General van de customizer, waar ik de instellingen kan aanpassen die ik heb ingeschakeld. De instellingen omvatten kopteksten en lettertypen, de schuifbalk van de browser en het inlogscherm. In dit voorbeeld heb ik enkele aanpassingen gedaan aan de h1-tekst en de hoofdtekst, en heb ik stijl toegevoegd aan de schuifbalk. Ik heb ook meer sociale pictogrammen toegevoegd.
Voor het inlogscherm moet u uw wijzigingen aanbrengen en vervolgens uitloggen of het scherm in een andere browser bekijken.
Hier is mijn inlogscherm na het toevoegen van een achtergrondafbeelding, logo en het wijzigen van de grootte en kleur van velden en tekst. Het vergt een beetje aanpassingen, omdat u het scherm niet kunt zien terwijl u uw wijzigingen aanbrengt.
Divi Toolbox header-instellingen
De instellingen hoofd voeg een stijl toe aan het menu, activeer een aangepast vervolgkeuzemenu, voeg een CTA-menuknop toe, verander het logo op het koppelvenster, activeer het overlay-logo en voeg een Divi-lay-out toe voordat je door de startpagina bladert, en 'een opmaak voor en na. bladeren door andere pagina's.
Met de CTA-menuknop kunt u de CTA toepassen op het eerste of laatste menu-item of een aangepaste klasse toepassen. Het bevat de CSS en instructies over waar het moet worden toegevoegd.
Hier is de aanpasser voor de koptekst. Ik heb een lay-out toegevoegd boven het menu (in dit voorbeeld is het gewoon een tekstmodule, maar je kunt een volledige lay-out toevoegen als je wilt). Het overlappende logo heeft een vierkante doos met schaduweffecten. Ik heb de logogrootte gewijzigd van 200 in 140 en de sociale pictogrammen naar het hoofdmenu verplaatst. Ik zweef over het menu-item Services zodat je het CSS-effect kunt zien.
Voettekstinstellingen in de Divi Toolbox
Instellingen voettekst omvatten een plakkerige voettekst, voettekst weergeven, menu's en widgets aanpassen, de knop Terug naar boven aanpassen (waarmee een optie voor een aangepaste knopkoppeling wordt toegevoegd) en voor en na lay-outs toevoegen de voettekst.
In dit voorbeeld heb ik de koptekst en menu-lettertypen gewijzigd in hoofdletters en de afstand vergroot. Ik heb ook de hover-kleuren aangepast en een pictogram toegevoegd naast de hover-tekst. Ik heb een layout toegevoegd na de layout. Dit gebruikt een geopenbaarde voettekst (daarom staat de tekst achter de bovenstaande tekstmodule).
Ik heb de knop bovenaan de pagina gestileerd om tekst weer te geven. Het heeft een schaduweffect en ik heb de locatie aangepast. Ik heb de standaardkleuren verlaten. Ik heb de onderste tekst en de sociale pictogrammen gecentreerd. Voor het hover-effect koos ik voor Grow (het omvat ook verkleinen, omhoog, omlaag bewegen, wiebelen, hartslag, jello en puls).
Instellingen voor Divi Toolbox Mobile
De instellingen mobiel voeg een veld toe om het breekpunt van het mobiele menu in te voeren (de exacte breedte van het scherm wanneer het menu verandert van desktop naar mobiel), aangepaste stijlen, bewerk het logo, kies het klikeffect van het hamburgersymbool , vouw het geneste submenu samen en activeer. verschillende CSS-klassen. Met CSS-klassen kunt u kolommen omkeren en tekst, modules en knoppen centreren.
Hier is een voorbeeld van de pagina in Kopen Google Reviews Chrome met Responsief geselecteerd. Zodra ik de schermgrootte kleiner dan 980 pixels nam, veranderde deze in het mobiele pictogram dat ik had geselecteerd en voegde ik het hamburgermenu toe met een animatie die ik had gekozen.
In dit scherm vorm ik de achtergrondkleur, de achtergrondkleur van de muisaanwijzer en het hamburgermenu van het mobiele menu. Ik veranderde de tekst van de hoofdmenu-items in hoofdletters en verliet de CTA-tekststandaard. Ik heb ook de achtergrond voor het CTA-menu-item gewijzigd. U kunt ook de menu- en pictogramgrootte aanpassen.
Bloginstellingen Divi Toolbox
De parameters van blog stelt u in staat om zijbalk en widgets aan te passen, meta-, archief- en categoriepagina's te posten, een lay-out te kiezen (uit 6 opties), archiefzijbalk te verbergen en knoptekst aan te passen Lees verder.
Voor enkele berichten kun je de lay-out van de zijbalk kiezen, de titel van het bericht verbergen, een auteursvak toevoegen, vorige en volgende links toevoegen, gerelateerde berichten toevoegen en de formulier van opmerkingen. U kunt ook aangepaste lay-outs na navigatie toevoegen aan afzonderlijke berichten, archieven, categorieën, auteurspagina's en pagina's met zoekresultaten.
Voor de blogpagina heb ik een schaduweffect aan de zijbalk toegevoegd, de lettertypen en stijl gewijzigd, het zoekvak opgemaakt en de rand groter gemaakt. Het maakt gebruik van een afwisselende lay-out en ik heb de tekst voor de lees meer-knop aangepast.
Dit voorbeeld is layout 6. Ik heb de lettertypekleuren voor de meta-sectie opnieuw aangepast en een zweefkleur toegevoegd. Ik heb ook de achtergrond aangepast voor de knop Meer informatie.
Met afzonderlijke blogposts kunt u elk van de items die u in de bloginstellingen hebt toegevoegd, aanpassen. In dit scherm pas ik de bijbehorende artikelen, de volgende en vorige links aan, evenals het auteurgebied. U beheert alle tekst, kleuren, schaduwen, enz.
In dit voorbeeld pas ik de formulier van opmerkingen. Je regelt de veldkleuren (focus en non-focus), rand, tekst, kleuren, knop, etc. Ik veranderde de achtergrondkleur van de knop, de focuskleur van het veld, voegde een rand toe aan het veld en veranderde de straal.
Divi Toolbox-licentie
U heeft de keuze tussen twee licentie :
- Reguliere licentie (te gebruiken voor een project) - € 49,00
- Uitgebreide licentie (voor gebruik op onbeperkte projecten) - € 169,00
Wat te onthouden
Ik ben onder de indruk van het aantal functies en instellingen in deze plug-in. Ik vind het vooral leuk dat het vergelijkbare artikelen, vorige en volgende links en een auteurgebied kan toevoegen aan blogposts die niet met de Divi-builder zijn gemaakt. De schuifbalk is ook een leuke touch.
U hebt toegang tot een paar instellingen in de Divi-modules, zoals koptekst, maar het biedt meer details voor die instellingen. Ik zou graag nog een paar tweaks willen toevoegen (bijv. Schaduweffecten voor het opmerkingengebied, meer logo-opties, locaties van social media-pictogrammen, enz.).
Als je heel veel nieuwe effecten aan Divi wilt toevoegen op de eenvoudigste manier, is Divi Toolbox de omweg waard.
