Not sure if this is possible, but what Id like to do is have the ability to output/add a class to an anchor tag depending on what tag I choose when creating the post.

My reasoning behind this is to be able to call up different background images via CSS depending on the tag that will be chosen for each specific post.

Here is an example of what Im ive got going already... What Im essentially doing here is showing a featured image from the post and then on hover, a jquery script is called to reveal the anchor tag over the image which contains the background image that Id like to dynamically change depending on the tag chosen.

<ul class="product_list_sm">    

<?php $epr_acces = new WP_Query(array('post_type' => 'product', 'productcategory' => 'epr-accessories', 'posts_per_page' => 6, 'orderby' => 'rand', 'paged' => $paged )); ?>
<?php while ($epr_acces->have_posts() ) : $epr_acces->the_post(); ?>

<a href="<?php the_permalink(); ?>" title="View Item" class="product_view_sm">..View Item..</a>
<?php the_post_thumbnail('prod-img-sm', array('class' => 'single_product_img_sm', 'alt' => 'View Product')); ?>

<?php endwhile; ?>
<?php wp_reset_query(); ?>

</ul><!-- .product_list_sm -->

Sounds like you'd want to use this: http://codex.wordpress.org/Function_Reference/wp_get_object_terms

If you're using a custom taxonomy, add that where it says "post_tag".

foreach(wp_get_object_terms($post->ID, 'post_tag') as $tag) :
    $tags .= ' ' . $tag->name;

And then add it to your anchor tag:

<a href="<?php the_permalink(); ?>" title="View Item" class="product_view_sm<?php echo $tags; ?>">..View Item..</a>
  • Hmm...I will have to try this tomorrow morning, thank you for the response! – Mr.Brown Dec 17 '11 at 4:46
  • Is there any way to use actual tags rather than a custom taxonomy though? Id like to reserve those for my product categories. – Mr.Brown Dec 17 '11 at 4:50
  • This will work with the default tags and custom taxonomies — which is a bit more future proof. For the default tags, use 'post_tag'. – CookiesForDevo Dec 17 '11 at 11:11
  • Thanks for the help, this worked great and I like the flexibility of using both tags & custom taxonomies. – Mr.Brown Dec 19 '11 at 0:44
  • One question: Is it possible to amend this piece of code to allow the use of the tags "slug" rather than the tag name itself? – Mr.Brown Dec 19 '11 at 1:51

I am assuming that you would assign a single tag to a post as this deals with background image. In that case you could try the following.

    $tags = get_the_tags( get_the_ID() );
    $tag_class = false;

    if( is_array( $tags ) ) {
        $tags = array_values( $tags );
        $tag_class = ' '.$tags[0]->slug;
<a href="<?php the_permalink(); ?>" title="View Item" class="product_view_sm<?php echo ( $tag_class ) ? $tag_class : ''; ?>">..View Item..</a>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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