0

最新の 4 つの投稿をプルする WP_Query ループがあります。

    <?php
    $featuredPosts = new WP_Query();
    $featuredPosts->query('showposts=4');
    while ($featuredPosts->have_posts()) : $featuredPosts->the_post(); ?>
    <div class="recentpost">

    <?php echo get_the_post_thumbnail ($_post->ID, 'small'); ?>

    <div class="titlerecent">
    <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
    </div>

    </div>
    <?php endwhile; ?>

私がやりたいのは、これを変更して、ループ内の最初の投稿を異なるスタイルにすることです。CSS クラスを追加したいだけでなく、まったく別の .xml でラップしたいのです<div>。

したがって、最初の投稿をラップし<div class="homefirstpost">てから、残りの 3 つの投稿を上記のように<div class="recentpost">.

私は何をする必要がありますか？

4

2 に答える 2

1

私は次のようにします：

<?php
$isfirst = false;

$featuredPosts = new WP_Query();
$featuredPosts->query('showposts=4');
while ($featuredPosts->have_posts()) : $featuredPosts->the_post(); ?>

    <?php if ( ! $isfirst ): ?>
    <div class="homefirstpost">
        <?php $isfirst = true; ?>
    <?php else: ?>
    <div class="recentpost">
    <?php endif; ?>

    <?php echo get_the_post_thumbnail ($_post->ID, 'small'); ?>

    <div class="titlerecent">
    <h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
</div>
<?php endwhile; ?>
于 2012-11-22T11:55:25.033 に答える
0

:first-child投稿が別のコンテナーにラップされている場合、最初の投稿にセレクターを使用できます。詳細については、セレクターを参照してください。

HTML が次のようになっている場合:

<div id="featuredPosts">
    <div>First Post ...</div>
    <div>Next Post ...</div>
    <div>Next Post ...</div>
    <div>Next Post ...</div>
</div>

次の行に沿って CSS を使用できます。

div#featuredPosts > div:first-child {
some special styles;
}
于 2012-11-22T11:53:20.087 に答える