Wordpress在div中包含每2个帖子

时间:2013-03-14 19:40:16

标签: php html wordpress twitter-bootstrap

我正在尝试将div中的每2个帖子包装成“行 - 流”现在我的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 个答案:

答案 0 :(得分:0)

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

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