I use Advanced Custom Fields plugin in my WordPress theme, to use custom fields in the post area.
I want to change the class of a <span> depending on the status of a field, but it isn't working as expected. For instance, when the status is set to new, I want <span class="status">, but with the following code this isn't happening:
<?php
echo "<span ";
if(the_field('status') == "new") {
echo "class=\"status\"";
} else {
echo "class=\"statusSold\"";
}
echo ">";
the_field('status');
echo "</span>";
?>
This is the whole script:
<?php
$args = array(
'posts_per_page' => 9,
);
$the_query = new WP_Query($args);
if ($the_query->have_posts()):
while ($the_query->have_posts()) : $the_query->the_post();
?>
<li>
<a href="<?php the_permalink(); ?>" id="post-<?php the_ID(); ?>">
<span class="hover"> </span>
<?php
$class = the_field('status') == 'new' ? 'status' : 'statusSold';
echo '<span class="' . $class . '">' . the_field('status') . '</span>';
?>
<?php if ( has_post_thumbnail()) the_post_thumbnail('post-thumbnails'); ?>
<span class="title"><?php the_title(); ?></span>
<span class="type"><?php foreach((get_the_category()) as $category) {echo $category->cat_name; } ?></span>
<span class="address"><?php the_field('address'); ?></span>
<span class="prize"><?php the_field('price'); ?></span>
</a>
</li>
<?php
endwhile;
endif;
?>
What must I do to make this work as expected?
I can't really tell what is wrong with your current attempt - but it is messy. Try this instead:
$class = the_field('status') == 'new' ? 'status' : 'statusSold';
echo '<span class="' . $class . '">' . the_field('status') . '</span>';
This should do what you want it to do. Check out this demo. If this doesn't work, then the problem is something else - most likely to do with the_field('status'). If more debugging is necessary. Try simply echoing the_field('status') to confirm that it is returning the appropriate response.
Update
The problem is that your function, the_field(), does not return a value, it simply echos it. Consider this demo to mimic your problem. I'd say the best way to fix this would be to overload the function to return a value. However, Here is a pretty hacky fix that should work for you (Edit: This is probably not the best approach, See update 2 and @LeonardChallis's answer. That is probably the solution you need):
echo '<span style="display:none">';
$class = strcmp(the_field('status'), 'new') ? 'status' : 'statusSold';
echo '</span>';
echo '<span class="' . $class . '">';
the_field('status');
echo '</span>';
Update 2
Or, better yet, use the appropriate function. According to @LeonardChallis, that function is get_field().
Your problem is that the_field() echo's (prints to screen) the content. You should instead use get_field(). This is explained in the basics documentation (see: http://www.advancedcustomfields.com/resources/getting-started/displaying-custom-field-values-in-your-theme/). For more information on get_field(), complete with examples, see http://www.advancedcustomfields.com/resources/functions/get_field/