目前，我正在更改Woocommerce的面包屑菜单。我想让它看起来像这样：

            <div>
                <ul class="crumbs">
                    <li>
                        <a href="http://localhost:8888/sitename">Home</a>
                    </li>
                    <li class="separator"> | </li>
                    <li>About us</li>
                </ul>
            </div>

我的职能中有这一点。php：

            add_filter( \'woocommerce_breadcrumb_defaults\', \'jk_woocommerce_breadcrumbs\' );
            function jk_woocommerce_breadcrumbs() {
            return array(
            \'delimiter\' => \' | \',
            \'wrap_before\' => \'<div itemprop="breadcrumb"><ul class="crumbs"><li>\',
            \'wrap_after\' => \'</li></ul></div>\',
            \'before\' => \'\',
            \'after\' => \'\',
            \'home\' => _x( \'Home\', \'breadcrumb\', \'woocommerce\' ),
            );
            }

不幸的是，这给了我：

            <div>
                <ul class="crumbs">
                    <li>
                    <a class="" href="http://localhost:8888/sitename">Home</a>
                    |
                    <a href="http://localhost:8888/sitename/product-category/buzsaws/">buzsaws</a>
                    | Animal Train
                    </li>
                </ul>
            </div>

我可以向过滤器添加什么，使其与我在网站其余部分显示的面包屑nag保持一致？

谢谢

add_filter( \'woocommerce_breadcrumb_defaults\', \'custom_woocommerce_breadcrumbs\' );
function custom_woocommerce_breadcrumbs() {
  return array(
    \'delimiter\'   => \'<li class="separator"> | </li>\',
    \'wrap_before\' => \'<div><ul class="crumbs">\',
    \'wrap_after\'  => \'</ul></div>\',
    \'before\'      => \'<li>\',
    \'after\'       => \'</li>\',
    \'home\'        => _x( \'Home\', \'breadcrumb\', \'woocommerce\' ),
  );
}

add_filter( \'woocommerce_breadcrumb_defaults\', \'custom_woocommerce_breadcrumbs\' );
function custom_woocommerce_breadcrumbs() {
  return array(
    \'delimiter\'   => \'\', // no delimiter
    \'wrap_before\' => \'<div><ul class="crumbs">\',
    \'wrap_after\'  => \'</ul></div>\',
    \'before\'      => \'<li>\',
    \'after\'       => \'</li>\',
    \'home\'        => _x( \'Home\', \'breadcrumb\', \'woocommerce\' ),
  );
}

.crumbs li {
  padding: 10px;
  border-right: 1px solid black;
}
.crumbs li:last-child {
  border-right: none;
}