用Elementor短代码替换StoreFront头部失败，导航变空白求解决

首先，你的代码里remove_action的用法完全错了——这个函数一次只能移除单个钩子上的单个函数，不能把多个钩子、函数混在一个调用里，这就是为什么只有导航被“清空”却没替换成你的自定义头部的原因。

正确的步骤来替换StoreFront头部 #

StoreFront的默认头部是通过storefront_header钩子加载多个组件的，比如站点标识、导航、购物车等。要完全替换它，我们需要先移除这个钩子下的所有默认组件，再添加你的自定义头部函数。

1. 先移除StoreFront头部的所有默认元素

StoreFront在storefront_header钩子下注册的核心函数及对应优先级：

• storefront_skip_links（优先级0）
• storefront_site_branding（优先级20）
• storefront_primary_navigation（优先级50）
• storefront_header_cart（优先级60）

你需要逐个移除它们，确保优先级和原主题的一致（否则移除会失效）。

2. 添加你的自定义头部函数

在自定义函数里，输出Elementor模板的短代码（记得替换成你自己的模板ID）。

完整的修正代码 #

add_action('init', 'replace_storefront_header');
function replace_storefront_header() {
    // 移除StoreFront头部的所有默认组件
    remove_action('storefront_header', 'storefront_skip_links', 0);
    remove_action('storefront_header', 'storefront_site_branding', 20);
    remove_action('storefront_header', 'storefront_primary_navigation', 50);
    remove_action('storefront_header', 'storefront_header_cart', 60);
    
    // 添加你的自定义头部（替换成你的Elementor模板短代码）
    add_action('storefront_header', 'my_custom_elementor_header', 10);
}

function my_custom_elementor_header() {
    // 替换成你Elementor自定义头部的短代码
    echo do_shortcode('[elementor-template id="123"]');
}

额外注意事项 #

• 确认你的Elementor模板ID是正确的：在Elementor模板库中找到你的头部模板，编辑时URL里的post=xxx就是模板ID。
• 如果只想替换导航而不是整个头部，那只需要移除storefront_primary_navigation，然后在对应优先级添加你的自定义导航即可。
• 确保代码放在子主题的functions.php里，不要直接修改父主题文件，避免主题更新丢失更改。

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