Question

我正在使用WooCommerce 3.5.7和WordPress 5.0.4。

我有多个产品属于多个类别：

e.g. 

Product 1, attached to categories A,B, C
Product 2, attached to categories A,Y, C

etc...

我想从站点隐藏类别C，以便在前端的站点类别菜单导航中显示类别时不可见。

我尝试了很多方法，但似乎都没有效果，

第一种方法： 通过CSS隐藏。

导航菜单的结构如下：

<li class="cat-item ">
    <span class="icon-toggle"></span>
    <a href="https://siteurl.com/product-category/category-url/">category-text</a>
</li>

我尝试使用以下CSS隐藏该元素：

a[href="https://siteurl.com/product-category/category-url/"] 
{
    display: none!important;
}

此问题是它删除了超链接和文本，但是类别仍在页面上“占用空间”。这是因为这仅隐藏了锚元素，而不隐藏作为该元素父元素的整个<li class="cat-item ">。

我找不到任何方法来定位CSS中子元素的父对象。

第二种方法：使用pre_get_posts： https://wordpress.stackexchange.com/questions/90923/pre-get-posts-for-exclude-category

$catid = "-1031";

$excludeCategory = function ($catid)
{
    return function ($query)
    {
        if (
            $query->is_home() 
            && $query->is_main_query()
        ) {
            $query->set('cat', $catid);
        }
    };
};

add_action('pre_get_posts', $excludeCategory($catid));

在上面的示例中，我要隐藏的类别ID为“ 1031”。但这没有用。

任何建议，如何删除该产品类别，使其不显示在前端，但保留在后端？

Answer 1

您可以尝试将onclick="hide()"添加到链接，然后添加以下javascript：

function hide() { document.getElementsByClassName("cat-item ").style.display = "none!important"; }

如何从WooCommerce前端隐藏特定类别

1 个答案: