Home/ Questions/Q 4573900
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-21T19:50:58+00:00

In PHP (wordpress), I understand how to make a basic loop- however I’m not

  • 0

In PHP (wordpress), I understand how to make a basic loop- however I’m not so sure how to make a single query and output that into 2 seperate areas like below:

<div class="slides_container"> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-3-2x.jpg" width="366" alt="1144953 3 2x"></a> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-1-2x.jpg" width="366" alt="1144953 1 2x"></a> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-2-2x.jpg" width="366" alt="1144953 2 2x"></a>                 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-4-2x.jpg" width="366" alt="1144953 4 2x"></a> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-5-2x.jpg" width="366" alt="1144953 5 2x"></a> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-6-2x.jpg" width="366" alt="1144953 6 2x"></a> 
                <a href="http://www.zappos.com/pro-keds-royal-plus-lo-grey" target="_blank"><img src="img/1144953-p-2x.jpg" width="366" alt="1144953 P 2x"></a> 
            </div> 
            <ul class="pagination"> 
                <li><a href="#"><img src="img/1144953-3-2x.jpg" width="55" alt="1144953 3 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-1-2x.jpg" width="55" alt="1144953 1 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-2-2x.jpg" width="55" alt="1144953 2 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-4-2x.jpg" width="55" alt="1144953 4 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-5-2x.jpg" width="55" alt="1144953 5 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-6-2x.jpg" width="55" alt="1144953 6 2x"></a></li> 
                <li><a href="#"><img src="img/1144953-p-2x.jpg" width="55" alt="1144953 P 2x"></a></li> 
            </ul> 
        </div>

Basically I need to understand how to make the 2 content areas “match up”, so if I were to run a random query, the #3 Anchor would match the #3 Li inside the UL. Do I need to run a “forEach”?

This is for a jQuery slider, so the List elements are simply navigation thumbnails for the main piece.

Anyone have a clue?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’m making some assumptions here – but basically you could use a foreach loop twice – the first time populating the initial HTML “a” links, and a second loop to populate the li.

    For example – if your array is called items and it contained 4 key-value pairs for each element, you’d do something like this:

    <div class="slides_container"> 
<?php
foreach ($items as $i) {
    ?>
    <a href="http://www.zappos.com/{$i['url_slug']}" target="_blank"><img src="img/{$i['img_name']}" width="366" alt="{$i['alt_text']}"></a>
    <?php
}
?>
</div> 
<ul class="pagination">
<?php
foreach ($items as $i) {
?>
    <li><a href="#"><img src="img/{$i['img_name']}" width="55" alt="{$i['alt_text']}"></a></li> 
    <?php
 }
 ?>
 </ul> 
 </div>
    • 0