背景滑块

一个英雄图像说了一件事,旋转您最好的三四张照片的英雄背景说的要多得多,而无需在布局中添加单个小部件。 背景滑块 扩展于 Elementor 的主插件 1段的静态背景替换成图像幻灯片:挑选照片,挑选过渡,内容位于顶部,而背景在它后面循环。

这是演示版中完成的英雄,骑着自行车浏览三张带有漩涡过渡的照片:

背景滑块扩展的作用 #

启用后,容器和部分将获得 a 背景滑块 他们的面板 风格 tab, 在常规背景部分旁边。将其翻转, 从媒体库中添加图像, 并且该部分背景成为定时幻灯片。关于它的一切都是可配置的:

• 添加图片: 保存幻灯片的图库字段,在标准 WordPress 图库编辑器中重新排序或删除它们。
• 过渡: 幻灯片之间有 20 多种效果,包括淡入淡出、四个方向的幻灯片、放大和缩小、漩涡、燃烧、模糊和闪光,其中大多数都有第二种变体。
• 动画: 肯·伯恩斯 (Ken Burns) 在每张幻灯片上以多个方向或随机方式进行运动。
• 定制覆盖层: 幻灯片上的颜色、渐变或图像层,以及九种保持文本可读的预设覆盖样式。
• 延迟和计时器: 5000ms的演示中,每张幻灯片保持多长时间,以及旋转是否在计时器上运行。
• 随机显示、图像分辨率、封面: 洗牌顺序、选择加载的大小并控制图像如何填充该部分。

在开始之前 #

• 文字出版社 与 元素 已安装并处于活动状态。
• Elementor 的主插件 已安装并处于活动状态。插件新增?关注 安装指南 首先。
• 背景滑块是一个免费扩展,因此不需要专业版许可证。
• 两个或多个图像的尺寸适合全宽显示,尺寸非常相似。

如何启用背景滑块扩展 #

从您的 WordPress 仪表板,转到 主插件 并打开 扩展 tab。背景滑块坐在 动画小部件 群,旁边 动画渐变 BG。单击其切换使其变为紫色,然后点击 保存更改 并等待绿色“设置保存成功”通知。

打开面板并添加图像 #

在 Elementor 编辑器中选择英雄容器并打开 风格 选项卡。展开 背景滑块 带有紫色 MA 徽章和开关的部分 启用背景滑块 到是。出现了完整的设置列表,并带有 申请 顶部按钮用于将更改推送到预览。

单击 添加图像 片(slides),并从媒体库中挑选,演示使用三张服务照片,图库编辑器处理订单:拖动重新排列,点击X掉落一张,或者添加到图库中获取更多。

选择过渡和运动 #

的 过渡 dropdown决定一个幻灯片如何切换到下一个列表运行很长:淡入淡出,向左滑动,向右滑动,向上滑动,向下滑动,放大和缩小,向左和向右旋转,燃烧,模糊和闪光,大多数在两个变体中演示登陆 向左旋转.

的 动画 setting在每张幻灯片内部添加肯 · 伯恩斯的移动,一个缓慢的平移和变焦,使背景在过渡之间保持活力选择一个方向或将其设置为 随机 让每张幻灯片都以自己的方式漂移。

覆盖、延迟和计时器 #

忙碌照片上的白文本需要帮助。转动 自定义叠加 要显示并在幻灯片上放置颜色、渐变或图像,或选择九个预设之一 叠加 为可读性而构建的具有图案的样式。在下面, 延迟 设置每张幻灯片保存多少毫秒(演示中为 5000), 定时器 保持旋转自动,并且 盖 使图像从边到边填充截面。

页面上的结果 #

Publish,英雄自行循环,与此页顶部的GIF完全相同:每张照片都保留延迟,旋转到下一张照片中,标题和按钮保持固定在顶部,访问者可以获得一个移动的背景,没有单独的滑块小部件,下面的部分结构永远不会改变。

背景滑块工作良好 #

• 英雄部分。 旋转三张强力照片,而不是将第一印象押在一张上。
• 服务业务。 在一个标题后面展示团队的工作情况。
• 餐厅和场馆。 菜肴和室内装饰在预订按钮后面骑自行车。
• 投资组合。 最近的项目作为介绍部分的背景。
• 着陆页。 产品角度在固定号召性用语后面旋转。

视频教程 #

观看滑块首尾相连,从启用扩展到已发布页面上的自行车英雄。

常见问题 #

包裹起来 #

Background Slider 扩展将一个部分背景变成一个幻灯片,只需一个切换和少量选择:图像、过渡、叠加、延迟,内容保持原位,背景完成工作,并且没有额外的滑块小部件进入布局,对于没有照片的运动, 动画渐变背景扩展 覆盖同一部分,改为颜色,以及全套 主插件小部件和扩展 距离一页之遥。