即使wp_list_categories 过滤器存在，它传递（因此您必须返回）由生成的html标记wp_list_categories() 作用这意味着，如果要使用该过滤器，必须使用php更改DOM，即使可能（希望使用外部php库），也要确保它不是满足您需求的最佳解决方案。Alternartive是在创建html后使用js来更改html。这是可能的，但我是WP开发人员而不是js开发人员，所以我会给你Worpress解决方案。

您必须创建自定义Category Walker 类，然后在wp\\u list\\u categories（）的自定义版本中使用它；

让我们开始吧。

首先是自定义类别Walker类（将其放入functions.php):

class My_Category_Walker extends Walker_Category {

  var $lev = -1;
  var $skip = 0;
  static $current_parent;

  function start_lvl( &$output, $depth = 0, $args = array() ) {
    $this->lev = 0;
    $output .= "<ul>" . PHP_EOL;
  }

  function end_lvl( &$output, $depth = 0, $args = array() ) {
    $output .= "</ul>" . PHP_EOL;
    $this->lev = -1;
  }

  function start_el( &$output, $category, $depth = 0, $args = array(), $id = 0 ) {
    extract($args);
    $cat_name = esc_attr( $category->name );
    $class_current = $current_class ? $current_class . \' \' : \'current \';
    if ( ! empty($current_category) ) {
      $_current_category = get_term( $current_category, $category->taxonomy );
      if ( $category->term_id == $current_category ) $class = $class_current;
      elseif ( $category->term_id == $_current_category->parent ) $class = rtrim($class_current) . \'-parent \';
    } else {
      $class = \'\';
    }
    if ( ! $category->parent ) {
      if ( ! get_term_children( $category->term_id, $category->taxonomy ) ) {
          $this->skip = 1;
      } else {
        if ($class == $class_current) self::$current_parent = $category->term_id;
        $output .= "<li class=\'" . $class . $level_class . "\'>" . PHP_EOL;
        $output .= sprintf($parent_title_format, $cat_name) . PHP_EOL;
      }
    } else { 
      if ( $this->lev == 0 && $category->parent) {
        $link = get_term_link(intval($category->parent) , $category->taxonomy);
        $stored_parent = intval(self::$current_parent);
        $now_parent = intval($category->parent);
        $all_class = ($stored_parent > 0 && ( $stored_parent === $now_parent) ) ? $class_current . \' all\' : \'all\';
        $output .= "<li class=\'" . $all_class . "\'><a href=\'" . $link . "\'>" . __(\'All\') . "</a></li>\\n";
        self::$current_parent = null;
      }
      $link = \'<a href="\' . esc_url( get_term_link($category) ) . \'" >\' . $cat_name . \'</a>\';
      $output .= "<li";
      $class .= $category->taxonomy . \'-item \' . $category->taxonomy . \'-item-\' . $category->term_id;
      $output .=  \' class="\' . $class . \'"\';
      $output .= ">" . $link;
    }
  }

  function end_el( &$output, $page, $depth = 0, $args = array() ) {
    $this->lev++;
    if ( $this->skip == 1 ) {
      $this->skip = 0;
      return;
    }
    $output .= "</li>" . PHP_EOL;
  }

}

它扩展了WP Walker\\u类别，并用适合您需要的内容覆盖所有4种方法。

之后，在functions.php 放置自定义功能：

function custom_list_categories( $args = \'\' ) {
  $defaults = array(
    \'taxonomy\' => \'category\',
    \'show_option_none\' => \'\',
    \'echo\' => 1,
    \'depth\' => 2,
    \'wrap_class\' => \'\',
    \'level_class\' => \'\',
    \'parent_title_format\' => \'%s\',
    \'current_class\' => \'current\'
  );
  $r = wp_parse_args( $args, $defaults );
  if ( ! isset( $r[\'wrap_class\'] ) ) $r[\'wrap_class\'] = ( \'category\' == $r[\'taxonomy\'] ) ? \'categories\' : $r[\'taxonomy\'];
  extract( $r );
  if ( ! taxonomy_exists($taxonomy) ) return false;
  $categories = get_categories( $r );
  $output = "<ul class=\'" . esc_attr( $wrap_class ) . "\'>" . PHP_EOL;
  if ( empty( $categories ) ) {
    if ( ! empty( $show_option_none ) ) $output .= "<li>" . $show_option_none . "</li>" . PHP_EOL;
  } else {
    if ( is_category() || is_tax() || is_tag() ) {
      $current_term_object = get_queried_object();
      if ( $r[\'taxonomy\'] == $current_term_object->taxonomy ) $r[\'current_category\'] = get_queried_object_id();
    }
    $depth = $r[\'depth\'];
    $walker = new My_Category_Walker;
    $output .= $walker->walk($categories, $depth, $r);
  }
  $output .= "</ul>" . PHP_EOL;
  if ( $echo ) echo $output; else return $output;
}

困难的部分完成了。现在，将模板代码放在您需要的任何地方：

<div id="content-filters" class="two columns">
<div class="col tertiary" id="filters">
<?php
$args = array(
  \'taxonomy\' => \'product_cat\',
  \'show_option_none\' => __(\'No Menu Items.\'),
  \'echo\' => 1,
  \'depth\' => 2,
  \'wrap_class\' => \'product-categories\',
  \'level_class\' => \'pattern_garment_type\',
  \'parent_title_format\' => \'<h5>%s</h5>\',
  \'current_class\' => \'selected\'
);
custom_list_categories( $args );
?>
</div>
</div>

如果你想自定义$参数，我会根据你的答案代码设置它们。只有我将“pattern\\u garment\\u type”更改为class而不是id，因为在html中不能多次使用相同的标记id（就像在标记中一样）。

就这些，希望能有所帮助。

乌丁，

我将在这里回答您问题的CSS部分：

使用此选项删除列表项目符号：

.ul.product-categories, ul.children{
    list-style-type: none;

}

使用此选项仅加粗主要类别：

li {font-weight:normal} // you need to set the default state first of the list

ul.product-categories > li{font-weight:bold;} //then you can change the top level list without affecting its children

这就是如何使用css来定位这些元素，而不必编写自己的类。

您还可以将其添加到wp\\u list\\u categories参数中

\'hide_empty\' => 0

显示所有类别，即使是那些没有帖子的人。

对于问题的第二部分，您可以采取两种方法（添加“全部”链接和从主要类别中删除链接）

加载页面后，您可以使用Javascript/jquery删除/添加所需内容。您可以编写一个wp\\u列表\\u类别过滤器来进行这些更改。选项2是一种干净的方法。选项1是最快的方法。

由于时间不够，我也没有去。但是看看在wordpress中创建过滤器。