从产品类别页面中删除侧边栏 | WordPress Woocommerce答案

【问题标题】：Remove Sidebar from Product Category Page | Wordpress Woocommerce从产品类别页面中删除侧边栏 | WordPress Woocommerce
【发布时间】：2015-11-16 17:39:25
【问题描述】：

我的问题是，我如何才能仅删除特定产品类别“Slug”而不是其子 slug 的侧边栏。
如果 url 如下所示 - 删除侧栏并使页面全宽仅适用于 slugs “sanitaryware” 和 “closets” http://www.example.com/product-category/sanitaryware/
http://www.example.com/product-category/sanitaryware/closets/

我不想因为所有“产品类别”的原因而删除侧边栏，我希望侧边栏显示孙子蛞蝓“one-piece-closets”：
http://www.example.com/product-category/sanitaryware/closets/one-piece-closets

代码：我在 function.php 中使用的代码 - 这是删除网站所有产品类别中的侧栏。

  <?php
            /**
             * woocommerce_sidebar hook
             *
             * @hooked woocommerce_get_sidebar - 10
             */
            if (!is_product_category('sanitaryware')){
        do_action('storefront_sidebar');
}
?>

【问题讨论】：

你目前使用的是什么主题？
wordpress的店面
以后，请简单地编辑您的问题，而不是创建一个您本质上问同样问题的新问题。
@helgatheviking 我在这里问过这个问题stackoverflow.com/questions/32165017/…
非常感谢。我已经投票决定重新打开它，因为它已经被重新措辞了。我一个人的力量似乎不够。请注意，对于非常重要的事情（您马上需要），您可能需要考虑聘请开发人员。

标签： php css wordpress woocommerce

【解决方案1】：

根据您希望隐藏顶级类别及其直属子类别的侧边栏，我们将需要一个系统来确定任何术语存档的分层“深度”。与人们经常获取“顶级”父项的方式类似，我们可以执行while 循环来获取项的项对象并检查项的父项。在我们的例子中，我们只保留一个计数并返回它，而不是返回顶级父级。

/**
* Returns depth level of product category
*
* @param    string      $catid  Product category ID to be checked
* @return   string      $depth  how many categories deep is this term in the hierarchy
*/
function so_32165017_get_product_cat_depth($catid) {
    $depth = 0;
    while ($catid) {
        $cat = get_term_by('id', $catid, 'product_cat'); // get the object for the catid
        if( $cat->parent > 0 ){
            $depth++;
        }
        $catid = $cat->parent; // assign parent ID (if exists) to $catid
        // the while loop will continue whilst there is a $catid
    }
    return $depth;
}

现在我们有了可以用作条件的东西，我们可以有条件地删除 WooCommerce 侧边栏：

/**
* Hide the sidebar for items 2 levels deep or more
*/
function so_32165017_conditionally_remove_sidebar(){
    if( is_product_category()){
        $t_id = get_queried_object()->term_id;
        if( so_32165017_get_product_cat_depth( $t_id ) < 2 ){
            remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
            // could be theme specific ex: Storefront
            remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
        }
    }
}
add_action( 'woocommerce_before_main_content', 'so_32165017_conditionally_remove_sidebar' );

编辑/更新

如果您还想添加自定义正文类以使无侧边栏页面更易于设置样式，那么我相信您可以在实际过滤正文类的同时从body_class 过滤器中删除有问题的操作.

/**
* Hide the sidebar for items 2 levels deep or more
*/
function so_32165017_conditionally_remove_sidebar( $class ){
    if( function_exists('is_product_category') && is_product_category() ){
        $t_id = get_queried_object()->term_id;
        if( so_32165017_get_product_cat_depth( $t_id ) < 2 ){
            remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10 );
            // could be theme specific ex: Storefront
            remove_action( 'storefront_sidebar', 'storefront_get_sidebar', 10 );
            // add a custom body class
            $class[] = 'full-width';
        }
    }
    return $class;
}
add_action( 'body_class', 'so_32165017_conditionally_remove_sidebar' );

【讨论】：

考虑到它们的深度，以上内容对我来说非常适合删除第一个和第二个 Slug 的侧边栏。工作完美。但是，它没有回答请求的第二部分，这使这些页面全宽。如果我需要添加一个类以只为这些页面提供不同的样式..我将在哪里添加新样式以及如何将此样式映射到我们使用您在上面提到的答案中使用您的代码更改的特定页面。ve
这可以用来实现不同的类吗？或者此代码是否需要任何更改// Add specific CSS class by filter add_filter( 'body_class', 'product_categories' ); function product_categories( $classes ) { // add 'class-name' to the $classes array if (is_product_category('sanitaryware') && is_product_category('Faucet')) { $classes[] = 'product-category'; } // return the $classes array return $classes; }

【解决方案2】：

