将类添加到基于帖子类别的自定义帖子类型周围的 div

Question

我正在寻找一种方法，将一个类注入到一个 div 中，该 div 包含基于帖子所属类别的自定义帖子类型。将分为三个类别；

电子书（类名cat1）
信息图（类名cat2）
案例研究（类名cat3）

到目前为止，这是我调用自定义帖子类型的代码。目前，该页面将所有帖子显示为最后一个类别 - 案例研究 (cat3)。

        <?php $loop = new WP_Query( array( 'post_type' => 'resources', 'posts_per_page' => -1 ) ); ?>
        <?php while ( $loop->have_posts() ) : $loop->the_post(); ?>

            <?php
            $post = $wp_query->post;

            if ( in_category('ebook', $post->ID) ) { ?>
                <div <?php body_class('tile scale-anm cat1 all end'); ?>>
                    <section class="small-12 medium-4 large-3 columns end">
                        <section class="grid">
                            <figure class="effect-sarah">
                                <img src="<?php the_field('img'); ?>" alt="img13"/>
                                <figcaption>
                                    <h2>Resource</h2>
                                    <p class="signika"><?php the_field('desc'); ?></p>
                                    <p class="bold"><?php the_field('btnText'); ?></p>
                                    <a href="<?php echo esc_url( get_permalink() ); ?>" target="_blank"><?php the_field('btnText'); ?></a>
                                </figcaption>           
                            </figure>
                        </section>
                    </section>
                </div> 
            <?php
            } 


            elseif ( in_category('infographic', $post->ID) ) { ?>
                <div <?php body_class('tile scale-anm cat2 all end'); ?>>
                    <section class="small-12 medium-4 large-3 columns end">
                        <section class="grid">
                            <figure class="effect-sarah">
                                <img src="<?php the_field('img'); ?>" alt="img13"/>
                                <figcaption>
                                    <h2>Resource</h2>
                                    <p class="signika"><?php the_field('desc'); ?></p>
                                    <p class="bold"><?php the_field('btnText'); ?></p>
                                    <a href="<?php echo esc_url( get_permalink() ); ?>" target="_blank"><?php the_field('btnText'); ?></a>
                                </figcaption>           
                            </figure>
                        </section>
                    </section>
                </div> 
            <?php
            } 


            elseif ( in_category('casestudy', $post->ID) ) { ?>
                <div <?php body_class('tile scale-anm cat3 all end'); ?>>
                    <section class="small-12 medium-4 large-3 columns end">
                        <section class="grid">
                            <figure class="effect-sarah">
                                <img src="<?php the_field('img'); ?>" alt="img13"/>
                                <figcaption>
                                    <h2>Resource</h2>
                                    <p class="signika"><?php the_field('desc'); ?></p>
                                    <p class="bold"><?php the_field('btnText'); ?></p>
                                    <a href="<?php echo esc_url( get_permalink() ); ?>" target="_blank"><?php the_field('btnText'); ?></a>
                                </figcaption>           
                            </figure>
                        </section>
                    </section>
                </div> 
            <?php
            }

            ?>          

        <?php endwhile; wp_reset_query(); ?>

Answer 1

DRY，不要重复自己。你的循环也有一些问题。

使用 WP_Query 后，使用wp_reset_postdata() 而不是wp_reset_query()。

摆脱$post = $wp_query->post;，使用get_the_ID()从循环中获取id

然后我们检查类别并将类名分配给变量$catclass，我们将其插入到body_class()的参数中，注意使用"而不是'

试试这个：

<?php $loop = new WP_Query( array( 'post_type' => 'resources', 'posts_per_page' => -1 ) ); ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<?php
    $catclass = "";
    if (in_category('ebook', get_the_ID())) {
        $catclass="cat1";
    } else if(in_category('infographic', get_the_ID())) {
        $catclass="cat2";
    } else if(in_category('casestudy', get_the_ID())){
        $catclass="cat3";
    }
?>

    <div <?php body_class("tile scale-anm {$catclass} all end"); ?>>
        <section class="small-12 medium-4 large-3 columns end">
            <section class="grid">
                <figure class="effect-sarah">
                    <img src="<?php the_field('img'); ?>" alt="img13"/>
                    <figcaption>
                        <h2>Resource</h2>
                        <p class="signika"><?php the_field('desc'); ?></p>
                        <p class="bold"><?php the_field('btnText'); ?></p>
                        <a href="<?php echo esc_url( get_permalink() ); ?>" target="_blank"><?php the_field('btnText'); ?></a>
                    </figcaption>           
                </figure>
            </section>
        </section>
    </div> 
<?php
endwhile; 
wp_reset_postdata(); ?>

如果您真的很兴奋，可以将 if/else 语句替换为：

switch(true){
    case in_category('ebook', get_the_ID()):
    $catclass = "cat1";
    break;
    case in_category('infographic', get_the_ID()):
    $catclass = "cat2";
    break;
    case in_category('casestudy', get_the_ID()):
    $catclass = "cat3";
    break;
    default:
    $catclass = "";
}