O Repeater Field do ACF é uma ferramenta poderosa. Permité aos clientes adicionar qualquer número de elementos (ex: “Nossos Parceiros”, “Agenda”, “Ingredientes”) sem ter de criar posts separados.
Mas como exibir e estilizar isto?
Loop básico
<?php if( have_rows('meu_repeater') ): ?>
<ul class="slides">
<?php while( have_rows('meu_repeater') ): the_row();
$image = get_sub_field('imagem');
$content = get_sub_field('texto');
?>
<li class="slide">
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<p><?php echo $content; ?></p>
</li>
<?php endwhile; ?>
</ul>
<?php endif; ?>Desafio: “Zebra” (cada segundo elemento diferente)
Os designers frequentemente querem, por exemplo, que cada segundo bloco tenha um fundo escuro. Como fazer isso num loop?
Usa uma variável de contador ($i) é o operador módulo (%).
<?php if( have_rows('seccoes') ):
$i = 0; // Inicializar contador
?>
<div class="sections-container">
<?php while( have_rows('seccoes') ): the_row();
$i++; // Incrementar contador
// Verificar se é par
$classe = ($i % 2 == 0) ? 'bg-dark' : 'bg-light';
?>
<div class="row <?php echo $classe; ?>">
<!-- Conteúdo da secção -->
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>CSS nth-child (alternativa)
Em 2026, é frequentemente melhor fazer isto em CSS, sé as diferenças forem puramente visuais:
.row:nth-child(even) {
background-color: #333;
color: #fff;
}Usa a solução PHP apenas quando a paridadé afeta a estrutura HTML ou os recursos carregados.
Exploré os nossos desenvolvimento profissional WordPress para levar o seu projeto mais longe.
