Probleem:
Sinds een aantal weken valt het mij op dat als ik meerdere genummerde lijsten in een blog gebruik, deze niet opnieuw beginnen bij 1. Met genummerde lijsten bedoel ik de lijsten die met ol en li tags worden gemaakt in HTML code. Dit heeft in het verleden juist gewerkt.
Oplossing:
Na het analyseren van de HTML en de CSS valt het mij op dat het Phlox thema dat ik gebruik CSS styling bevat die voorkomt dat er opnieuw begonnen wordt met nummeren.
De volgende CSS in het bestand base.css van Phlox is hiervoor verantwoordelijk:
ol {
counter-reset: item;
}
In mijn child theme heb ik onderstaande CSS code toegevoegd aan style.css:
ol {
counter-reset: revert;
}
Deze overschrijft de CSS code van het Phlox thema waardoor het probleem opgelost is. Vergeet niet de cache te legen als je bijvoorbeeld WP Rocket gebruikt.
> Bekijk meer blogs over Phlox
De property counter-reset maakt het mogelijk om een teller toe te voegen aan een lijst van items. Deze kan oplopen, gerest worden of je kan ook getallen overslaan. De lijst van items hoeft niet specifiek een <ol> lijst te zijn.
Heb je een pagina met meerdere <h2> tags? Dan kan je deze automatisch voorzien van een oplopend getal. Zo hoef je deze niet op te nemen in de titel.
Oplossing getest op:
WordPress 5.6.0 met Phlox 2.7.2