Hoe pas je de kleur van opsommingstekens in Divi aan?

Dit is een snelle tip, welke ik zelf regelmatig gebruik! Om de kleur van opsommingstekens in een Divi tekst module aan te passen gebruik ik een klein beetje CSS code.

Je kunt wel de tekstkleur van je opsomming wijzigen en ook de style. Bijvoorbeeld in plaats van een rondje een vierkant. Alleen er is geen optie om de kleur van opsommingstekens aan te passen. Door een CSS-klasse toe te voegen en een regeltje CSS-code kun je dit eenvoudig voor elkaar krijgen. Volg onderstaande stappen.

1. CSS-klasse toevoegen aan de tekst module

De eerste stap is om een CSS-klasse toe te voegen aan de tekst module, zodat de code geen invloed heeft op andere modules. Ga naar Tekst-instellingen > Geavanceerd > CSS-id en -klasses > en voeg de klasse dvp-bullet-color toe aan het veld onder CSS Klasse.
– Voeg toe dvp-bullet-color

2. CSS-code toevoegen om de kleur van opsommingstekens te wijzigen

Ga naar je WordPress Dashboard > Divi > Thema-opties > Aangepaste CSS en voeg de volgende CSS-code toe:

.dvp-bullet-color ::marker {
color: #ff7b2b;
}

Met bovenstaande code verander je de kleur van het opsommingsteken. Pas de hex code #ff7b2b aan in de jouw gewenste kleur. Wanneer je deze CSS-code toevoegt onder Divi > Thema-opties > Aangepaste CSS dan wordt op alle webpagina’s waar je opsommingstekens gebruikt je gewenste kleur aangepast.

Tip! Kleur opsommingstekens aanpassen op specifieke webpagina

Wanneer je een tekst met opsommingstekens specifiek op een bepaalde wilt aanpassen.

Extra info: Bij alle extra CSS code en CSS klasses in mijn artikelen schrijf ik in het Engels. De reden is dat de programma talen ook worden geschreven in het Engels en de termen zijn meestal korter dan in het Nederlands.

Niels

Niels

Niels is webbouwer en -designer en groot fan van het Divi-thema. Sinds 2010 bouwt, beheert en host hij WordPress websites voor ondernemers en zelfstandigen.

Wanneer je vragen en/of opmerkingen hebt, laat het mij weten!

0 reacties

Een reactie versturen

Je e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

De laatste blogposts