在 WooCommerce 循环中添加子类别和产品之间的分隔线

Add a divider between subcategories and products in WooCommerce loop

提问人:Ward Swilem 提问时间:9/29/2023 最后编辑:LoicTheAztecWard Swilem 更新时间:9/29/2023 访问量:67

问:

我需要在主类别 WooCommerce 中的产品和子类别之间添加分隔线或 Elementor 模板。

我把它分开了,但我不能添加分隔符

我将此代码与 Elementor 模板短代码一起使用,但它被空格分隔

add_action( 'init', 'move_subcat_lis' );
function move_subcat_lis() {
    // Remove the subcat <li>s from the old location.
    remove_filter( 'woocommerce_product_loop_start', 'woocommerce_maybe_show_product_subcategories' );

    add_action( 'woocommerce_before_shop_loop', 'msc_product_loop_start', 40 );
    add_action( 'woocommerce_before_shop_loop', 'msc_maybe_show_product_subcategories', 50 );
    add_action( 'woocommerce_before_shop_loop', 'msc_product_loop_end', 60 );
}

/**
* Conditonally start the product loop with a <ul> contaner if subcats exist.
*/
function msc_product_loop_start() {
    $subcategories = woocommerce_maybe_show_product_subcategories();

    if ( $subcategories ) {
        woocommerce_product_loop_start();
    }
}

/**
* Print the subcat <li>s in our new location.
*/
function msc_maybe_show_product_subcategories() {
    echo woocommerce_maybe_show_product_subcategories();
}

/**
* Conditonally end the product loop with a </ul> if subcats exist.
*/
function msc_product_loop_end() {
    get_header();

    echo do_shortcode('[elementor-template id="2808"]'); 

    $subcategories = woocommerce_maybe_show_product_subcategories();

    if ( $subcategories ) {
        woocommerce_product_loop_end();
    }
}
php wordpress 循环 woocommerce 自定义分类法

评论

0赞 jessman5 9/29/2023
请提供完整的工作代码示例。并请解释您需要哪种隔板:视觉隔板还是?无论如何,我们都需要有效的 HTML 和 CSS 来帮助您。div
0赞 Ward Swilem 9/29/2023
这是完整的代码
0赞 Ward Swilem 9/29/2023
分隔线是 Elementor 的模板
0赞 Ward Swilem 9/29/2023
这是分频器代码 get_header();echo do_shortcode('[elementor-template id=“2808”]');

答:

2赞 LoicTheAztec 9/29/2023 #1

根据这个 Wordpress StackExchange 答案,您可以使用以下简化版本:

// Remove displayed subcategories from product loop
remove_filter( 'woocommerce_product_loop_start', 'woocommerce_maybe_show_product_subcategories' );

// Display subcategories before the product loop
add_action( 'woocommerce_before_shop_loop', 'display_product_subcategories', 50 );

function display_product_subcategories() {
    $categories = woocommerce_maybe_show_product_subcategories();

    if ( $categories ) {
        printf('<ul class="products categories columns-%d">%s</ul>',
            esc_attr( wc_get_loop_prop( 'columns' ) ), $categories );

        echo '<hr>'; // <== Divider 
    }
}

代码位于子主题的函数.php文件中(或插件中)。经过测试并有效。

现在,您可以替换以下分隔符:<hr>

echo '<hr>'; // <== Divider 

替换为您的简码,例如:

echo do_shortcode('[elementor-template id="2808"]'); 

评论

0赞 Ward Swilem 9/29/2023
它正在工作,谢谢
0赞 Ward Swilem 9/29/2023
但是所有 css 自定义都已更改 如何在中心创建子类别并在移动视图的每行中显示 2 个子类别