个性化定制页眉与页脚：WoodMart Header Builder 使用详解

在 WordPress 电商网站中，页眉和页脚不只是导航和品牌展示的工具，更关系到转化和信任感。WoodMart 主题提供了功能强大的 Header Builder，可视化操作，轻松打造专属布局。本文带你一步步搭建独一无二的页眉与页脚结构。

一、启用 WoodMart Header Builder

• 登录 WordPress 后台
• 前往 WoodMart > Header Builder

界面非常直观，拖拽组件排版，与 Elementor 的操作逻辑类似。

二、定制页眉（Header）

1. 新建页眉

点击“add new header”选项，选择需要的结构样式，如 Logo 居左、菜单居中、图标居右等，或者空白模板。

2. 添加模块组件

点击加号搜索并添加下列模块：

• Logo：添加网站标志，可上传 PNG 或 SVG 格式
• Main Menu：主导航菜单，需先在 WordPress 设置好菜单

• Search：搜索框，支持切换为产品搜索，选择你喜欢的样式

• Cart：显示购物车图标，适合电商功能
• Social Icons：添加社交媒体链接

3. 设置样式与响应显示

点击模块后，可设置字体、颜色、背景、边距等样式细节。

点击右上角“桌面 / 手机”图标，分别调整各端显示效果。

4. 固定页眉 Sticky Header

点击设置，开启 Sticky 功能，可让页眉在滚动时仍保留在页面顶部，方便操作和导航。

三、定制页脚（Footer）

WoodMart 虽然没有独立的 Footer Builder，但可以借助以下两种方式实现自定义页脚：

方式一：使用小工具区域

进入 外观 > 小工具 > Footer Widgets，可添加内容模块如文字说明、菜单、联系方式等。

方式二：使用 Elementor 创建页脚模板

• 打开 Elementor > 模板 > 添加新模板
• 类型选择“页脚”

• 利用 Elementor 拖拽编辑设计页脚

• 设置显示范围为“整站”

• 返回 WoodMart，进入 Theme Settings > Footer 中选择创建好的模板

四、自定义代码区域（进阶用法）

WoodMart 的页眉与页脚支持插入 HTML 块与 JS 脚本，常见用法有：

• 第三方客服插件嵌入
• 网站统计追踪代码添加
• 顶部通栏公告或广告信息展示

五、常见问题与技巧

• Logo 变形？ 建议上传宽度不超过 200px 的图片，SVG 格式可避免模糊
• 菜单未居中？ 将菜单模块放入中间栏，并设置对齐方式为“居中”
• 页脚重复？ 检查 Elementor 与主题设置是否冲突，避免双重调用模板
• 响应式错位？ 每个设备下都可单独调整布局，适配不同屏幕尺寸

结语

WoodMart 的 Header Builder 提供了灵活的编辑环境，配合 Elementor 模板与 WordPress 小工具，自定义出拥有强烈品牌特色的头部与尾部结构。动手尝试，用简单的操作为电商网站带来专业外观和清晰导航。

联系我们
教程看不懂？联系我们为您免费解答！免费助力个人，小企站点！	客服微信
① 电话：020-2206-9892
② QQ咨询：1025174874
③ 邮件：info@361sale.com
④ 工作时间：周一至周五，9:30-18:30，节假日休息