主要外卖
- Elementor 切换按钮可以表示三件事:打开和关闭文本的标题、扩展段落的 Read More 链接,或者将一个部分交换为另一个部分的开关。
- Elementor 4.3 将旧的 Toggle 小部件隐藏在小部件面板中,而 Accordion 小部件现在通过 Max Items Expanded 设置覆盖它,该设置有两个选项:一和多个。
- Elementor 中的"阅读更多"切换是一个包含单个项目的手风琴小部件,默认状态设置为"全部"折叠,因此额外的文本将保持关闭状态,直到访问者单击。
- Elementor 和 Elementor Pro 没有在两个内容块之间切换的小部件,因此每月和每年的样式切换按钮需要附加小部件或嵌套选项卡。
- Master Addons Toggle Content 小部件是一个 Pro 小部件,它将切换按钮放在两个或多个选项上方,每个选项都保存文本或保存的 Elementor 模板。
Elementor 切换按钮可以通过三种方式创建,正确的取决于按钮应该做什么,要打开和关闭文本,请使用 Accordion 小部件 要扩展长段落,请使用一件手风琴作为 Read More 切换。要将一块内容交换为另一块内容,例如每年的每月价格,请使用 a 内容切换小部件.
本指南以精确的设置浏览了所有三个。每个屏幕截图都来自测试站点上的 Elementor 4.3,因此面板与您今天看到的内容相匹配。
目录
Elementor 中切换按钮的含义
钮(toggle button)是任何一个在点击时在两种状态之间翻转的控制,在Elementor中,人们使用这个短语来做三个不同的作业,每个作业都有自己的小部件。
| 你想要什么 | 它叫什么 | 要使用的小部件 |
|---|---|---|
| 击标题,它下面的文字打开。再点击,它就关闭了。 | 切换或手风琴 | 元素手风琴 |
| 显示简短的介绍并将其余部分隐藏在"阅读更多"链接后面 | 阅读更多切换 | 元素手风琴与一项 |
| 翻转开关,一个部分被另一个部分替换 | 内容切换或内容切换器 | 主插件 切换内容或嵌套选项卡 |
Elementor 4.3中搜索小部件面板中的“toggle”, 则不会找到名为Toggle的小部件。Elementor显示用于该搜索的选项卡和手风琴,如果您有Master Addons Pro,则还会显示Toggle内容。
方式 1:打开和关闭文本的切换
当切换应该打开和关闭文本块时使用 Accordion 小部件,如常见问题解答。旧的 Toggle 小部件让多个项目同时保持打开状态,而 Accordion 小部件现在通过一个设置执行相同的操作。
- 使用 Elementor 编辑您的页面,搜索小部件面板 手风琴 并将其拖到页面上。
- 单击每个项目并键入其标题。然后单击项目内部并为内容添加文本编辑器小部件或任何其他小部件。
- 打开 互动 "内容"选项卡中的部分。
- 套 最大项目已扩展 到 多个。现在每个项目都自行打开和关闭,这是经典的切换行为。
- 套 默认状态 到 都崩溃了 如果每个项目都应该开始关闭,或者将其保留在"首先展开"。
One 上展开了 Max Items,打开一个项目关闭了它前面的那个,有了 Multiple,访问者可以保持打开两个或三个答案,并进行比较。
小部件的布局部分有一个 常见问题解答架构 switch。item为真题真题及答案时开启,更多标题样式及图标,the 高级手风琴小部件 来自 Master Addons 的替代方案。
方式 2:阅读更多切换
A Read More 切换是一个带有一项的手风琴,访问者看到开场白,点击 Read more,其余的文字出现在下面。
- 添加文本编辑器小部件以及文本中应始终显示的部分。
- 拖动一个 手风琴 小部件就在它下面。
- 删除额外的项目,只剩下一个,然后重命名 阅读更多.
- 将剩余文本放入该项目中。
- 在 互动,设置 默认状态 到 都崩溃了.
- 在样式选项卡中,如果您希望链接与上面的段落齐平,请删除边框和填充。
Elementor还有一个小部件叫做阅读更多,它做的工作不同,它标记了一个帖子的摘录在存档页面上的结束位置,与WordPress More标签相同,它不会扩展或崩溃任何东西,作为 元素人的文档 解释。
方式 3:交换内容的切换开关
单击按钮时使用内容切换应将一个块替换为另一个块。Elementor 和 Elementor Pro 都没有此小部件,因此您需要一个插件或使用 Tabs 进行解决。
以下步骤使用 Master Addons Pro 的 Toggle Content。
- 使用 Elementor 编辑您的页面,搜索 切换内容 zhi并拖到位,它从两条开始,标签一,标签二。
- 在 元素 list, 点击第一个项目并键入它 标签例如对于团队。
- 离开 类型 content 上,并在编辑器中为该选项编写文本,要显示完整的布局,请将 Type 设置为模板并选择已保存的模板。
- 对第二项也做同样的事情。点击 添加项目 如果您需要第三个选项。
- 打开 切换设置. 活跃指数 决定哪个选项首先显示,以及 位置 将开关放在内容之前或之后。
- 在"样式"选项卡中,选择"圆形"或"方形"进行切换,然后设置指示器和标签颜色。
Zui常见的用途是计费开关,每个选项都持有一组计价卡,Tougle按钮在它们之间移动。
想看看它有效吗? 的 切换内容小部件页面 您可以单击十个实时演示,从计费开关到规格表。
如果您不需要插件,请在页面上掉落一个选项卡小部件,并命名每个选项卡和年度两个选项卡。 Elementor 4.3 中的选项卡接受每个选项卡内的任何小部件。您将获取选项卡标题代替滑动开关,并且内容以相同的方式交换。
您应该使用哪个切换按钮?
按单击后发生的情况选择小部件。
| 情况 | 用 | 为什么 |
|---|---|---|
| FAQ,有很多问题 | 手风琴,最大项目扩展为一 | 该页面保持较短,因为只有一个答案是开放的 |
| 产品详细信息参观者比较 | 手风琴,最多项目扩展到多个 | 多个面板可以一起保持打开状态 |
| 长 关于文本 | 单项手风琴,了解更多 | 介绍显示,其余部分等待点击 |
| 月度和年度价格 | 切换内容 | 一组替换同一空间中的另一组 |
| 两个观众,一个部分 | 切换内容 | 每个访客都会选择为他们编写的版本 |
| 四个或更多等重部分 | 选项卡 | Tab标题比长开关更容易扫描 |
常见的切换按钮问题
Elementor 中的切换最常出现三个问题。
- Toggle 小部件不见了,元素者将它隐藏在当前版本的面板中,使用最大项目扩展设置为多重的手风琴。
- Toggle 在页面加载中打开,在手风琴小部件中,将默认状态设置为全部崩溃,在 Toggle 内容中,总是显示一个选项,由 Active Index 决定哪个。
- 单击开关什么也不做。检查每个选项是否有内容。设置为模板且未选择模板的选项显示空区域。
如果您需要仅为某些访问者(例如登录用户)显示内容,则切换是错误的工具。那是一项工作 elementor 中的显示条件的,它决定在访问者点击任何内容之前加载什么。
常见问题
如何在 Elementor 中添加切换按钮?
Accordion 小部件拖到页面上,以便进行一个打开和关闭文本的切换,并在交互部分设置最大项目扩展为多个 对于在两个部分之间切换的切换按钮,添加一个内容切换小部件,例如主插件切换内容,并给每个选项自己的内容。
Elementor 中的 Toggle 小部件在哪里?
Elementor 4.3 不再在小部件面板中显示 Toggle 小部件 搜索“toggle”返回手风琴和选项卡 手风琴小部件涵盖了相同的工作:将最大项目扩展到多个,并且几个项目可以保持打开状态,这就是 Toggle 小部件的行为方式。
Elementor 中拨动器和手风琴有什么区别?
在手风琴中,打开一个项目会关闭其他项目。在切换中,每个项目都会自行打开和关闭,因此可以一起打开几个项目。在当前的 Elementor 版本中,两个项目都是相同的手风琴小部件,并且 Max Items Expanded 设置在两种行为之间切换。
我可以默认打开 Elementor 切换吗?
是。在手风琴小部件中,将默认状态设置为"首先展开,并在页面加载时打开第一个项目。在"切换内容小部件中,将"活动索引设置为应首先显示的选项的编号,第一个项目为1。
Elementor Pro 有用于定价的切换开关吗?
No。Elementor Pro 有一个价格表小部件,但没有交换月度和年度表的交换机,您可以将表放在 Tabs 内,或者使用内容从附加组件切换小部件,并将每组价格作为一种选择加载。
最后的想法
Elementor 切换按钮是三件事之一,并且每个事物都有一个清晰的家,使用手风琴小部件及其最大项目展开设置打开和关闭文本。从一个单项手风琴构建一个 Read More 切换。在两个部分之间切换,并进行内容切换。
对于第三种, 切换内容小部件 在每个选项中处理文本和保存的模板,并且 Master Addons Pro 计划 列出它还附带什么。
相关阅读
