页面搭建

修改首页内容——文字、图片和按钮

网站交付后,我们已经根据您提供的资料完成首页搭建。以后需要更新公司介绍、更换展示图片或调整按钮文字时,您可以在现有首页上修改,不用重新搭建整个页面。

这一篇带您完成一次首页内容更新:找到首页 → 进入页面构建器 → 找到对应模块 → 修改内容 → 保存并检查。第一次操作,建议先改一处简短介绍,熟悉流程后再逐步更新其他位置。

配图已按当前版本的 BC页面构建器重新截取,来自交付产品演示站的实际后台,企业内容和账号信息已遮蔽。演示站首页名为“index”。请按下面的步骤确认您网站使用的首页,再进入对应页面编辑。点击图片可以查看大图。

一、先找到网站真正使用的首页

  1. 登录网站后台,进入设置 → 阅读。
  2. 在“您的主页显示”中,查看“一个静态页面”下的主页选项,记下所选页面名称。这里只查看,不更改设置。
  3. 进入左侧页面 → 所有页面,找到刚才确认的页面。
  4. 点击该页面标题,进入编辑界面。

以“设置 → 阅读”中选定的主页为准,不按页面名称猜测。例如,主页选定的是“index”,就编辑页面列表中的“index”;选定的是“首页”,就编辑“首页”。

本篇适用于使用 BC页面构建器搭建的静态首页。若“您的主页显示”选中的是“您的最新文章”,请先联系我们确认首页方案,不要自行切换设置。

图 1:进入“页面”,打开需要维护的页面。演示站首页名为 index;请编辑“设置 → 阅读”中选定的主页。
图 1:进入“页面”,打开需要维护的页面。演示站首页名为 index;请编辑“设置 → 阅读”中选定的主页。(点击图片查看大图)

二、进入首页的页面构建器

  1. 打开首页编辑界面后,找到使用页面构建器编辑按钮。
  2. 点击按钮,等待构建器及首页预览加载完成。
  3. 先在预览里找到您熟悉的首页区域,确认打开的是正确页面。

本篇首页正文由 BC页面构建器管理,请通过“使用页面构建器编辑”修改内容,不在普通编辑框中替换首页正文。

图 2:点击“使用页面构建器编辑”,进入已有页面的可视化编辑界面。
图 2:点击“使用页面构建器编辑”,进入已有页面的可视化编辑界面。(点击图片查看大图)

三、找到要修改的首页模块

“模块”就是首页中的一块内容,例如首屏介绍、公司简介、优势展示或图文区域。您要改哪一块,就先打开那一块的设置。

  1. 在页面预览中滚动到目标区域。
  2. 将鼠标移到该区域上,找到模块工具栏。
  3. 点击工具栏中的编辑,查看左侧出现的模块字段。
  4. 如果字段收起了,展开“模块设置”“基础设置”或“内容设置”等分组。列表式内容还需要展开其中的具体项目。

打开模块设置后,先对照字段里的原文字和图片,确认选中了要修改的模块。工具栏中的删除、复制和拖动属于其他操作,本篇先使用“编辑”即可。

图 3:鼠标移到对应模块,在紫色模块工具栏中点击红框标出的“编辑”。
图 3:鼠标移到对应模块,在紫色模块工具栏中点击红框标出的“编辑”。(点击图片查看大图)

四、先完成一次文字修改

以首页的公司介绍为例,找到介绍模块后,按照下面的顺序操作:

  1. 找到保存原有标题、简介或正文的字段。
  2. 先复制一份原文字留存,再替换为准备好的新内容。
  3. 查看预览中的对应位置,确认改动已经显示。
  4. 检查标题是否过长、段落是否完整、换行是否自然。

图 4 展示的“模块设置”中,模块标题用于设置该区域的标题,模块简介用于填写区域介绍。需要修改图文正文时,展开对应模块的内容设置;例如“关于我们”模块在这里提供“标题”和“描述”字段。先对照字段中的原文,再修改目标内容。

第一次修改时,文字长度尽量接近原内容。如果字段中包含格式标记,只修改能确认的文字;不确定的部分可以发给我们核对。

图 4:在左侧“模块设置”中修改标题和简介;右侧为页面预览。
图 4:在左侧“模块设置”中修改标题和简介;右侧为页面预览。(点击图片查看大图)

五、更换首页中的展示图片

