帮助中心在画布中直接编辑作品

在画布中直接编辑作品

生成之后继续打磨:直接改文字、调整选中元素,确认保存,再检查交互和移动端效果。

先选适合的修改方式

想做什么使用入口会发生什么
明确知道要改哪段文字、颜色或间距Edit提交或保存后修改当前 HTML 文件
希望 AI 调整某个具体元素Comment → Send to chat将带元素位置的要求交给 AI
需要圈出区域、画示意或补充视觉说明Mark将截图与标注加入对话

新增区块、调整多页逻辑或重新设计移动端时,适合交给 AI;微调单个元素可以直接编辑。另两种路径见评论与标记反馈。

进入可编辑的画布

  1. 在 Design Files 打开 HTML 作品,切换到 Preview。HTML 幻灯片也使用预览编辑器,具体工具随文件类型而定。
  2. 点击预览工具栏的 Edit,再点击画布中的元素,等待出现选中边框和参数面板。
  3. 检查原型中的按钮、链接和表单之前,先退出 Edit,回到正常预览。编辑时点选元素,与实际使用原型是两种操作。
大范围画布截图:先打开 Design Files 中的 HTML,再切到 Preview,最后找到右上角 Edit。

直接修改文字

  1. 在 Edit 模式点击要修改的文字;普通文字和链接文案可以在画布中编辑。
  2. 输入新内容,按 Enter 提交这次文字修改;Shift+Enter 换行;Escape 取消本次输入。
  3. 回到正常 Preview 检查文案。如果页面用 JavaScript 动态生成文字,还要测试会重新绘制它的操作。
OpenDesign Landing 中的文字输入、上下文参数与 Save 保存位置。

调整元素和布局

选中元素后,参数面板会显示它支持的设置,例如字体、字号、颜色、宽高、间距、边框和圆角。Flex 或 Grid 容器才会出现方向、对齐、Gap 等布局参数。选中链接可调整 Href;选中图片可用 Upload image 替换。并非所有元素都有相同字段。

也可以拖动选中的元素调整位置。修改后检查相邻元素和手机布局,避免只在当前桌面尺寸看起来合适。

参数填写方法与适用范围
Text / Href / Image URL / Alt text文字元素可改文案;链接还可改目标地址;图片可改来源和替代文本。具体字段由所选元素决定。
文字色 / 背景色 / 边框色使用 #262626 这样的十六进制颜色;保存后检查可读性和悬停状态。
Opacity填写 0–1 的数值:0 为透明,1 为不透明;影响所选元素,不只是背景。
字体 / 字号 / 字重 / 行高 / 字间距选择字体与字重后调整字号和字间距。行高可用正数或 px;1.5 表示倍数,24px 表示固定高度。
Width / Height裸数字按 px 处理,宽高可填写百分比。设置固定宽度后,要检查窄屏布局。
Padding / Margin上、右、下、左可分别设置。Padding 是内部留白,Margin 是元素与周围内容的距离;Margin 支持 auto。
边框宽度 / 样式 / 圆角边框宽度要和样式、颜色一起检查;仅填宽度但没有可见样式时,可能看不到变化。Radius 控制圆角。
Direction / Distribution / Gap / Align布局参数需要选中布局容器;普通元素的 Align 控制文字对齐,不会重新排列其父级。

大多数间距字段接受数字或 px,不接受任意 CSS 表达式。值被拒绝时先检查单位和选中对象,不要反复点击保存。空字段可能表示继承或计算样式,不等于数值为零。

分清保存、取消和撤销

操作作用
编辑文字时按 Enter提交当前文字修改
参数面板 Save将当前内容和样式修改写回文件
Cancel / Reset取消或重置当前草稿,不是清空所有已提交修改
编辑器 Undo / Redo撤销或重做已提交的手动修改
Delete element移除选中元素;需要时用 Undo 恢复,并检查关联内容

保存后再验一次

  1. 退出 Edit,重新加载预览,确认修改仍在。
  2. 从视口菜单切换手机尺寸,实际点击主要按钮和表单。
  3. 需要回到较早的 HTML 时使用版本历史。已分享的作品确认无误后,再更新分享链接。

直接修改 HTML 动画不会自动改变已有 MP4。还需要重新渲染,并检查新视频。

切换视口检查保存后的布局;手机预览与完整工具栏同时保留。

选不中元素或保存失败怎么办

先确认打开的是支持编辑的 HTML 预览,而且当前项目有编辑权限;只读共享项目可能允许评论,却不允许编辑。退出再进入 Edit,必要时重新加载文件。若始终没有选中边框或参数面板,可先用 Comment 或 Mark 把修改交给 AI,并在反馈问题时附上客户端版本。没有选中元素或保存结果未确认时,不要只反复点 Save。