模块化页面使用教程

本教程介绍如何通过【页面管理】创建页面，并使用主题内置模块搭建页面内容。

模块化页面适用于首页、关于我们、联系我们、服务介绍、案例展示等页面。

---

进入页面管理

登录网站后台，点击左侧菜单：

页面管理 → 页面

进入后，可以看到当前已经创建好的页面列表，例如：首页、联系我们、关于我们等。

在页面列表中，可以对页面进行新建、导入、设置模块等操作。

---

新建页面

点击页面顶部的【新建】按钮。

系统会弹出【新建页面】窗口。

这里需要填写页面基础信息：

页面标题

填写页面名称，例如：首页、关于我们、联系我们。

分享标题

页面分享到微信、QQ 等平台时显示的标题。一般可以和页面标题保持一致。

页面简介

页面分享时显示的简介内容。可以简单填写当前页面的说明。

分享图

页面分享时显示的缩略图。点击【选择图片】上传即可。

填写完成后，点击【新建】按钮。

页面创建完成后，会显示在页面列表中。

---

设置页面模块

页面创建完成后，在页面列表中找到该页面，点击右侧的【设置模块】按钮。

进入后，可以看到当前页面已经添加的模块。

页面模块列表中的内容，就是该页面前台实际显示的内容区域。

后台模块从上到下排列，前台页面也会按照同样顺序显示。

---

添加新模块

在页面模块管理界面，点击顶部【新建】按钮。

系统会弹出【新建模块】窗口。

选择需要添加的模块类型，然后点击【下一步】。

进入模块设置页面后，根据模块要求填写内容并保存。

保存后，该模块会出现在当前页面的模块列表中。

---

调整模块顺序

页面中的模块支持拖动排序。

在模块列表中，按住模块旁边的拖动图标，上下拖动即可调整位置。

模块顺序调整后，前台显示顺序也会同步改变。

例如想让产品展示显示在关于我们前面，只需要把产品模块拖到关于我们模块上方即可。

调整完成后，刷新前台页面查看效果。

---

编辑模块

如果需要修改某个模块内容，可以在模块列表中找到对应模块，点击【编辑】。

进入编辑页面后，可以修改该模块的标题、图片、文字、分类、显示数量等内容。

不同模块的设置项不同，具体设置方法会在后续模块教程中单独说明。

修改完成后保存，前台页面会同步更新。

---

复制模块

如果某个模块想在其他页面继续使用，可以点击【复制到】。

选择需要复制到的页面后，该模块会被复制到目标页面中。

复制功能适合复用已经设置好的内容，例如联系我们、合作伙伴、产品推荐等模块。

复制后，也可以进入目标页面单独修改模块内容。

---

移动或隐藏模块

如果某个模块暂时不需要显示，可以使用【撤回】功能。

撤回后，该模块成为待发布状态不会继续显示在当前页面中。

如果只是想调整位置，建议使用拖动排序，不需要撤回模块。

---

模块可以重复添加

同一个页面中，可以添加多个相同类型的模块。

例如可以添加多个产品展示模块，分别展示不同产品分类。

也可以添加多个新闻模块，分别展示公司新闻、行业资讯或常见问题。

每个模块都可以单独设置内容，互不影响。

---

查看前台效果

模块添加、编辑或排序完成后，打开网站前台对应页面，刷新即可查看效果。

如果没有看到变化，可以检查是否已经保存设置，或者清理浏览器缓存后再查看。

---

发布页面模块

模块创建完成后，默认并不会立即在网站前台显示。

进入模块编辑页面后，可以看到页面顶部的【发布】按钮。

完成模块内容设置后，请点击【发布】，系统会将当前模块状态切换为已发布。

只有已发布状态的模块，才会在网站前台正常显示。

如果模块处于【待发布】状态，即使已经完成编辑并保存，网站前台也不会显示该模块内容。

因此，在完成模块设置后，建议返回模块列表，确认模块已经发布成功。

如果发现前台页面没有显示新增模块，请首先检查当前模块是否已经点击【发布】。

---

公用模块

除了普通页面模块之外，主题还提供了【公用模块】功能。

公用模块主要用于多个页面需要重复使用相同内容的场景。

例如：

网站首页、关于我们、联系我们等多个页面，都需要显示同一个联系表单。

如果每个页面分别创建一个联系表单模块，那么后期修改联系电话或者表单内容时，就需要一个页面一个页面去修改。

使用公用模块后，只需要维护一个模块即可。

（插入公用模块后台截图）

首先进入：

页面管理 → 公用模块

点击【新建】，创建一个新的公用模块。

创建完成后，与普通模块一样，可以设置模块内容并点击发布。

随后进入任意页面的【设置模块】，点击【新建】。

在模块选择窗口中，可以直接选择已经创建好的公用模块。

这样，一个公用模块就可以同时出现在多个页面中。

如果以后需要修改内容，只需要进入【公用模块】修改一次，所有引用该模块的页面都会自动同步更新。

对于一些需要全站统一展示的内容，例如：

• 联系表单
• 联系方式
• 合作伙伴
• 在线咨询
• 底部咨询横幅
• 公司优势介绍

都建议使用公用模块进行管理。页面模块适用于当前页面独立内容；公用模块适用于多个页面重复使用的内容。两者结合使用，可以大幅降低后期网站维护成本。

---

后续教程说明

本篇主要介绍模块化页面的基本操作流程。

后续会针对每个模块单独编写教程，例如幻灯片模块、产品展示模块、图文横幅模块、新闻资讯模块、案例展示模块等。

掌握本篇内容后，就可以完成页面的新建、模块添加、模块排序和模块复用。