Woocommerce 仅针对 css 的商店页面

Question

这是我需要做的：

仅使用 css 的主要商店页面（我创建的特定自定义 class，如下所述）。

这是我到目前为止所做和尝试过的：

我的子主题中有一个覆盖模板 archive-product.php。
在这个覆盖模板中，我在产品循环开始之前添加了一个带有自定义 class custom-shop-class 的 div，因为我想专门针对循环产品。
我尝试使用 class page-id-4 进行定位，因为如果我将鼠标悬停在 wp-admin 的 "shop" 页面上，它会给我 http://.../post.php?post=4&action=edit

我遇到的问题如下：

根据我的发现，相同的 archive-product.php 模板被用于其他不同的商店页面，而不仅仅是主 "shop" 页面（如果我错了请纠正我), 所以当我用 CSS 定位我的 custom-shop-class 时，它会影响使用相同模板文件的所有其他商店页面，而且一定不会。
没有专用于商店页面的唯一标识符或 class，类似于 body 标签中的 page-id-?? class（与通常的 WP 页面一样）。

有什么最好的建议吗method/solution？

提前致谢，马里奥

Answer 1

设置一个条件语句来检查主要商店页面，如果该语句的计算结果为真，则回显有问题的 div。

主要商店页面的 WooCommerce 条件标签：

is_shop()

例子

if (is_shop()) {
echo "<div class='custom-shop-class'></div>";
} else {
echo "<div class='custom-product-category-class'></div>";
}

或者：

<?php if (is_shop()):?>
<div class="custom-shop-class"></div>
<?php else: ?>
<div class="custom-product-category-class"></div>
<?php endif;?>

Conditional Tags | WooThemes Documentation

Answer 2

要以此处提供的答案为基础，我如何进一步根据活动的 WPML 语言向商店页面添加唯一标识符？（我基本上只是尝试减小德语版商店页面上的字体大小 - 事实证明这很难做到）

Answer 3

使用带有 is_shop 条件的过滤器 body_class，您可以定位到主要的 WooCommerce 商店页面。

add_filter( 'body_class', 'woo_shop_class' );
// Add WooCommerce Shop Page CSS Class
function woo_shop_class( $classes ) {
  if ( is_shop() )  // Set conditional
    $classes[] = 'woo-shop'; // Add Class
return $classes;
}

代码在您的主题 functions.php 文件中。

Woocommerce 仅针对 css 的商店页面

Woocommerce targeting the shop page only with css

css

wordpress

shop

woocommerce