一种方法是制作自定义模板并在查看产品类别页面时阻止侧边栏呈现。按照Woocommerce docs 的升级安全建议，您应该：

1) 进入wp-content/plugins/woocommerce/templates/目录，复制archive-product.php文件

2) 在您的主题目录中创建一个 woocommerce 目录（例如 wp-content/themes/your-theme/woocommerce）

3) 创建wp-content/plugins/woocommerce/templates/archive-product.php 的副本并将其放入wp-content/themes/your-theme/woocommerce/ 并将文件命名为archive-product.php

4) 查看新自定义文件的底部附近并找到：

do_action( 'woocommerce_sidebar' );

5) 将该行代码替换为：

if (!is_product_category('sanitaryware') && !is_product_category('Faucet')) {
   do_action( 'woocommerce_sidebar' );
}

6) 要使产品类别页面内容为全角，您可以使用过滤器将名为 product-category 的类添加到这些页面的 <body>。

要添加这个新类，请将此代码插入到您的 functions.php 文件中：

// Add specific CSS class by filter
add_filter( 'body_class', 'product_categories' );
function product_categories( $classes ) {
    // add 'class-name' to the $classes array
    if (is_product_category('sanitaryware') && is_product_category('Faucet')) {
        $classes[] = 'product-category';
    }
    // return the $classes array
    return $classes;
}

7) 然后在您的主题样式表中，您可以使用此 CSS 选择器定位产品类别页面：

body.product-category { /* place Product Category page specific CSS here */ }

由于我不知道你的主题的细节，我不能告诉你你想要将 100% 宽度设置为目标的 HTML 元素，但如果页面内容类似于 <div id="content"> 你可以像这样设置 CSS：

body.product-category #content { 
    width: 100%;
    float: none;
}

【讨论】：

上面的代码没有去掉侧边栏。在问问题之前，我错过了检查。我有两个步骤可以看到侧栏：1）产品目录页面，其中我有使用侧栏作为过滤器的产品列表 - 这里我需要侧栏（但问题是这个页面也是产品类别） . 2) 我有带有侧栏的产品摘要的产品类别 - 我需要在此处将其删除。问题是，两者都是产品类别页面
我真正需要的是，我现在意识到了..我的问题是，我可以只删除我身边特定 URL 的侧边栏吗？如果 url 如下所示 - 删除侧栏并使页面全宽 example.com/product-category/sanitaryware example.com/product-category/Faucet 我不想因为“产品类别”而删除侧栏，我希望侧栏显示以下 URL： example.com/product-category/sanitaryware/closets/…
将自定义 archive-product.php 文件底部的 if (!is_product_category()) 替换为 if (!is_product_category('sanitaryware') && !is_product_category('Faucet'))
对于全角：将 functions.php 文件的 body_class 过滤器中的 if (is_product_category()) 替换为 if (is_product_category('sanitaryware') || is_product_category('Faucet'))
if (!is_product_category('sanitaryware') && !is_product_category('Faucet')) 不起作用.. 页面 example.com/product-category/sanitaryware 上仍显示侧栏

【解决方案3】：

您可以从类别页面删除侧边栏覆盖 archive-product.php 或在 WordPress 的当前主题中使用 function.php 中的操作挂钩。

您可以将它们复制到您的主题中，而不是直接在插件中编辑这些文件（这是一个非常糟糕的主意，因为一旦更新插件并且您的所有更改都将丢失！），您可以将它们复制到您的主题中：

在您的主题目录中，创建一个名为“WooCommerce”的新文件夹。
导航到 WooCommerce 插件目录并打开“模板”文件夹。模板文件夹有很多子文件夹，其中包含 WooCommerce 使用的所有不同模板。幸运的是，WooCommerce 中的模板文件结构和命名很容易遵循。
在您新创建的“WooCommerce”文件夹中，复制您要编辑的模板文件。

请记住在此处保持目录结构相同。如果您要编辑的模板位于子文件夹中，然后记住在主题目录中创建该子文件夹。

在 archive-product.php -

<?php
/**
 * woocommerce_sidebar hook
 *
 * @hooked woocommerce_get_sidebar - 10
 */
do_action('woocommerce_sidebar');?>

此代码在类别页面上显示侧边栏删除此代码并保存文件。

或

要从您想在
function.php 文件中使用操作挂钩的类别页面中删除侧边栏 -

    add_filter( 'body_class', 'remove_sidebar' );
    function remove_sidebar()
    {
        if( is_product_category()) { 
         remove_action( 'woocommerce_sidebar', 'woocommerce_get_sidebar', 10);
       }
    }

接下来，我们要编辑你主题文件夹中的style.css-

body.product-category #content
    {
            width: 100%;
    }

在这里你可以得到 WooCommerce Action 和 Filter Hook -https://docs.woothemes.com/wc-apidocs/hook-docs.html

【讨论】：