Save Preloader image

0%

Select Page

Het stijlen van code met Divi

MALDEN (Nederland) – Het toevoegen van statische codering of HTML kan belangrijk zijn voor je WordPress website. Soms wil je een extra module toevoegen die niet in je page builder aanwezig is. Vanzelfsprekend kan de ‘code’ module van Divi je daarbij helpen. Maar hoe zorg je dat je de code kunt stijlen met Divi? Daar gaan we het over hebben in de blog van deze week.

Het stijlen van code met Divi: de code module

De code module in Divi is een fijne en belangrijke extra functie waar de meeste page builders voor hebben gezorgd. Deze module kun je bijvoorbeeld gebruiken om shortcodes van een bepaalde plug-in in te voegen. Toch is het nadeel dat in de meeste page builders het stijlen van de code onmogelijk is. Dat betekent in de praktijk dat je lettertypen niet hetzelfde is als je content in de rest van de WordPress website.

Het stijlen van code met Divi: de tekst module

Gek genoeg is de tekst module in Divi een oplossing voor het stijlen van code. Laten we eens bekijken hoe we dat doen: ga eerst naar de dashboard van je WordPress website. Daar kopieer (Ctrl +C) je de shortcode van de plug-in die je wil hebben. Wij nemen als voorbeeld even de WordPress plug-in Contact Form 7

Vervolgens ga je naar jou Divi pagina door te klikken op pagina’s > alle pagina’s. Druk op bouw aan de voorkant. Voeg daar de tekst module toe binnen je sectie en rij. In het menu dat verschijnt zie je dat je tekst kan toevoegen. Het stijlen van code met Divi begint door te drukken op de tekst tab in plaats van de visueel tab bij het schrijven van de tekst. Kopieer vervolgens je shortcode, en je kunt de tekst aanpassen!

Het stijlen van de knop

Het stijlen van de knop is in dit geval helaas niet mogelijk. Toch is ook daar vaak ook een oplossing voor te vinden. In het geval van Contact Form 7 zou je bijvoorbeeld de plug-in CF7 Styler for Divi kunnen gebruiken.

Mocht je nog vragen hebben; je kan altijd contact met ons opnemen door hieronder een reactie te verzenden. Abonneer je op ons YouTube kanaal om filmpjes te bekijken die over deze onderwerpen gaan.

Hartelijke groet,

SMLFwebdesign.

 

Het stijlen van code met Divi

MALDEN (Nederland) – Het toevoegen van statische codering of HTML kan belangrijk zijn voor je WordPress website. Soms wil je een extra module toevoegen die niet in je page builder aanwezig is. Vanzelfsprekend kan de ‘code’ module van Divi je daarbij helpen. Maar hoe zorg je dat je de code kunt stijlen met Divi? Daar gaan we het over hebben in de blog van deze week.

Het stijlen van code met Divi: de code module

De code module in Divi is een fijne en belangrijke extra functie waar de meeste page builders voor hebben gezorgd. Deze module kun je bijvoorbeeld gebruiken om shortcodes van een bepaalde plug-in in te voegen. Toch is het nadeel dat in de meeste page builders het stijlen van de code onmogelijk is. Dat betekent in de praktijk dat je lettertypen niet hetzelfde is als je content in de rest van de WordPress website.

Het stijlen van code met Divi: de tekst module

Gek genoeg is de tekst module in Divi een oplossing voor het stijlen van code. Laten we eens bekijken hoe we dat doen: ga eerst naar de dashboard van je WordPress website. Daar kopieer (Ctrl +C) je de shortcode van de plug-in die je wil hebben. Wij nemen als voorbeeld even de WordPress plug-in Contact Form 7

Vervolgens ga je naar jou Divi pagina door te klikken op pagina’s > alle pagina’s. Druk op bouw aan de voorkant. Voeg daar de tekst module toe binnen je sectie en rij. In het menu dat verschijnt zie je dat je tekst kan toevoegen. Het stijlen van code met Divi begint door te drukken op de tekst tab in plaats van de visueel tab bij het schrijven van de tekst. Kopieer vervolgens je shortcode, en je kunt de tekst aanpassen!

Het stijlen van de knop

Het stijlen van de knop is in dit geval helaas niet mogelijk. Toch is ook daar vaak ook een oplossing voor te vinden. In het geval van Contact Form 7 zou je bijvoorbeeld de plug-in CF7 Styler for Divi kunnen gebruiken.

Mocht je nog vragen hebben; je kan altijd contact met ons opnemen door hieronder een reactie te verzenden. Abonneer je op ons YouTube kanaal om filmpjes te bekijken die over deze onderwerpen gaan.

Hartelijke groet,

SMLFwebdesign.

 

Pin It on Pinterest

Deel dit met je vrienden!