定价是访客决定的地方,因此表格必须易于扫描且易于比较。免费的 定价表小部件 在 Elementor 的主插件 构建一个包含标头、价格、功能列表和号召性用语按钮的单一计划,然后并排设置几个以制作完整的定价部分。
您命名计划、设置价格和期限、列出功能,然后添加丝带来标记流行的丝带并设计颜色。没有手工编码的表格。本指南涵盖了小部件中的每个设置。
定价表小部件的作用 #
Widget一次构建一个计划,每个计划都有一个标题,字幕和价格的标题,一个带有复选标记图标的功能列表,一个按钮,以及一个可选的页脚注,将三个连起来,您就可以进行经典的定价比较。
三个选项卡运行它。 内容 保存布局、标题文本、价格、功能和功能区。 风格 处理标头背景、功能和价格颜色以及按钮。 高级 是通常的元素间隔和可见性。
在开始之前 #
- 文字出版社 与 元素 已安装并处于活动状态。
- Elementor 的主插件 已安装并处于活动状态。插件新增?参见 安装指南.
- 您的计划名称、价格、功能列表以及每个按钮应链接的位置。
如何添加定价表小部件 #
在 Elementor 编辑器中,打开 元素 面板和搜索 定价表的,(或)滚动到主插件部分(小部件带有紫色MA徽章)。将其拖到页面上,它加载了一个可以编辑的示例计划。
设置布局 #
打开 内容 选项卡。 定价内容 部分设置整体布局和两个快速切换,其下方是标头、定价、功能、页脚和丝带部分。
- 布局: 五种设计之一:默认、左对齐内容、圆形表、带有 BG 图像或倾斜 BG 模式的表。
- 突出显示表?: 提出这个计划,使其在其他计划中脱颖而出。
- 显示功能?: 显示或隐藏功能列表。
编辑标头 #
打开 标头 plan 名称和标语的部分,这也是您选择标头背景的地方,这正是每个 plan 的颜色。
- 标题 BG 颜色: 3个渐变预设之一,或者自定义在样式选项卡中设置自己的颜色。
- 标题和 HTML 标签: 计划名称及其标题级别。
- 副标题: 标题下的一小行,例如适合单个网站。
设定价格 #
打开 定价 数及其读取方式的部分。您设置货币、金额、计费期限和可选的销售价格。
- 货币符号: 价格前显示的符号,例如 $ 或 € Euro。
- 价格和销售: 该金额,带有销售切换以显示删除原件。
- 时期: 计费周期文本,例如/月或/年。
添加功能 #
打开 特点 section。it是一个中继器,所以每个列表项都是它自己的带有标签和图标的条目。
- 文: 功能标签,例如功能 #1 或无限门票。
- 图标: 每个功能旁边显示的复选标记或十字。
- 工具提示: 可选的悬停音符来解释功能。
- 添加项目: 根据计划需要添加尽可能多的功能。
添加丝带 #
打开 丝带 节添加像趋势或流行这样的角徽章,这是指向人们你希望他们选择的计划最快的方法。
- 显示和标题: 打开丝带并设置其文本。
- 对齐和位置: 将丝带放在角落并轻推它。
- 旋转: 将丝带对角倾斜。
为桌子设计样式 #
打开 风格 tab来控制颜色和间距,有标题,定价,功能,页脚和丝带的部分,每个部分都有自己的颜色和排版。
的 脚踏车 section 风格为号召性用语按钮, 大小、颜色、边框以及正常状态和悬停状态, 因此该按钮与您的品牌相匹配, 从功能列表中脱颖而出。
常见用例 #
- SaaS 和应用程序计划 具有三层和一个突出的最爱。
- 会员网站 具有基本和高级访问级别。
- 机构和自由职业者 显示打包服务级别。
- 托管和工具 列出每个计划的功能和复选标记。
- 课程和活动 提供基本票和高级票。
使用定价表小部件的技巧 #
- 突出一个计划。 用高光桌拨动和您希望大多数人购买的计划上的丝带,突出显示所有三个,没有一个脱颖而出。
- 均匀保留功能列表。 跨计划的类似行计数使它们易于一目了然地进行比较。
- 将按钮匹配到操作。 立即购买、免费开始和开始阅读都不同,因此请选择适合优惠的内容。
- 少用梯度。 每个计划的一种重音颜色读起来比三个互相争斗的响亮渐变更干净。
- 设置明确的期限。 始终显示/月或/年,因此价格永远不会含糊不清。
常见问题 #
Master Addons 中的定价表小部件是什么?
Elementor小部件,它搭建了一个标头、一个价格和周期、一个功能列表、一个按钮的定价方案,你并排放置几个,做一个完整的定价板块,一切从Elementor面板设置,没有代码。
如何将计划标记为最受欢迎的计划?
在"定价内容部分打开"高光表切换来提高计划,并在"丝带部分添加一条带有"趋势或"流行等文本的丝带,它们一起吸引了您希望访问者选择的计划。
我可以添加促销或折扣价格吗?
是定价部分有一个销售切换,打开它,小部件显示在销售价格旁边打通的原始价格,因此访问者可以看到折扣,您在同一部分设置货币符号和计费周期。
我可以根据计划显示更多或更少的功能吗?
是。功能部分是一个中继器。使用添加项目添加行,X删除它们,因此每个计划都可以准确地列出自己的功能。您还可以使用显示功能切换完全隐藏功能列表。
我可以为定价功能添加工具提示吗?
是中继器中的每个功能都有一个 Tooltip 选项卡,因此您可以附上一个短悬停注释,解释该功能的含义。对于仅标签不够清晰的技术功能来说,它很方便。
包裹起来 #
定价表小部件将您的计划变成一个干净的比较:设置标头和价格,列出功能,在流行的计划上添加丝带,然后对颜色和按钮进行样式。有关小部件,请参阅 行动号召小部件 和 信息框小部件,浏览全文 主插件小部件和扩展,并看到 定价表小部件页面 elementor Pro 的价格表进行分步构建、五种布局以及与之的比较。
