1

我想在 WooCommerce 类别档案中设置一些过滤器选项的样式。

例如：有一个针对汽车类型的过滤器。比方说皮卡、SUV、跑车……每个选项都应该有一个自己的图标。因此，我需要为每个选项上课。在最好的情况下，它将是属性的 ID。

我找到了一个插件来为小部件（https://wordpress.org/plugins/widget-css-classes/）添加 CSS 类，但不是为选项/属性添加 CSS 类。

目前它看起来像这样：

<ul class="woocommerce-widget-layered-nav-list">
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">...</li>
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">...</li>
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">...</li>
</ul>

如果我可以添加一个额外的类，例如wc-layered-nav-term-id.

在这里，您可以看到与我的示例相同的 HTML 结构（向下滚动到颜色）：https ://themes.woocommerce.com/storefront/product-category/clothing/blouses/

有什么过滤器可以用来添加这样的类吗？

4

1 回答 1

-1

如果您没有唯一的 id 或类，则可以使用如下所示的 CSS3 选择器。你可以在这里看到所有的选择器。关联

.woocommerce-widget-layered-nav-list > li:nth-child(1){
background:red;
}

.woocommerce-widget-layered-nav-list > li:nth-child(2){
background:gray;
}

.woocommerce-widget-layered-nav-list > li:nth-child(3){
background:yellow;
}
<ul class="woocommerce-widget-layered-nav-list">
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">pickups</li>
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">suv</li>
    <li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term ">sportscar</li>
</ul>

于 2019-11-23T20:45:17.813 回答