Question

I think (hope) my question is simpler than how I’ve phrased it, but this is also why I’m coming up empty on Google. It’s similar to this, but I need to handle some HTML with it and am a little unclear: Random image display

In the sidebar of my WordPress install I have two images in this order:

<a href="http://www.link1.tld"><img src="files/image1.jpg" border="0" /></a>
<a href="http://www.link2.tld"><img src="files/image2.jpg" border="0" /></a>

What’s the easiest way to accomplish rotating this order when the page is refreshed (so that the order will be image2 / image1)? And upon next refresh, go back to image1 / image2?

Answer 1

To accomplish this you’ll need to store a view counter in a cookie with the user and then display based on that counter:

session_start();
if(!isset($_SESSION['views'])) {
  $_SESSION['views'] = 0;
}
else {
  $_SESSION['views']++;
}

and then to display:

<?php if($_SESSION['views'] % 2 == 0): ?>
<a href="http://www.link1.tld"><img src="files/image1.jpg" border="0" /></a>
<? endif; ?>
<a href="http://www.link2.tld"><img src="files/image2.jpg" border="0" /></a>
<?php if($_SESSION['views'] % 2 == 1): ?>
<a href="http://www.link1.tld"><img src="files/image1.jpg" border="0" /></a>
<? endif; ?>

If the view counter is even it will print image1 first. If it’s odd it’ll print it second.

Scaling this to more than two images could be done like this:

// map of images to URLs
$images = array(
  'image1.jpg' => 'http://www.link1.tld',
  'image2.jpg' => 'http://www.link2.tld',
  'image3.jpg' => 'http://www.link3.tld',
  'image4.jpg' => 'http://www.link4.tld',
);

// reorder the list of images based on the current view count
$ordered = array_merge(array_slice($images, $_SESSION['views'] % count($images)), array_slice($images, 0, $_SESSION['views'] % count($images)));

and then the display just loops through the ordered list:

<?php foreach($ordered as $image => $url): ?>
<a href="<?php echo $url; ?>"><img src="files/<?php echo $image; ?>" border="0" /></a>
<?php endforeach; ?>