提问者:小点点

Wordpress将每2篇文章包装在一个div中


我现在正试图将每2篇文章包装在一个div“row fluid”中,我的HTML如下所示。。。

 <div class="row-fluid">
   <div class="odd-post span6"></div>
   <div class="even-post span6"></div>
   <div class="odd-post span6"></div>
   <div class="even-post span6"></div>
 </div>  

我希望它看起来像这样。。。

 <div class="row-fluid">
   <div class="odd-post span6"></div>
   <div class="even-post span6"></div>
 </div>
 <div class="row-fluid">
   <div class="odd-post span6"></div>
   <div class="even-post span6"></div>
 </div> 

这是我用来生成它的php,但我认为,因为我在循环之外计数,所以它也没有以我希望的方式呈现。

                <?php
                    $count = 0;
                    if(have_posts()) : while(have_posts()) : the_post();
                        $open = !($count%2) ? '<div class="row-fluid">' : '';
                        $close = !($count%2) && $count ? '</div>' : '';
                    echo $close.$open;
                ?>


                <!--Custom Post Type Boilerplate-->
                <?php

                $args = array( 'post_type' => 'mysite_team', 'posts_per_page' => 10 );
                $loop = new WP_Query( $args );
                while ( $loop->have_posts() ) : $loop->the_post();

                    echo '<div ';
                        $even_odd = (++$j % 2 == 0) ? 'featured-image-wrapper-even-post span6' : 'featured-image-wrapper-odd-post span6'; post_class( $even_odd );
                    echo '>';

                    echo '<h1>';
                    echo '<a href="';
                        the_permalink();
                    echo '">';
                        the_title();
                    echo '</a></h1>';


                    echo '<div class="featured-image alignleft">';
                    echo '<a href="';
                        the_permalink();
                    echo '">';
                        the_post_thumbnail('team-thumbnail-size');
                    echo '</a>';
                    echo '</div>';


                    echo '<div class="entry-content">';
                        the_excerpt();
                    echo '<p><a href="';
                        the_permalink();
                    echo '"><i>Read More';
                    echo '</i></a></p>';
                    echo '</div>';

                    echo '</div>';

                endwhile;

                ?>

                <?php
                    $count++;
                    endwhile;
                    else :
                ?>
                <?php endif; ?>
                <?php echo $count ? '</div>' : ''; ?>

任何帮助都将不胜感激,因为我开始看到圆圈并感到困惑。非常感谢。


共1个答案

匿名用户

对不起,我会避免使用额外的div容器。你可以用纯CSS解决这个问题。

.row-fluid:nth-child(odd) {
// Some code
}
.row-fluid:nth-child(even) {
// Some code
}
.span6 {
width:50%;
display:inline-cell;
float: left;
}