SVG排版教程 | i排版的「自定义海报」教你像H5一样DIY海报！
之前直播分享给大家女神节交互图文，想学更多知识的同学们可以点击预约下周三直播——招聘案例分享。
今天这篇文字教程，
总结了之前直播的操作要点，
以i排版的案例为例：
点此查看原文案例：iPaiban Pro 1周年重磅更新，图文里也能DIY海报，像H5一样！
拆解
「自定义海报」效果可以让用户在微信文章中选择自己喜欢的元素生成海报，除了海报其实还用作变装、生成头像等创意，具体玩法就看大家的脑洞啦。
????????原文动图演示????????
制作
1、添加组件：自定义海报（11108），按顺序分别点击右边第一个换图按钮，上传海报展示区+下面三排按钮整体尺寸的图片。
步骤演示：
2、点击右边第二个换图按钮，这里上传展示区的背景图。
步骤演示：
3、分别上传3排按钮图片。按钮图片有且只能3排，不能多也不能少，每一排按钮选项数没有限制，不局限于3个。
步骤演示：
4、分别上传每排按钮点击后出现的对应元素，注意这里素材的尺寸要和整体交互的尺寸一致，显示元素以外的地方为透明底。
步骤演示：
5、依次点击左侧组件位的“显示触发区域”，分别调整三排按钮的触发区域（注意这里设置触发区域时不要超出图片本身的范围），设置完毕后，点击「保存设置并退出」，最后隐藏触发区域。
6、点击右侧“预览草稿”，可初步预览草稿效果（以导入公众号后台预览效果为准）。
导入公众号后台
7、在iPaiban Pro编辑器后台完成SVG交互图文后，点击右侧“导入微信后台”→点击“复制”；
8、打开微信公众号后台新建图文，点击浏览器右上角iPaiban Pro 小助手图标→点击“导入代码”→粘贴代码→点击“清空导入”；
9、操作成功后，记得添加标题、封面和保存，最后发送到手机预览最终的效果。
本文系作者授权数英发表，内容为作者独立观点，不代表数英立场。
转载请在文章开头和结尾显眼处标注：作者、出处和链接。不按规范转载侵权必究。
转载请在文章开头和结尾显眼处标注：作者、出处和链接。不按规范转载侵权必究。
本文系作者授权数英发表，内容为作者独立观点，不代表数英立场。
未经授权严禁转载，授权事宜请联系作者本人，侵权必究。
未经授权严禁转载，授权事宜请联系作者本人，侵权必究。
本内容为作者独立观点，不代表数英立场。
本文禁止转载，侵权必究。
本文禁止转载，侵权必究。
本文系数英原创，未经允许不得转载。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权，侵权必究。
授权事宜请至数英微信公众号(ID: digitaling) 后台授权，侵权必究。
评论
评论
推荐评论
暂无评论哦，快来评论一下吧！
全部评论（0条）