Question

我有一个Wordpress网站，它使用替换类别文本的图像。它被设置为有一个post div（填充：20％0;对于一致的响应高度）然后有一个div定位绝对，vert / horiz居中于这个div。

HTML

<div class="indx-img" style="background-image:url('...');">

        <?php 
        $testStyle = "";

        if(has_category( 'update' ) || has_category( 'uncategorized' )) {
            $testStyle = "style=\"background-image:url('".get_bloginfo('template_directory')."/img/logo.png')\"";
        } elseif(has_category( 'event' )) {
            $testStyle = "style=\"background-image:url('".get_bloginfo('template_directory')."/img/logo.png')\"";
        }
        ?>

            <div class="test" <?php echo $testStyle; ?>></div>

</div>

CSS

.indx-img {
  position: relative;
  padding: 20% 0;
}

.test {
   position: absolute;
   left: 50%;
   margin-left: -5em;
   transform: translateY(-50%);
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
  height: 10em;
  width: 10em;
}

这是一个用于测试的背景图像。问题是，如果帖子上有多个类别，则只会显示一个。

理想情况下，我想在＆＃39; test＆＃39;中创建一个div。对于应用于具有类别图像的帖子的每个类别，彼此相邻排列。

Answer 1

根据您的代码，我猜您的HTML div代码正在针对单个帖子运行。当您使用has_category检查单个类别时，它将仅为您提供类别。

要获取任何帖子的所有类别，您需要wp_get_post_categories功能。

$post_categories = wp_get_post_categories( $post_id );
$cats = array();

foreach($post_categories as $c){
    $cat = get_category( $c );
    $cats[] = array( 'name' => $cat->name, 'slug' => $cat->slug );
}

通过这种方式，您可以获得类别列表，并可以相应地应用样式代码。有关wp_get_post_categories用法的详细信息，请参阅https://codex.wordpress.org/Function_Reference/wp_get_post_categories。

创建多个Wordpress类别div

1 个答案: