Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have created an options page in my WordPress theme that allows the user to input a url/upload an image to an input field. The field has the name headerimage_options[image] and when it is populated it can be saved and outputted in the theme with the following code: <?php echo esc_url( $headerimage_options['image'] ); ?>

I have created three inputs with the names [image], [image2] and [image3]. I can save the content of the input fields and output all of the images using the code below:

<?php $headerimage_options = get_option( 'headerimage_options' ); ?>

    <img title="<?php bloginfo( 'name' ); ?>" src="<?php echo esc_url( $headerimage_options['image'] ); ?>"/>

    <img title="<?php bloginfo( 'name' ); ?>" src="<?php echo esc_url( $headerimage_options['image2'] ); ?>"/>

    <img title="<?php bloginfo( 'name' ); ?>" src="<?php echo esc_url( $headerimage_options['image3'] ); ?>"/>

My question is how do I output just one of the images at random? I've searched but couldn't find an answer anywhere.

share|improve this question

3 Answers 3

up vote 0 down vote accepted

Instead of echoing out these images, just store them as strings inside an array and choose one of the array items at random.

<?php $headerimage_options = get_option('headerimage_options' ); 
$images = array();
$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image'] ).'"/>';

$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image2'] ).'"/>';

$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image3'] ).'"/>';

$v = array_rand($images);
echo $images[$v];
share|improve this answer
    
Thanks! Both of these work. –  Ciaran Gaffey Apr 26 '13 at 15:39
    
@SharciaraniaAkbarAl-Gaadaafi You're welcome. Please show your thanks by voting up answers and/or choosing one of them as correct ;) –  GhostToast Apr 26 '13 at 16:13

You could do it this way (assumes that you know that all 3 images are there every time):

<?php
    $headerimage_options = get_option( 'headerimage_options' ); 
    $number = rand(1,3);
    if($number == 1) $number = ''; 
?>
        <img title="<?php bloginfo( 'name' ); ?>" src="<?php echo esc_url( $headerimage_options['image' . $number] ); ?>"/>
share|improve this answer

Thanks to both of you. From this i figured out how to make them display only the images that had something actually in the input fields. So no broken image or empty div if the input field is empty. I used the following code:

<?php $headerimage_options = get_option('headerimage_options' ); 
$images = array();

if ( "" != $headerimage_options['image'] ) :

$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image'] ).'"/>';

endif; 

if ( "" != $headerimage_options['image2'] ) :

$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image2'] ).'"/>';

endif; 

if ( "" != $headerimage_options['image3'] ) :

$images[] = '<img title="'.get_bloginfo('name').'" src="'.esc_url( $headerimage_options['image3'] ).'"/>';

endif; 

$v = array_rand($images);
echo $images[$v];

?>

Thanks again.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.