Elementor 添加幻灯片(轮播图)方法

在建设公司官网时,幻灯片是我们经常会用到的模块,可以用来展示公司形象或者产品图片,之前我们通常会用主题自带的轮播图功能或专门的幻灯片,但如果你的网站已经安装了Elementor Pro的话,可能就不需要使用这些工具了,因为Elementor就自带了一个非常好用的幻灯片功能,在本文中来分享下如何使用它

首先我们点击 + 按钮,添加一个单栏的结构

1589197541-aa59217d02d2125

然后将Slides模块拖动到编辑器中

1589197542-cb71ed97a343c3b

立即你就会看到,幻灯片已经有了基本的样式

1589197543-b7725c1e76fb0ab

可以看到在左侧已经有三个默认的轮播,我们可以直接在其基础上修改

首先是修改文字,你可以点击Content按钮进入文字修改界面,包括幻灯片上的标题、副标题、按钮、链接地址,都可以在这里修改

1589197545-197af3c05a0d1b0

如果你不需要某一个项目,将其设置为空即可

比如不需要按钮,将Button Text设置为空就行了,你可以将所有的内容都清空,仅显示背景

1589197546-1dbbfe9a48a9300

在Background界面,可以修改每个幻灯片的背景颜色,上传自定义背景图片,甚至还可以为图片添加滤镜特效和放大动画

1589197548-a5d5750f0e434fb

Slider Options中,是一些控制的选项,包括控制节点是使用箭头、圆点、还是都使用,幻灯片的自动切换,文字的动画效果等

这里有一个技巧就是制作时,你可以把自动播放关闭,避免动画的干扰,等到发布时再把开关打开

1589197549-443339ff703dfbd

设置完内容中的选项,幻灯片的主要内容就设置完毕了

接下来你可以打开样式面板,对各处细节和样式设置,比如调整文字排版、设置按钮样式、调整元素间的距离等

1589197551-d03a1c6d9f567b6

Elementor中的幻灯片模块虽然并没有一些专业的幻灯片插件那样拥有漂亮的特效和强大的功能,但是重在容易使用而且轻量,无论是个人博客还是企业站点,都适合使用

免责申明:
1. 本站所有教程、文章或资源分享目的仅供大家学习和交流,可进群讨论!
2. 如有无法查看或链接失效,烦请报告联系管理员处理!
3. 本站无法保证资源或其时效性,恕不接受任何提问。
4. 欢迎大家帮助本站出力,赞助费用仅维持本站的日常运营所需!故不接受任何形式的退款。
5. 搜5G网无法保证文章教程或资源的完善与安全,请自行检测解决。
6. 在本站下载的源码严禁杜绝任何形式的正式商业用途,请去程序官方购买。
本站资源素材仅提供学习的平台,所有资料均来自于网络,版权归原创者所有!本站不提供任何保证,并不承担任何法律责任,如果对您的版权或者利益造成损害,请提供相应的资质证明,我们将于3个工作日内予以删除。本作品采用BY-NC-SA 4.0 《国际知识共享署名许可协议4.0》 进行许可 。
本站所有图片素材均享自由版权下创作共用CC0协议。
搜5G资源网,5G资源网 » Elementor 添加幻灯片(轮播图)方法

发表评论

搜5G网永久会员限时优惠中,不限下载,免费更新

立即查看 了解详情