How to add a “active” class to a carousel first element

问题

I'm developing a News website in Wordpress, and I need to show in a bootstrap carousel the first three posts, my problem is that I need to add the "active" class only at the first of the three elements, but really don't know how to. Here's my code:

<?php
$args = array('numberposts' => '3');
$recent_posts = wp_get_recent_posts($args);
foreach ($recent_posts as $recent) {
echo '<div class="item active"><a href="' . get_permalink($recent["ID"]) . '" title=" ' . esc_attr($recent["post_title"]) . '" >' .$recent["post_date"] . ': <strong>' .$recent["post_title"] . '</strong></a></div>';
}
?>

I've already tried a answer found on this site (this one):

$isFirst = true;
foreach ($recent_posts as $recent) {
echo '<div class="item' . $isFirst ? ' active' : '' . '"><a href="' . get_permalink($recent["ID"]) . '" title=" ' . esc_attr($recent["post_title"]) . '" >' .$recent["post_date"] . ": <strong>"  .$recent["post_title"] . '</strong></a></div>';
$isFirst = false;
?>

but it just printed me the "active" words.

Thanks for your help

回答1:

You need to set $i so that you can count how many times you have gone through the loop and do some logic with it, like in my example below. Instead of having two lines of code that are nearly identical like I have done below though, you should be able to do the if conditional right around the class active. I didn't do that so you could clearly see the conditional and the count of the loops through the array.

<?php
$args = array('numberposts' => '3');
$recent_posts = wp_get_recent_posts($args);
$i = 0;
foreach ($recent_posts as $recent) {

if ($i == 0) {
    echo '<div class="item active"><a href="' . get_permalink($recent["ID"]) . '" title=" ' . esc_attr($recent["post_title"]) . '" >' .$recent["post_date"] . ': <strong>' .$recent["post_title"] . '</strong></a></div>';
} else {
    echo '<div class="item"><a href="' . get_permalink($recent["ID"]) . '" title=" ' . esc_attr($recent["post_title"]) . '" >' .$recent["post_date"] . ': <strong>' .$recent["post_title"] . '</strong></a></div>';
}
$i++;
}
?>

来源：https://stackoverflow.com/questions/39960163/how-to-add-a-active-class-to-a-carousel-first-element

标签

php

wordpress

twitter-bootstrap

carousel