“好清凉啊！宝马这篇全是水的图文，怎么做的？”

夏日炎炎，清凉一下！

今天我们来看宝马中国的一篇「全是水」的夏日图文：

 

*素材宝马中国《元气拉满，勿戳》

这篇图文，其实就是水波纹背景加上透明底的 PNG 图片排版而成，虽然没有任何交互效果，但全局的动态背景让整篇图文显得元气满满。

整篇图文的结构大概是这样的：

水波纹图片高度远远小于上方的 PNG 图片，但仍能铺满全文，这里我们通过 iPaiban Pro 黑科技编辑器的「全局背景」组件（编号：10465）即可轻松实现。

「全局背景」组件的图片用作后边组件的背景，当图片高度小于后边组件内容的高度时，图片将会自动按需重复铺满后边内容，常用于图文开头。

下面一起看下详细教程吧。

工具：iPaiban Pro 黑科技编辑器，网址：SVG.iPaiban.com

组件：全局背景

编号：10465（组件）

第1步：选择组件

登录 iPaiban Pro 编辑器后，点击编辑器左侧「组件」按钮，在「全局设置」分类中找到「全局背景」组件，或者直接在搜索框中搜索组件编号10465，点击选择。

第2步：上传背景图片

点击右侧「换图」按钮上传准备好的背景图片。

背景图片尺寸没有要求，当背景图片高度小于后边组件内容的高度时，图片将会自动按需重复铺满后边内容。所以在设计背景图时，背景图应尽量简单些，尤其是在重复拼接时尽量看不出拼接的感觉。

第3步：排版正文内容

上传好背景图片后，我们按照自己的需求，接着在后面正常选择其他组件或组合排版制作正文内容即可。

宝马这篇正文部分为背景透明的无缝图拼接，只需选择一个「批量无缝图」组件（编号：10009），然后上传图片素材。

第4步：导入公众号后台

点击最右侧「预览草稿」扫码预览效果，效果满意后点击「同步至微信后台」就可以了。

使用同步功能可以不用频繁在编辑器和微信后台切换，同步成功后可以立即扫码预览二维码查看。

如需局部导入可参考《iPaiban Pro小助手安装和使用教程》中导入功能的「导入代码」部分。

利用「全局背景」组件，一是可以像宝马这样制作背景铺满全文的创意图文；二是如果我们图文中正文图片的背景简单单一，在开头加一个「全局背景」，可以避免所有因间距造成缝隙，达到全文去缝的效果（点此查看详情）。

制作SVG交互图文认准 iPaiban Pro 黑科技编辑器，网址：SVG.iPaiban.com，复制网址在 PC 端 Chrome（谷歌）浏览器打开，即可注册，编辑器所有组件/组合现已全部支持免费试用了。

新用户在「新手礼包」可领取3天企业标准版会员免费商用，以及22个常用必备组件的大礼包（1年）。随礼包附赠千元优惠券，每单最高立降500元。

● SVG 黑科技交互排版👇🏻

 

如需定制 SVG 黑科技排版，请点此查看定制流程和套餐，低至500元/篇。