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&nbsp;Flex、Order和:nth-child()选择器来做到这一点。HTML（包含 php）：&nbsp; &nbsp; <div class="row">&nbsp; &nbsp; &nbsp; &nbsp; <?php if (query_posts('category_name=news'))&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (have_posts()) : while (have_posts()) : the_post(); ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div <?php post_class('post-contents'); ?> id="post-<?php the_ID(); ?>">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <?php&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; echo "<div class='image-test'>";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; the_post_thumbnail('thumbnail');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; echo "</div>";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; echo "<div class='tekst-rechts'>";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; the_title('<h2 class="entry-title"><a href="' . esc_url(get_permalink()) . '" rel="bookmark">', '</a></h2>');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; the_content();&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; echo "</div>";&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <?php endwhile; ?>&nbsp; &nbsp; &nbsp; &nbsp; <?php else : ?>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <p>No posts!</p>&nbsp; &nbsp; &nbsp; &nbsp; <?php endif; ?>&nbsp; &nbsp; &nbsp; &nbsp; <?php wp_reset_query(); // reset the query ?>&nbsp; &nbsp; </div>CSS：&nbsp; &nbsp; .post-contents {&nbsp; &nbsp; &nbsp; display:flex;&nbsp; &nbsp; &nbsp; flex-flow: row wrap;&nbsp; &nbsp; &nbsp; justify-content: space-between;&nbsp; &nbsp; &nbsp; align-items: center;&nbsp; &nbsp; }&nbsp; &nbsp; .post-contents:nth-child(odd) .image-test {&nbsp; &nbsp; &nbsp; order: 2;&nbsp; &nbsp; }&nbsp; &nbsp; .post-contens:nth-child(odd) .entry-title {&nbsp; &nbsp; &nbsp; order: 1;&nbsp; &nbsp; }不要忘记在 post_class() 函数中添加 post-contents 类。