Как я могу извлечь информацию из своего цикла и разделить их отдельно?

Я создал пользовательский тип сообщения, который я пытаюсь реализовать в слайдере CSS. Для этого я создал собственный шаблон и добавил счетчики, чтобы получить уникальный идентификатор для каждого нового сообщения, которое вытащили.

Вот мой текущий цикл:

<div class="gallery autoplay items-3"> <?php $args = array( 'post_type' => 'referanse' ); $referanser = new WP_Query( $args ); if( $referanser->have_posts() ) { $itemcounter = 1; $controlcounter = 1; while( $referanser->have_posts() ) { $referanser->the_post(); ?> <div id="item-<?php echo $itemcounter++; /* echo out $itemcounter */ ?>" class="control-operator"></div> <figure class="item"> <h1><?php the_title() ?></h1> </figure> <div class="controls"> <a href="#item-<?php echo $controlcounter++; /* echo out $controlcounter */ ?>" class="control-button">•</a> </div> <?php } } else { echo 'Ops, ingen referanser enda...'; } ?> </div> 

Однако разметка не такая, как я предполагал, я хочу, чтобы она отображалась следующим образом:

 <div class="gallery autoplay items-3"> <div id="item-1" class="control-operator"></div> <div id="item-2" class="control-operator"></div> <div id="item-3" class="control-operator"></div> <figure class="item"> <h1>Item 1</h1> </figure> <figure class="item"> <h1>Item 2</h1> </figure> <figure class="item"> <h1>Item 3</h1> </figure> <div class="controls"> <a href="#item-1" class="control-button">•</a> <a href="#item-2" class="control-button">•</a> <a href="#item-3" class="control-button">•</a> </div> </div> 

Но вместо этого я получаю следующее:

 <div class="gallery autoplay items-3"> <div id="item-1" class="control-operator"></div> <figure class="item"> <h1>Item 1</h1> </figure> <div class="controls"> <a href="#item-1" class="control-button">•</a> </div> <div id="item-2" class="control-operator"></div> <figure class="item"> <h1>Item 2</h1> </figure> <div class="controls"> <a href="#item-2" class="control-button">•</a> </div> <div id="item-3" class="control-operator"></div> <figure class="item"> <h1>Item 3</h1> </figure> <div class="controls"> <a href="#item-3" class="control-button">•</a> </div> </div> 

Итак, в основном, я спрашиваю, как я могу исправить цикл, чтобы он сначала отображал div .control-operator, чем фактические сообщения и, наконец, кнопки управления?

Майкл

Вы не помещаете элементы управления в цикл while, а затем каждый раз приходят туда. Таким образом, вы можете использовать цикл for и переменную found_posts для цикла через элементы до и после цикла while.

Пример ниже.

 <div class="gallery autoplay items-3"> <?php $args = array( 'post_type' => 'referanse' ); $referanser = new WP_Query( $args ); ?> <?php if( $referanser->have_posts() ) : ?> <?php for($i=1; $i<=$referanser->found_posts; $i++) : ?> <div id="item-<?php echo $i; ?>" class="control-operator"></div> <?php endfor; ?> <?php while( $referanser->have_posts() ) : $referanser->the_post(); ?> <figure class="item"> <h1><?php the_title() ?></h1> </figure> <?php endwhile; ?> <div class="controls"> <?php for($i=1; $i<=$referanser->found_posts; $i++) : ?> <a href="#item-<?php echo $i; ?>" class="control-button">•</a> <?php endfor; ?> </div> <?php else : ?> Ops, ingen referanser enda... <?php endif; ?> </div>