一个英雄图像说了一件事,旋转您最好的三四张照片的英雄背景说的要多得多,而无需在布局中添加单个小部件。 背景滑块扩展 在 Elementor 的主插件 1段的静态背景替换成图像幻灯片:挑选照片,挑选过渡,内容位于顶部,而背景在它后面循环。
这是演示版中完成的英雄,骑着自行车浏览三张带有漩涡过渡的照片:
背景滑块扩展的作用 #
启用后,容器、部分和列将获得 a 背景滑块 他们的面板 风格 tab, 在常规背景部分旁边。将其翻转, 从媒体库中添加图像, 并且该部分背景成为定时幻灯片。关于它的一切都是可配置的:
- 添加图片: 保存幻灯片的图库字段,在标准 WordPress 图库编辑器中重新排序或删除它们。
- 过渡: 幻灯片之间的 24 种效果加上随机:淡入淡出、四个方向的幻灯片、放大和缩小、漩涡、燃烧、模糊和闪光,每种效果都有第二个变体。
- 动画: 肯·伯恩斯 (Ken Burns) 在每张幻灯片上以九个方向、随机或无方向进行运动。
- 定制覆盖层: 幻灯片上的颜色、渐变或图像层,以及九种保持文本可读的预设覆盖样式。
- 延迟和计时器: 片(默认情况下为 5000ms)保存多长时间,以及是否有一个细进度条显示每张幻灯片上剩余的时间。
- 随机显示、图像分辨率、封面: 生成页面时洗牌顺序,选择加载的大小,并控制图像如何填充该部分。
在开始之前 #
- 文字出版社 与 元素 已安装并处于活动状态。
- Elementor 的主插件 已安装并处于活动状态。插件新增?关注 安装指南 首先。
- 背景滑块是一个免费扩展,因此不需要专业版许可证。
- 两个或多个图像的尺寸适合全宽显示,尺寸非常相似。
如何启用背景滑块扩展 #
从您的 WordPress 仪表板,转到 主插件 并打开 扩展 tab。背景滑块坐在 动画小部件 群,旁边 动画渐变 BG (Pro)。点击它的切换,这样它就会变成紫色,然后点击 保存更改 并等待绿色“设置保存成功”通知。
打开面板并添加图像 #
在 Elementor 编辑器中选择英雄容器并打开 风格 选项卡。展开 背景滑块 带有紫色 MA 徽章和开关的部分 启用背景滑块 到是。出现了完整的设置列表,并带有 申请 顶部按钮用于将更改推送到预览。
单击 添加图像 片(slides),并从媒体库中挑选,演示使用三张服务照片,图库编辑器处理订单:拖动重新排列,点击X掉落一张,或者添加到图库中获取更多。
选择过渡和运动 #
的 过渡 dropdown决定一个幻灯片如何切换到下一个列表运行很长:淡入淡出,向左滑动,向右滑动,向上滑动,向下滑动,放大和缩小,向左和向右旋转,燃烧,模糊和闪光,每个演示在两个变体上着陆 向左旋转.
的 动画 setting在每张幻灯片内部添加肯 · 伯恩斯的移动,一个缓慢的平移和变焦,使背景在过渡之间保持活力选择一个方向或将其设置为 随机 让每张幻灯片都以自己的方式漂移。
覆盖、延迟和计时器 #
忙碌照片上的白文本需要帮助。转动 自定义叠加 要显示并在幻灯片上放置颜色、渐变或图像,或选择九个预设之一 叠加 为可读性而构建的具有图案的样式。在下面, 延迟 设置每张幻灯片保存多少毫秒(演示中为 5000), 定时器 显示每个幻灯片的进度条(幻灯片以任一方式旋转),并且 盖 使图像从边到边填充截面。
页面上的结果 #
Publish,英雄自行循环,与此页顶部的GIF完全相同:每张照片都保留延迟,旋转到下一张照片中,标题和按钮保持固定在顶部,访问者可以获得一个移动的背景,没有单独的滑块小部件,下面的部分结构永远不会改变。
背景滑块工作良好 #
- 英雄部分。 旋转三张强力照片,而不是将第一印象押在一张上。
- 服务业务。 在一个标题后面展示团队的工作情况。
- 餐厅和场馆。 菜肴和室内装饰在预订按钮后面骑自行车。
- 投资组合。 最近的项目作为介绍部分的背景。
- 着陆页。 产品角度在固定号召性用语后面旋转。
视频教程 #
观看滑块首尾相连,从启用扩展到已发布页面上的自行车英雄。
常见问题 #
如何将背景幻灯片添加到 Elementor 部分?
Master Addons Extensions 选项卡中启用背景滑块扩展, 选择该部分, 然后在样式选项卡中打开背景滑块, 打开它, 添加两个或多个图像, 选择一个过渡, 并且该部分背景会自动循环。
包括哪些过渡效果?
24加随机:淡入淡出、向左滑动、向右滑动、向上滑动、向下滑动、放大缩小、向左旋转、向右滑动、燃烧、模煳和闪光,每个都有第二个变体。一个单独的动画设置在每个幻灯片内部添加了肯 · 伯恩斯(Ken Burns)的平移和缩放运动。
我可以在照片上保持文本可读性吗?
是打开自定义覆盖,以获取幻灯片上方的颜色、渐变或图像层,或者选择九种预设覆盖样式之一。演示使用深色覆盖,因此白色标题和按钮在每张幻灯片上都保持对比度。
如何控制滑动速度?
Delay 字段设置每张幻灯片保持可见多少毫秒,默认情况下为 5000。Timer 只显示进度条,因为幻灯片任一方式都自行旋转。Random Display 每次生成页面时都会对幻灯片顺序进行洗牌,因此在缓存页面上,只有当缓存清除时,顺序才会发生变化。
背景滑块扩展是免费的吗?
是的。背景滑块附带了 Elementor 的 Master Addons 免费版本,在扩展选项卡的动画小部件组中。定价页面涵盖了 Pro 计划添加的内容。
Elementor 有自己的背景幻灯片吗?
是的。Free Elementor 具有幻灯片背景类型,有五个转换,Ken Burns 放大或缩小,懒负载和每设备定位。背景滑块添加 24 个转换,Ken Burns 在九个方向上,图案叠加,随机顺序和计时器栏。产品页面有完整的比较表。
包裹起来 #
的 背景滑块扩展 将一个部分背景变成一个幻灯片,只需切换一遍,选择很少:图像、过渡、叠加、延迟。内容保持原位,背景完成工作,并且没有额外的滑块小部件进入布局。对于没有照片的运动, 动画渐变背景扩展 (Pro)以颜色代替覆盖同一部分,以及全套 主插件小部件和扩展 距离一页之遥。
