Stap 1:
Voeg de onderstaande code toe aan functions.php

function odd_or_even($counter) {
    if($counter % 2 == 0) {
        return "even";
    } else {
        return "odd";
    }
}

Stap 2:
Zoek op waar de berichten loop start of maak de loop aan:

if ( have_posts() ) :
while ( have_posts() ) :
the_post();

Stap 3:
Voordat de loop begint, moet het standaard getal worden vastgesteld. Plaats de volgende code boven de loop:

$counter = 0;

Stap 4:
Nadat de loop gestart is, moet het standaard getal per ingeladen post worden opgehoogd om te kunnen bepalen of het een even of een oneven post is. Plaats daarom de volgende code vlak onder de start van de loop:

$counter = $counter + 1;

Stap 5:
Tot zover gebeurd er nog weinig. Er moet worden ingesteld wat er moet gebeuren met de even en oneven uitkomst.

<div class="alternate-<?php echo odd_or_even($counter); ?>">

De even div’s heten vanaf nu: “alternate-even” en de oneven div’s “alternate-odd”. Deze handles kun je gebruiken in de stylesheet om een stijlkeuzes aan te verbinden. Bijvoorbeeld:

.alternate-odd {
  background-color: #ebebeb;
}

.alternate-even {
  background-color: #dcebfa;
}

Voorbeeld

Hele loop + counter

<?php
  $counter = 0;
  
  if ( have_posts() ) :
  while ( have_posts() ) :
  the_post();

  $counter = $counter + 1; ?>

    <div class="alternate-<?php echo odd_or_even($counter); ?>">
      Rij
    </div>

  <?php 
  } else {
    echo "Er zijn geen berichten om te laten zien";
  } 
?>