If else 特定类别发布 wordpress

Question

我正在尝试制作 if else 脚本，但无法正确处理。我想要一个带有左侧缩略图和右侧文本的帖子，当我在该类别中发布另一个帖子时，我想要右侧缩略图和左侧文本。到目前为止，这是我的代码：<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和: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-contents 类。