如何在Storefront子主题functions.php设置WooCommerce默认列表视图？

绝对可以！用自定义子主题的functions.php来设置WooCommerce产品默认显示列表视图，不仅能避开插件的兼容性问题，还更稳定可控。我给你整理了具体的实现方案，分基础设置和可选优化两步：

将以下代码添加到你的Storefront自定义子主题的functions.php文件中：

// 强制WooCommerce产品默认显示为列表视图
add_filter( 'woocommerce_default_catalog_view', 'storeforce_default_list_view' );
function storeforce_default_list_view() {
    return 'list'; // 若要切换回网格视图，将值改为'grid'即可
}

// 确保页面加载时应用列表视图的样式
add_action( 'wp_enqueue_scripts', 'storeforce_enqueue_list_view_styles' );
function storeforce_enqueue_list_view_styles() {
    // 仅在产品相关归档页面生效（商店页、分类页、标签页）
    if ( is_shop() || is_product_category() || is_product_tag() ) {
        add_filter( 'body_class', 'storeforce_add_list_view_body_class' );
    }
}

function storeforce_add_list_view_body_class( $classes ) {
    // 给body添加列表视图的类，Storefront会自动加载对应样式
    $classes[] = 'list-view';
    return $classes;
}

这段代码的核心作用：

• 通过woocommerce_default_catalog_view钩子直接修改WooCommerce的默认视图类型
• 给产品页面的body标签添加list-view类，确保Storefront主题加载对应的列表视图样式

如果你想完全禁用视图切换功能，只保留列表视图，可以追加以下代码：

// 隐藏Storefront自带的网格/列表切换按钮
add_action( 'wp_head', 'storeforce_hide_view_switcher' );
function storeforce_hide_view_switcher() {
    if ( is_shop() || is_product_category() || is_product_tag() ) {
        ?>
        <style>
            .woocommerce-ordering .view-switch {
                display: none !important;
            }
        </style>
        <?php
    }
}

重要注意事项 #

• 务必修改子主题的functions.php，不要直接编辑Storefront父主题文件，否则主题更新后你的自定义代码会全部丢失。
• 添加代码前建议备份functions.php文件，避免语法错误导致网站无法访问。
• 如果添加后没有立即生效，尝试清除网站缓存和浏览器缓存再刷新页面。

内容的提问来源于stack exchange，提问作者Nicla Marino