一秒get到Apple同款排版效果(高阶篇SVG文章制作方法)

最近有不少小伙伴问我。三儿,最近领导看了Apple推文,也想要同款排版,这该如何是好呀。

image.png


【多图轮播】

你直接报我身份证得了呗


今天三儿来教大家7种玩法

让图片在推文中轮播展示!

省掉图片排版的繁琐步骤

效果酷炫,图片张数还不限

一秒get大厂同款效果

最重要的是操作很!简!单 !














轮播效果展示
















图片轮播


SVG组件ID:35

效果描述:多张图片无限循环的自动切换显示。



·



图片轮播-横向单方向切换


SVG组件ID:69

效果描述:多张图片无限循环,向左或向右轮播。



·


多图弹动轮播(横向)


SVG组件ID:92

效果描述:两图及两图以上的多图弹动式横向自动轮播,可设置轮播图边距、背景图或背景色、滚动方向和动画时长。



·


图片轮播-上下左右切换


SVG组件ID:157

效果描述:图片依次无限循环地向上、下、左、右滚动轮播,图片数量需要是4的倍数。



·
·


图片田字分裂对边移出轮播


SVG组件ID:157

效果描述:多张图片田字分裂对边移出切换,自动播放,可设置顺时针或逆时针播放动画。



·


·

图片横向百叶窗分裂错位移出轮播


SVG组件ID:158

效果描述:多张图片横向百叶窗式分裂切换,自动播放。



·
·

·

·


横向停顿式图片轮播


SVG组件ID:166

效果描述:多张图片无限循环向左轮播或向右轮播,每张图完整显示后会停顿一会再继续播放,播放的快慢可以进行设置。















制作方法
















01 进入SVG编辑器


通过135编辑器左侧入口进入svg编辑器



或者直接在浏览器输入svg编辑器网址进入:

https://www.135editor.com/svgeditor/




02 添加组件


在SVG编辑器中搜索一款轮播组件的ID,或在『轮播』分类下查找组件,将轮播组件添加到编辑区域



鼠标移动到SVG组件上,可以查看SVG的使用教程,也可以扫码预览SVG的具体效果




03 上传图片


在SVG编辑器右侧的配置区域,将需要添加轮播效果的图片上传至组件中。



根据轮播的效果设置开始时间、轮播方向、轮播快慢等参数即可。



04 同步/导出


制作好的SVG文章可以通过使用『同步』或『导出』功能,保存到微信公众号平台(ps:不知道咋同步和导出的胖友,点击按钮,根据提示操作即可)



注意:


如使用导出代码功能,则需根据SVG效果的使用平台(135编辑器/微信后台),选择对应平台的代码进行复制,尽量不要直接粘贴代码,以免效果有误。




以上就是制作轮播图的方法啦

大家赶紧去SVG编辑器里上手试试吧!


什么?你说你领导还有svg高阶定制要求,编辑器样式无法满足。没关系,扫描下方二维码添加客服,你尽管说出你的需求,我们为你实现。



·EN

文章排版由135编辑器提供技术支持

 ■ ■ 

文章申明:本文章转载自互联网公开渠道,如有侵权请联系我们删除
文章评价
登录后可以评论
立即登录
小三儿135主笔
一个酷爱钻研排版的小编!
共606篇文章
最近文章
更多
  • 2023霜降节气海报合集,给你专属秋天的灵感!
  • 寒露节气免费手机海报模板分享
  • 2023中秋节精美海报大放送,尊的都很好看!
  • 不看会后悔系列!2023国庆节精美海报模板分享!
比格设计
热门工具
135编辑器
领先的在线图文编辑平台原创样式素材,一键套用
比格设计
受欢迎的在线作图网站,新媒体配图、手机海报应有尽有
管小助
企业营销、私域流量运营——站式营销管理平台
推荐文章
用户运营平台产品设计指南
浅谈用户运营中的用户分层
内容运营:戴上写作的六顶思考帽
5000字方法论:4个细节,决定私域能不能赚钱
一个案例说明白用户分析怎么用
22条视频,涨粉12.6万,一个女孩子在抖音靠洗车也能月入过万!
高价值社群的5大核心关键
抖音账号内容自检清单!
决定离职后,3天拿到offer的总结与反思!
【135早资讯】:教育部将彻查教材插图问题;抖音6月1日起将对本地生活商家收取服务费
热门素材样式
运营导航
运营工具
分享到