在行中而不是在列中显示帖子拇指

时间：2012-02-23 作者：Allen

我使用以下代码在索引页上只显示拇指和标题；

 <div id="column1">
    <?php query_posts(\'cat=22&showposts=2\'); ?>
<?php $posts = get_posts(\'cat=22&numberposts=2&offset=0\'); foreach ($posts as $post) : start_wp(); ?>
<?php static $count1 = 0; if ($count1 == "2") { break; } else { ?>
<a href="<?php the_permalink() ?>" rel="<?php _e("bookmark", "solostream"); ?>" title="<?php _e("Permanent Link to", "solostream"); ?> <?php the_title(); ?>"><?php the_post_thumbnail( \'homepage-thumb\' ); ?></a>
<br><a style="color:#666;"><?php the_title(); ?></a><br>
<a style="color:#1C477E;"><?php the_field(\'price\'); ?></a>
<div style="clear:both;"></div>
<?php $count1++; } ?>
<?php endforeach; ?>
</div>

    <div id="column2">
        <?php query_posts(\'cat=22&showposts=2\'); ?>
<?php $posts = get_posts(\'cat=22&numberposts=2&offset=2\'); foreach ($posts as $post) : start_wp(); ?>
<?php static $count2 = 0; if ($count2 == "2") { break; } else { ?>
<a href="<?php the_permalink() ?>" rel="<?php _e("bookmark", "solostream"); ?>" title="<?php _e("Permanent Link to", "solostream"); ?> <?php the_title(); ?>"><?php the_post_thumbnail( \'homepage-thumb\' ); ?></a>
<br><a style="color:#666;"><?php the_title(); ?></a><br>
<a style="color:#1C477E;"><?php the_field(\'price\'); ?></a>
<div style="clear:both;"></div>
<?php $count2++; } ?>
<?php endforeach; ?>
    </div>
当某个类别中的帖子少于或多于一列中描述的帖子数量时，就会出现问题。如果帖子较少，其他列仍为空，因此看起来很奇怪。我想以行而不是列的形式显示它们，这样帖子的数量就不会影响类别页面。

2 个回复
最合适的回答,由SO网友:Neil Davidson 整理而成

据我所知，控制列和/或行布局的最简单方法是使用模数。我在教程中对此进行了分解，并在我的示例中与wordpress一起使用。

Wordpress and PHP Modulus

第一个示例是基本示例，而第二个示例则更高级一些，它利用了post图像/附件。如果这有助于让我知道或为我提供页面a+1：-）

SO网友:helgatheviking

如果我理解正确，下面将获得帖子并将其放入行中，每行3个帖子。可以通过调整$columns变量来调整行。你也可以调整CSS以适应，这只是为了让帖子浮动和可见，因为我没有很多拇指来测试。

<style>
#test, .row{overflow: hidden; margin-bottom: 22px;}
.post {float: left; width: 150px; height: 150px; margin-right:20px; background: pink;}
.post.last {margin-right: 0;}
.post img {max-width: 100%;}
</style>

<div id="test">

    <?php 
    global $post;
    $tmp_post = $post;

    $columns = 3; //number of posts per row

    $args = array( \'cat\'=>22,
            \'numberposts\' => 9 );

    $count = 1;

    $posts = get_posts($args); if($posts): ?>

    <div class="row">

        <?php 

        foreach ($posts as $post) : setup_postdata($post); 


        $class = ( $count%$columns == 0 ) ? \'last\' : \'\'; ?>

        <div class="post">
            <a href="<?php the_permalink() ?>" rel="<?php _e("bookmark", "solostream"); ?>" title="<?php _e("Permanent Link to", "solostream"); ?> <?php the_title(); ?>"><?php the_post_thumbnail( \'homepage-thumb\' ); ?>
            <br/><?php the_title(); ?><br/>
            <?php if(function_exists(\'the_field\')) the_field(\'price\'); ?>
            </a>
        </div><!--.post-->

        <?php 
        if ( $count%$columns == 0 ) { ?>
            </div><!--.row-->
            <?php if ($count < count($posts)) : ?> <div class="row"> <?php endif; ?> 
        <?php }


        $count++;  
        endforeach; ?>
    </div><!--.row-->

<?php endif;
$post = $tmp_post;
?>

</div><!--#test-->

结束
标签： get-row   小码农  

相关推荐