预览与可视化编辑
可视化编辑是不消耗灵感值的修改方式。掌握它能显著降低使用成本。本文讲解预览功能和编辑器的完整用法。
预览与编辑的区别
站点顶部有三个入口，先理清区别：
| 入口 | 作用 | 能否修改 |
|---|---|---|
| 预览 | 查看网站效果 | 否，只看 |
| 编辑 | 进入可视化编辑器直接改内容 | 是，改图文和样式 |
| 管理 | 进入后台配置域名、内容、SEO | 是，改配置和数据 |
一、预览
进入预览
站点顶部导航栏 → 预览。
可用操作
| 操作 | 说明 |
|---|---|
| 新窗口打开 | 在独立标签页中打开，视野更大 |
| 打开网站 | 访问已发布的线上网站 |
| 沙箱 | 查看沙箱运行环境 |
| 分享地址 | 获取可分享的预览链接，点击复制后显示「已复制」 |
| 设置 | 站点相关设置 |
| 刷新 | 重新加载预览内容 |
分享给他人看
通过「分享地址」获取链接，可以发给同事或客户征求意见——无需等到正式发布。这在需要多方确认的项目中很实用。
预览时的检查要点
发布前建议按此清单检查：
内容检查
-
所有页面的占位文案（Lorem ipsum、示例文字）已替换
-
示例图片已换成真实图片
-
联系方式、地址、电话准确
-
没有错别字
功能检查
-
导航栏各链接都能正常跳转
-
表单能正常提交
-
按钮点击有正确响应
-
图片都能正常加载
移动端检查
-
手机上文字大小合适，不需要放大才能看清
-
图片不变形、不溢出
-
按钮足够大，容易点击
-
导航菜单在手机上可正常展开
-
没有内容被遮挡
建议：移动端检查务必做。多数访客通过手机访问，而移动端问题在电脑预览时往往不明显。
二、可视化编辑器
进入编辑
站点顶部导航栏 → 编辑。进入后顶部会显示「编辑中」状态。
退出：点击「退出编辑」。
编辑器能做什么
编辑器是一个功能完整的富文本编辑器，可直接修改页面上的文字和图片。
核心价值：这些操作完全不消耗灵感值，且即时生效（保存后）。
三、编辑器功能详解
基础操作
| 功能 | 说明 |
|---|---|
| 撤销 | 回退上一步操作 |
| 重做 | 恢复被撤销的操作 |
| 保存 | 保存修改。成功提示「保存成功」 |
提示：改动较多时建议分几次保存，避免一次性丢失。
文字格式
| 功能 | 说明 |
|---|---|
| 加粗 / 去掉加粗 | 强调重点 |
| 斜体 / 去掉斜体 | 引用、术语 |
| 下划线 / 去掉下划线 | 强调 |
| 删除线 | 表示废弃内容，如原价 |
| 文字颜色 | 支持调色板 + 「更多颜色...」自定义；可「清除」恢复默认 |
| 字号 | 可调整大小，默认值为「默认」 |
段落与标题
| 块类型 | 用途 |
|---|---|
| 正文 | 常规段落 |
| 标题 1 ~ 标题 6 | 六级标题层级 |
| 引文 | 引用内容，通常有特殊样式 |
通过「选择块类型」切换。
SEO 建议：标题层级要合理使用——每页应有且仅有一个标题1（页面主标题），下级内容依次用标题2、标题3。不要为了视觉效果而跳级使用（如从标题1直接跳到标题4），这会影响搜索引擎对页面结构的理解。
对齐方式
-
左对齐（正文默认，可读性最好）
-
居中对齐（适合标题、短语）
-
右对齐（特殊排版需求）
列表
| 类型 | 用途 |
|---|---|
| 无序列表 | 并列的要点 |
| 有序列表 | 有先后顺序的步骤 |
| 检查清单 | 待办项、功能对照表 |
插入元素
| 元素 | 说明 |
|---|---|
| 插入图片 | 从素材库选择或上传新图片 |
| 插入表格 | 支持添加行/删除行/添加列/删除列/合并单元格 |
| 创建链接 | 需输入 URL |
| 插入分割线 | 分隔内容区块 |
| 插入代码块 | 可选择代码块语言；支持行内代码；可删除代码块 |
表格操作
插入表格后可进行：
-
添加行 / 删除行
-
添加列 / 删除列
-
合并单元格
内容长度限制
单个内容块最长 50000 字。超出会提示：
内容过长（N 字），请控制在 50000 字以内
正常使用不会触及此限制。若确实需要超长内容，建议拆分成多个段落或多个页面。
四、替换图片
操作方式
-
点击要替换的图片位置
-
使用「插入图片」功能
-
选择图片来源：
-
从素材库中选择已有图片
-
本地上传新图片
-
使用 AI 生成图片（此项消耗灵感值）
-
图片使用建议
| 建议 | 原因 |
|---|---|
| 上传前压缩图片 | 减小体积，加快加载速度，节省存储空间 |
| 尺寸与展示位置匹配 | 避免上传 4000px 大图用在 300px 的位置 |
| 保持同组图片比例一致 | 产品列表中图片比例不一会导致排版错乱 |
| 优先用素材库已有图 | 避免重复上传占用空间 |
素材管理详见后台「素材管理」。
五、注意事项
未保存提醒
离开编辑器时若有未保存的改动，会提示：
修改内容尚未保存，是否确认关闭
或在跳转时提示：
您当前有未保存的改动，跳转将丢失这些修改，是否继续？
请务必先保存再离开，否则改动会丢失。
编辑后必须发布
⚠️ 这是最容易被忽略的一点：
编辑器中的保存，只是保存到设计稿。访客看到的是线上版本，两者不同。
编辑器修改 → 保存 → （访客还看不到）→ 点击"发布" → 访客看到新内容
编辑保存后，站点顶部会提示：
应用有修改，点击更新即可发布最新内容
看到这个提示，说明需要点击「发布网站」才能让访客看到修改。
保存失败
若提示「保存失败，请稍后重试」：
-
检查网络连接
-
稍等几秒后重试
-
若持续失败，先复制您修改的文字内容到别处备份，刷新页面后重新操作