账号
自定义版式使用指南
📖 目录
功能简介
自定义版式功能允许您创建个性化的字帖版式，完全按照您的需求设计页面布局。您可以：
- 🎨 自由设计布局：通过拖拽方式自由安排各个内容区域的位置
- 📐 灵活调整尺寸：支持多种标准纸张尺寸，也支持自定义尺寸
- 🖼️ 添加背景图片：为您的字帖添加精美的背景图案
- ✏️ 自定义内容块：添加标题、水印、内容区域等多种类型的块
- 💾 保存和复用：保存您的设计，随时可以编辑和复用
快速开始
创建新版式
- 进入"自定义版式"页面
- 点击"新建版式"按钮
- 系统会自动创建一个默认的版式模板
进入新建页面：
保存版式
- 完成设计后，点击页面底部的"保存版式"按钮
- 输入版式名称（必填）
- 可选填写版式描述
- 点击"确定"完成保存
界面介绍
整体布局
编辑器界面分为三个主要区域：
1. 基本信息区（顶部）
位于页面顶部，包含：
- 页面尺寸设置：选择纸张大小或自定义尺寸
- 版式名称：为您的版式起一个便于识别的名称
- 版式描述：简要说明版式的用途或特点
2. 设计区（左侧）
这是您的主要工作区域：
- 工具栏：包含添加各种块的快捷按钮
- 画布：显示版式的实际效果，可以实时预览
- 操作提示：显示基本操作说明
3. 选项区（右侧）
用于设置和调整各个元素的参数：
- 背景图片设置：上传和管理背景图片
- 块参数设置：调整选中块的各项属性
基本操作
添加块
编辑器支持添加四种类型的块：
1. 内容块（绿色按钮）
- 用途：这是字帖的主要内容区域，用于放置文字内容
- 数量限制：最多可添加 5 个内容块
- 默认位置：添加时自动居中放置
2. 标题块（蓝色按钮）
- 用途：用于显示版式的标题文字
- 数量限制：每个版式只能有 1 个标题块
- 默认位置：添加时位于页面顶部
3. 水印块（橙色按钮）
- 用途：用于显示水印文字（如版权信息、日期等）
- 数量限制：每个版式只能有 1 个水印块
- 默认位置：添加时位于页面底部
4. 装饰块（灰色按钮）
- 用途：用于添加装饰性元素或额外的文字区域
- 数量限制：最多可添加 5 个装饰块
- 默认位置：添加时自动居中放置
选中块
- 点击块：在画布上点击任意块即可选中
- 选中效果：选中的块会显示实线边框和高亮效果
- 选项区显示：选中块后，右侧选项区会自动展开对应的参数设置面板
移动块
电脑端操作
- 将鼠标移动到块上
- 按住鼠标左键
- 拖动到目标位置
- 释放鼠标完成移动
手机/平板端操作
- 用手指触摸块
- 按住并拖动到目标位置
- 松开手指完成移动
调整块大小
每个块的右下角都有一个缩放手柄（小方块）：
电脑端操作
- 将鼠标移动到缩放手柄上
- 按住鼠标左键
- 拖动调整大小
- 释放鼠标完成调整
手机/平板端操作
- 用手指触摸缩放手柄
- 按住并拖动调整大小
- 松开手指完成调整
删除块
有两种方式删除块：
选中后删除：
- 先点击选中要删除的块
- 点击工具栏中的红色删除按钮
- 确认删除操作
在选项区删除：
- 选中块后，在右侧选项区展开的参数面板中
- 点击底部的"删除此块"按钮
- 确认删除操作
功能详解
页面尺寸设置
标准尺寸
编辑器提供以下标准纸张尺寸：
- A4：210mm × 297mm（纵向）
- A4横：297mm × 210mm（横向）
- A5：148mm × 210mm（纵向）
- A5横：210mm × 148mm（横向）
- B5：176mm × 250mm（纵向）
- B6：125mm × 176mm（纵向）
选择尺寸后，页面会实时显示当前尺寸信息（红色文字）。
自定义尺寸
如果需要使用非标准尺寸：
- 选择"自定义"选项
- 在输入框中输入尺寸，格式：
宽度*高度- 例如：
210*297表示宽度 210mm，高度 297mm - 支持使用
x或X代替*
- 例如：
- 尺寸范围：宽度和高度需在 80-500mm 之间
- 输入完成后，系统会自动验证并应用
背景图片设置
上传背景图片
- 在右侧选项区找到"背景图片"面板
- 点击"选择图片"按钮
- 从电脑或手机中选择图片文件
- 支持的格式：JPG、PNG
- 文件大小限制：最大 2MB
上传成功后，背景图片会立即显示在设计区的画布上。
背景图片布局设置
点击"布局设置"可以调整背景图片的显示方式：
显示方式：
- 拉伸填满（推荐）：图片会拉伸填满整个页面
- 覆盖填充：保持比例，覆盖整个页面
- 完整显示：保持比例，完整显示图片
- 原始尺寸：按图片原始尺寸显示
对齐位置：
- 居中、顶部、底部、左侧、右侧
重复方式：
- 不重复：图片只显示一次
- 平铺：图片重复填满页面
- 水平重复：只在水平方向重复
- 垂直重复：只在垂直方向重复
移除背景图片
如果需要移除已设置的背景图片：
- 点击"移除背景图片"链接
- 确认移除操作
- 背景图片会被清除
块参数设置
选中任意块后，可以在右侧选项区调整其参数：
标题块和水印块的设置
标题块和水印块支持以下设置：
名称：为块起一个便于识别的名称
字体大小：调整文字大小（5-100）
字体：选择字体样式
- 楷体
- 宋体
- 衡水体（英文）
- 其它...
对齐方式：设置文字对齐方式
- 居左
- 居中
- 居右
宽度和高度：调整块的尺寸（单位：毫米）
位置：调整块在页面中的位置
- 距左：距离页面左边的距离（单位：毫米）
- 距顶：距离页面顶部的距离（单位：毫米）
内容块和装饰块的设置
内容块和装饰块支持以下设置：
- 名称：为块起一个便于识别的名称
- 宽度和高度：调整块的尺寸（单位：毫米）
- 位置：调整块在页面中的位置
- 距左：距离页面左边的距离（单位：毫米）
- 距顶：距离页面顶部的距离（单位：毫米）
精确调整块的位置和大小
除了通过拖拽方式调整，您还可以：
- 选中块
- 在右侧选项区的参数面板中
- 直接输入数值来精确设置：
- 宽度、高度（单位：毫米）
- 距左、距顶（单位：毫米）
这种方式适合需要精确对齐或特定尺寸的场景。
常见问题
Q1: 为什么我无法拖动块？
可能的原因：
- 未选中块：请先点击块选中它
- 浏览器兼容性：建议使用 Chrome、Firefox、Safari 等现代浏览器
- 移动端操作：在手机或平板上，请使用手指触摸并拖动，而不是点击
解决方法：
- 确保块已被选中（显示实线边框）
- 尝试刷新页面
- 检查浏览器是否支持触摸事件
Q2: 背景图片上传失败怎么办？
可能的原因：
- 文件格式不支持：只支持 JPG 和 PNG 格式
- 文件过大：文件大小超过 2MB
- 网络问题：上传过程中网络中断
解决方法：
- 检查图片格式，必要时转换格式
- 压缩图片大小
- 检查网络连接后重试
Q3: 如何删除已保存的版式？
删除版式需要在版式列表页面操作，不在编辑器内删除。
Q4: 可以同时编辑多个版式吗？
不可以，每次只能编辑一个版式。如果需要编辑其他版式，请先保存当前版式，然后选择要编辑的版式。
Q5: 移动端操作有什么注意事项？
- 拖动块：用手指触摸块并拖动，不要快速点击
- 调整大小：缩放手柄在块的右下角，触摸区域已优化，便于操作
- 选中块：轻触块即可选中，不需要长按
- 防止误操作：系统已禁用页面滚动，避免拖动块时触发页面滚动
Q6: 保存后可以继续编辑吗？
可以！保存成功后，您可以：
- 继续编辑：在编辑模式下保存后，会留在当前页面，可以继续修改
- 重新打开：从版式列表中选择已保存的版式，点击编辑即可重新打开
Q7: 自定义尺寸输入有什么要求？
- 格式：必须使用
宽度*高度的格式，例如210*297 - 分隔符：可以使用
*、x或X - 单位：单位为毫米（mm）
- 范围：宽度和高度都必须在 80-500mm 之间
- 示例：
- ✅ 正确：
210*297、210x297、210X297 - ❌ 错误：
210 297（缺少分隔符）、50*50（尺寸过小）
- ✅ 正确：
使用技巧
技巧1：合理规划布局
在开始设计前，建议先规划好：
- 内容区域：确定需要几个内容块，如何排列
- 标题位置：标题块放在顶部还是其他位置
- 水印位置：水印块放在底部还是其他位置
- 整体风格：是否需要背景图片，使用什么风格
技巧2：使用背景图片增强效果
- 选择合适的图片：建议使用简洁、不干扰内容的背景图
- 调整布局设置：根据图片特点选择合适的显示方式
- 注意文件大小：过大的图片会影响加载速度，建议压缩后再上传
技巧3：精确对齐多个块
如果需要多个块精确对齐：
- 先通过拖拽大致定位
- 选中每个块，在参数面板中
- 输入相同的"距左"或"距顶"数值
- 这样可以实现水平或垂直对齐
技巧4：利用内容块数量限制
- 内容块最多5个：适合设计多栏布局
- 装饰块最多5个：可以添加多个装饰元素
- 合理分配：根据实际需求合理分配块的数量
技巧5：保存前预览效果
在保存前，建议：
- 检查所有块的位置是否合适
- 确认背景图片显示效果
- 验证页面尺寸是否正确
- 确认版式名称和描述已填写
这样可以避免保存后才发现问题。
技巧6：移动端设计建议
如果主要在移动端使用：
- 使用较大的块：便于在移动设备上查看和操作
- 简化布局：避免过于复杂的布局
- 测试效果：在不同尺寸的设备上测试效果
总结
自定义版式功能为您提供了强大的版式设计能力，通过本指南，您应该能够：
✅ 创建和保存自定义版式
✅ 添加和管理各种类型的块
✅ 调整块的位置和大小
✅ 设置背景图片
✅ 在电脑和移动设备上使用
如果您在使用过程中遇到任何问题，欢迎查看常见问题部分或联系技术支持。
最后更新： 2026年1月
版本： v2.5.0