如果其他特定类别 post wordpress

Question

我正在尝试制作一个 if else 脚本，但无法正确完成。我想要一个 post，缩略图在左，文字在右，当我在类别中制作另一个 post 时，我想要缩略图在右，文字在左。

到目前为止，这是我的代码：

<div class="row">

        <?php if (query_posts('category_name=news'))
            if (have_posts()) : while (have_posts()) : the_post(); ?>
                <div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
                    <?php
                    if ($wp_query->current_post % 2) {
                        echo "<div class='image-test'>";
                        the_post_thumbnail('thumbnail');
                        echo "</div>";
                        echo "<div class='tekst-rechts'>";
                        the_title('<h2 class="entry-title"><a href="' . esc_url(get_permalink()) . '" rel="bookmark">', '</a></h2>');
                        the_content();
                        echo "</div>";
                    }
                    ?>
                </div>

            <?php endwhile; ?>

        <?php else : ?>

            <div <?php post_class(); ?> id="post-<?php the_ID(); ?>">
                <?php
                //echo "Current item is ". (($wp_query->current_post % 2) ? "oneven" : "even");
                //the_title( '<h1 class="entry-title">', '</h1>' );
                the_title('<h2 class="entry-title"><a href="' . esc_url(get_permalink()) . '" rel="bookmark">', '</a></h2>');
                the_post_thumbnail('');
                the_content();
                ?>
            </div>

        <?php endif; ?>

        <?php wp_reset_query(); // reset the query 
        ?>
    </div>

Answer 1

您只需使用 CSS Flex, Order and :nth-child() 选择器即可。

HTML（包含php）：

    <div class="row">

        <?php if (query_posts('category_name=news'))
            if (have_posts()) : while (have_posts()) : the_post(); ?>
                <div <?php post_class('post-contents'); ?> id="post-<?php the_ID(); ?>">
                    <?php
                        echo "<div class='image-test'>";
                        the_post_thumbnail('thumbnail');
                        echo "</div>";
                        echo "<div class='tekst-rechts'>";
                        the_title('<h2 class="entry-title"><a href="' . esc_url(get_permalink()) . '" rel="bookmark">', '</a></h2>');
                        the_content();
                        echo "</div>";
                    ?>
                </div>

            <?php endwhile; ?>

        <?php else : ?>

            <p>No posts!</p>

        <?php endif; ?>

        <?php wp_reset_query(); // reset the query ?>
    </div>

---

CSS:

    .post-contents {
      display:flex;
      flex-flow: row wrap;
      justify-content: space-between;
      align-items: center;
    }

    .post-contents:nth-child(odd) .image-test {
      order: 2;
    }

    .post-contens:nth-child(odd) .entry-title {
      order: 1;
    }

---

不要忘记在post_class()函数中添加post-内容class。