De code module

Dat de code module op zijn tijd best van pas kan komen wist ik al een tijdje. Deze module heeft mij namelijk een berg kopzorgen weggenomen. De code van een footer en sectieverdeler die ik voor een klant had gemaakt verdween namelijk bij iedere update als sneeuw voor de zon, en ik had geen idee waarom (en nog steeds niet). Toen ik de code echter in een code module plakte, in plaats van in een tekstmodule, bleek het probleem te zijn opgelost. Sindsdien heb ik er geen omkijken meer naar. Deze week kwam ik nog een andere toepassing tegen waarvoor de code module gebruikt kan worden: het maken van image overlays.

Image overlays

De veelgeprezen Geno Quiroz leerde mij deze week dat er nog meer mooie dingen kunnen worden gemaakt in de code module. Hij maakte met CSS en html zes varianten van image overlays, en beschreef op zijn blog Learning Divi hoe je ze kan toepassen op je eigen Divi website. Omdat voor de overlays alleen CSS en html is gebruikt, hoeven we niet te rommelen in de php bestanden. De kleuren van de overlays zijn eenvoudig aan te passen en de grootte van de afbeelding is niet gebonden aan een specifiek formaat. Daarnaast past de code in een door jou gekozen kolomgrootte en zien de overlays er ook nog eens prima uit op mobiele telefoons en tablets.

Ik heb alle zes de varianten uitgeprobeerd en je kunt ze hieronder bekijken. De code vind je in het artikel in het artikel ‘Easy Image Overlays Using The Divi Code Module‘. Het kost slechts een kwartiertje van je tijd om de code op de juiste plekken te plakken. Het resultaat mag er zijn. Veel succes!