i 排版多平台同步功能怎么用？SVG 交互图文定制全攻略

? i 排版多平台同步功能怎么用？SVG 交互图文定制全攻略

? 多平台同步功能操作指南

? 授权微信公众号步骤

1. 打开 i 排版首页，点击 “我的文章” 进入编辑区。
2. 点击 “保存同步”，再点击 “授权微信公众号”。
3. 进入授权页面，按下 “点击开始微信公众号授权”。
4. 公众号绑定的管理员微信扫码确认，授权完成后即绑定成功。

? 手机版多平台同步

? SVG 交互图文定制全解析

?️ 自由滑动效果制作

1. 登录 iPaiban Pro 黑科技编辑器，点击左侧 “组件” 按钮，在 “滑动” - “自由滑动” 分类中找到 “自由滑动（三列）” 组件，或者直接搜索组件编号 11613 选择。
2. 上传图片素材。该效果滑动范围由第一张滑动图决定，组件要求所有滑动图尺寸一致。如需上传背景图，背景图尺寸也应与滑动图一致。
3. 点击最右侧 “预览草稿” 预览效果，满意后点击 “同步至微信后台” 就可以了。

? 无缝拼接与点击切换

1. 注册登录 iPaiban Pro 黑科技编辑器，领取新手礼包，礼包中有常用必备组件。
2. 点击编辑器左侧 “组件” 按钮，在 “无缝图” 中点击选择 “无缝图（不可弹出）” 组件，上传自己的图片。
3. 在 “组件” 中找到 “滑动” 分类，选择 “普通滑动 - 左滑” 组件，上传滑动图片。
4. 在 “组件” 中找到 “点击” 分类，选择 “点击 - 切换图片” 组件，分别上传点击前和点击后的图片，还可以任意设置图片切换的时间。

? 视频无缝拼接

1. 在 “组件” 中找到 “视频” 分类，选择 “视频 - 无缝拼接” 组件。
2. 获取视频的 data - mpvid，并把它粘贴到右侧输入框中。视频的 data - mpvid 要在公众号后台获取，编辑器中有详细的视频获取教程。
3. 重复无缝图拼接步骤，最后预览无误后点击 “导入微信后台” 将图文代码导入公众号。

? 提升 SVG 交互图文效果的小技巧

1. 背景图处理：自由滑动效果为固宽设计，在大屏幕手机上可能会显得比其他交互的图片窄。纯色背景图的边缘颜色应与滑动图统一，非纯色背景图则建议使用透明底，这样可以避免两侧露出的背景图影响效果。
2. 文字插入：你可以使用 “图文引用” 组件引入其他草稿内容，或者借助 i 排版图文编辑器先完成文字排版，再导入 SVG 内容。另外，iPaiban Pro 小助手插件的 “局部导入” 功能也能帮助你将文字与 SVG 内容结合。
3. 兼容性优化：不同移动设备和浏览器对 SVG 的支持程度不同。你可以使用浏览器兼容性库或媒体查询来针对不同设备提供备用的图像格式，如 PNG 或 JPEG。同时，优化 SVG 图像，减少节点数量、合并路径、使用简化的形状等，能提升在移动设备上的性能。

? 选择适合的 i 排版版本

? 总结