Question

I asked a question previously – HERE – about how I could set my border-color to a random color. I have this working.

As you’ll see, I have a possible 7 colors in my array. How can I edit my code so that once a color has been chosen, it won’t be reused. There are 3 divs on my page that the color will be used on, so I’d like 3 different colors from the possible 7.

Full code of how I’m using it:

<div id="featured-posts" class="container_12">
<?php
 global $post;
 $myposts = get_posts('numberposts=3&category=12');
 foreach($myposts as $post) :
 ?>

 <?php global $post; ?>
    <?php
    $src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 5600,1000 ), false, '' );
    ?>

        <?php
            $colors = array("#000000", "#949c51", "#571c1e", "#f36533", "#782a80", "#f6a41d", "#ed1b24");
            $randomColor = $colors[array_rand($colors)];
        ?>

<a href="<?php the_permalink(); ?>">
<div class="grid_4 featured-home" style="background: url(<?php echo $src[0]; ?> ) !important;">
    <div class="featured-details" style="border-color: <?php echo $randomColor; ?>;">   
        <h4 style="color: <?php echo $randomColor; ?>;"><?php the_title(); ?></h4>
        <p><?php the_excerpt(); ?>  <q style="color: <?php echo $randomColor; ?>; font-weight:bold !important;">Read more &gt;</q></p>
    </div>
    <div class="featured-lower" style="border-color: <?php echo $randomColor; ?>;"></div>
</div></a>
 <?php endforeach; ?>
 </div>

Answer 1

You could shuffle and then pop the last element off the array each time:

Define your colours array once (this would need to be removed from your loop):

$colors = array("#000000", "#949c51", "#571c1e", "#f36533", "#782a80", "#f6a41d", "#ed1b24");

Then each time you use randomColor you shuffle it and remove the last element of the array to use:

shuffle($colors);
$randomColor = array_pop($colors);