先准备与原图比例接近的新图片,再打开对应模块的图片字段。横向展示位优先使用横图,方形展示位优先使用方图;如果后台标注了推荐尺寸,以该位置的说明为准。

  1. 找到当前图片字段,将鼠标移到旧图片上,点击该字段里的删除。
  2. 点击出现的添加项目,打开媒体选择窗口。空图片字段可以直接添加。
  3. 新图片选择上传文件;已经上传过的图片选择媒体库。
  4. 选中需要的图片后,点击右下角插入,返回构建器。
  5. 在预览中确认新图已经出现,再检查主体是否被裁切。

这里图片字段中的“删除”,是取消该字段选用的旧图,不是删除媒体库中的原文件。不要为了替换首页图片,去媒体库永久删除旧图,同一张媒体图片可以被多个页面共同使用,永久删除会影响所有引用该文件的位置。

图 5:展开“内容设置”,找到图片字段。需要更换旧图时,点击图片上的“删除”,移除当前字段的引用。
图 5:展开“内容设置”,找到图片字段。需要更换旧图时,点击图片上的“删除”,移除当前字段的引用。(点击图片查看大图)
图 6:旧图移除后,点击“添加项目”,打开图片选择窗口。
图 6:旧图移除后,点击“添加项目”,打开图片选择窗口。(点击图片查看大图)
图 7:新图片从“上传文件”选择;已上传的图片从“媒体库”选择。
图 7:新图片从“上传文件”选择;已上传的图片从“媒体库”选择。(点击图片查看大图)
图 8:选中图片后,点击右下角“插入”,返回模块设置。替换完成后仍需保存页面。
图 8:选中图片后,点击右下角“插入”,返回模块设置。替换完成后仍需保存页面。(点击图片查看大图)

如果同一模块有多张图片,应先确认正在编辑哪一个项目。遇到背景图或首屏轮播图,也要找到对应字段,不要直接更换旁边另一个图文模块的图片。

新图中的人物或产品被截断时,检查图片比例和展示区域。先使用更合适的图片,仍不合适再联系我们调整布局。

六、按需要修改首页按钮

以“关于我们”模块为例,展开内容设置,找到按钮-1 文本和按钮-1 链接。“文本”控制按钮上显示的文字,“链接”决定点击后的目标。修改第二个按钮时,使用对应的“按钮-2”字段。

  1. 找到当前按钮对应的文字和链接字段。
  2. 只需要改文案时,修改按钮文字,保留原链接。
  3. 需要换目标时,填写正确的页面地址。
  4. 保存首页后,到网站前台实际点击按钮,确认结果。

修改链接前,先在网站前台点击原按钮,确认它的动作:跳转页面的按钮填写目标页面网址;打开咨询表单或定位到本页区域的按钮,保留交付时配置的功能链接。只修改按钮文字时,不改链接字段。

七、保存首页,并检查电脑和手机效果

  1. 完成本次修改后,点击构建器左侧工具栏底部的保存。
  2. 等待保存完成提示,再离开编辑器。
  3. 在新标签页打开网站首页,刷新并核对刚刚修改的位置。
  4. 用手机打开首页,检查文字换行、图片裁切和按钮是否可正常使用。

预览中已经变化,不等于已经保存。对已发布首页保存修改,会更新网站内容;建议一次完成一小处修改并检查,再继续下一处。

图 9:在左侧工具栏底部点击“保存”,等待完成提示,再打开前台页面检查。
图 9:在左侧工具栏底部点击“保存”,等待完成提示,再打开前台页面检查。(点击图片查看大图)

如果首页仍显示旧内容,先确认修改的是实际使用的首页,并且保存成功,再刷新或用无痕窗口检查。启用了页面缓存的站点,保存后还需清理相应页面缓存;不清楚缓存入口时,请将首页地址和修改位置发给我们处理。

八、全站设置和自动调用内容的修改入口

  • 顶部 Logo、导航和页脚:属于全站公共区域,请参照前面的头部、页脚和导航教程。
  • 自动展示的文章或产品:进入对应的文章或产品管理菜单,修改该条记录并保存;首页列表模块负责调用和展示这些记录。
  • 表单填写项和通知邮箱:如果调用后台独立“表单”功能,请按表单教程维护。

如果您看到了某段内容,却在当前模块中找不到对应字段,先判断它是不是自动调用的内容。不要为了修改一个产品名称,删掉首页整个产品列表。

完成这一篇后,您已经掌握首页日常更新的基本流程。模块新增、排列顺序和布局调整,可以在后面的教程中再学习。

← 第七篇:网站邮件通知说明——邮箱资料、SMTP 配置与收信检查

说说您的建站想法

留下邮箱,也可以简单描述一下需求。

您提交的信息将用于本次需求沟通。