在线为您的产品创建定价表比以往任何时候都容易。 使用您的价格表模块创建任意数量的表并控制每个表的价格和功能 WordPress主题 迪维。 您甚至可以制定一个特定的计划来增加转化率。 即使您的模块包含多个定价表,它也将被视为一个模块,并且可以放置在任何列大小下。

如何在页面上添加“费率表”模块

在您可以将定价表模块添加到您的页面之前,您必须首先跳转到 Divi Builder。 一旦 Divi主题 安装在您的网站上,您会注意到一个按钮 使用Divi Builder 创建新页面时,在帖子编辑器上方。 单击此按钮以激活Divi Builder,并访问所有Divi Builder模块。 然后点击按钮 使用Visual Builder 以可视模式启动发电机。 您也可以点击按钮 使用Visual Builder 如果您已连接到WordPress仪表板,则在前台浏览网站时。

模块定价表

进入Visual Builder后,您可以单击灰色加号按钮将新模块添加到页面。 新模块只能添加到行内。 如果要开始新页面,请记住首先在页面中添加一行。

divi wordpress price chart.png

在模块列表中找到价格表模块,然后单击它以将其添加到页面中。 模块列表是可搜索的,这意味着您也可以键入“价格表”一词,然后单击“输入”以自动搜索并添加价格表模块! 添加模块后,模块选项列表将为您打招呼。 这些选项分为三个主要组: 包装内容 , 概念 et 先进 .

用例:为产品页面添加定价表

当你做 提升 着陆页上的产品,定价表可以有效地展示您的各种定价选项。

在此示例中,我将添加一个定价表模块以显示三个定价计划(或表格),其中一个计划作为特色计划而突出,以增加转化。

WordPress价格表divi.jpg

首先,在应该显示定价表的页面上添加一个新的常规部分。 在该部分添加一个全角(1列)行,并将“定价表”模块插入该行。

价格表线divi.png

在定价表设置的“内容”选项卡上,单击“ +添加新项目 添加您的第一个表。

新柱价格chart.png

如下更新定价表的参数:

内容选项

标题:个人货币:$创建者:年价格:69按钮文字:注册内容:
访问所有主题永久更新主题高级技术支持-访问所有插件-商店覆盖文件-不收取年费
按钮网址:[输入按钮网址]背景:#ffffff

德观念选项

价格文字颜色:#3e51b5使用自定义按钮样式:是按钮文字颜色:#ffffff按钮颜色:#3e51b5按钮宽度:0px

保存设置

divi wordpress price chart example.png

现在,将您刚刚创建的价格表复制两次,以共有三个价格表。

创造了几个tableau.jpg的例子

对于中间价格表,更新以下选项:

内容选项卡

标题:开发人员价格:89内容:访问所有主题永久更新主题高级技术支持访问所有Photoshop分层文件-不收取年费按钮URL:[输入按钮URL]

设计选项卡

文字颜色:#0091ca按钮颜色:#0091ca

对于第三个定价表,如下更新设置:

内容选项卡

标题:终身价格:249按钮文本:订阅内容:访问所有主题永久主题更新高级技术支持访问所有插件分层的Photoshop文件无需年费按钮URL:[输入URL按钮]

保存设置

现在返回定价表设置并更新以下内容:

内容选项

特色表格背景颜色:#0091ca

德观念选项

球体颜色:#3e51b5特色桌子颜色:#0091ca

divi.jpg价格表的结果

保存设置

现在返回并编辑区域设置,为区域提供#3e51b5的背景色。

就这样。 现在,您有了一个包含三个选项的价格表,其中中间选项设置为特色项,与其他项相比显得突出。

价格表选项divi.jpg

定价表的内容选项

在内容选项卡中,您将找到模块的所有内容元素,例如文本,图像和图标。 所有控制 什么 出现在模块中的内容将始终在此标签中找到。

价格表设计option.png

+添加一篇新文章

在这里,您可以向模块添加新的定价表。 单击“ +添加新项目”将打开特定于该定价表的设计选项的全新列表。 有关单个价格表设置,请参见下文。

添加第一个标签后,价格栏标题将以标签形式显示灰色条。 灰色栏还具有三个按钮,可让您编辑,复制或删除表格。

显示项目符号

默认情况下,定价表项目显示为项目符号列表。 如果要从功能列表中删除项目符号,可以关闭此选项。

特色表的背景颜色

每个价格表都可以“显示”。 特色表在行中突出显示,这使它们与其他选项区分开。 使用此设置,您只能更改功能表的背景颜色。

表标题背景色

每个定价表上方是一个标题区域,其中包含表的标题和副标题。 通过从颜色选择器中选择所需的颜色,可以独立于主表的背景颜色来控制该区域的背景颜色。

特色表格标题

每个价格表都可以“精选”。 特色表在行中突出显示,这使它们与其他选项区分开。 使用此设置,可以仅更改所选表的标题的背景颜色。

背景颜色

默认情况下,价格表的背景颜色为白色。 如果要为定价表背景使用其他颜色,则可以在此处使用颜色选择器设置自定义颜色。

管理员标签

这将更改构造函数中的模块标签,以便于识别。 在Visual Builder中使用WireFrame视图时,这些标签将出现在Divi Builder界面的模块块中。

定价表设计选项

在“设计”选项卡中,您将找到所有模块样式选项,例如字体,颜色,大小和间距。 这是用于更改模块外观的选项卡。 每个Divi模块都有一长串的设计设置,可用于更改任何内容。

array design option.png

对准

默认情况下,功能列表在定价表中保持对齐。 如果要对齐它们,可以激活此选项。

从精选表格中删除阴影

默认情况下,定价表在每个表后面都有一个细微的阴影。 如果要删除此阴影,可以启用此选项。

中心列表中的文章

在这里,您可以选择将表格中列出的项目居中。

球的颜色

默认情况下,定价表列表中的项目符号将继承主题的主题色。 如果要使用其他颜色,可以在此处使用颜色选择器进行设置。

特色表的颜色

如果要为定价表中的项目符号使用其他颜色,则可以在此处使用颜色选择器设置该颜色。

特色表格标题文字颜色

此选项控制表格标题的文本颜色。 如果更改表格标题的背景颜色,则也可以更改此选项以确保可读性。

标题字体

您可以通过从下拉菜单中选择所需的字体来更改标题文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

标题字体大小

您可以在此处调整标题文本的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

标题文字颜色

默认情况下,Divi上的所有文本颜色都显示为白色或深灰色。 如果要更改标题文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

标题字母间距

字母间距会影响每个字母之间的间距。 如果要增加标题文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

标题行高度

行高会影响标题文本每一行之间的间距。如果要增加每一行之间的间距,请使用范围滑块调整间距或在光标右侧的输入字段。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

特色表文本的颜色

这将更改您的特色表格的正文文本颜色。 如果更改表格的背景颜色,则可能需要更改此选项以确保可读性。

正文字体

您可以通过从下拉菜单中选择所需的字体来更改您的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

正文字体大小

在这里您可以调整您的正文文本大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

正文文字颜色

默认情况下,Divi上的所有文本颜色都显示为白色或深灰色。 如果要更改文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

正文字母的间距

字母间距会影响每个字母之间的间距。 如果要增加文本中每个字母之间的间距,请使用范围滑块调整间距或在滑块右侧的输入字段中输入所需的间距大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

身体线的高度

行高会影响正文中每一行之间的间距如果要增加每一行之间的间距,请使用范围滑块调整间距或在输入字段中输入所需的间距大小位于光标右侧。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

表格副标题的文字颜色

这将更改功能表的标题文本颜色。 如果更改表格的背景颜色,则可能需要更改此选项以确保可读性。

字幕字体

您可以通过从下拉菜单中选择所需的字体来更改字幕文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

字幕或字幕字体大小

在这里,您可以调整子标题文本的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

子标题的文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改标题的文本颜色,请使用此选项从颜色选择器中选择所需的颜色。

副标题字母的间距

字母间距会影响每个字母之间的间距。 如果要增加标题文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

副标题行的高度

行高会影响字幕文本每行之间的间隔。 如果要增加每行之间的间隔,请使用范围滑块调整间隔或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

货币货币和频率

您可以通过从下拉菜单中选择所需的字体来更改货币的字体和频率文本。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

货币货币大小和频率

您可以在此处调整货币大小和频率文本。 您可以拖动范围滑块以增加或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需文本大小的值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

货币文字的颜色和频率

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改货币和频率文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

字母和货币的间距

字母间距会影响每个字母之间的间距。 如果要增加货币和频率文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

频率线

行高会影响货币和频率文本之间的间隔。如果要增加每行之间的间隔,请使用范围滑块调整间隔或在字段中输入所需的间隔大小在光标右边。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

特色价格

这将更改您的特色表价格的颜色。 如果更改表格的背景颜色,则可能需要更改此选项以确保可读性。

价格警察

您可以通过从下拉菜单中选择所需的字体来更改价格文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

价格字体大小

您可以在此处调整价格文字的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

价格文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改价格文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

价格信件的间距

字母间距会影响每个字母之间的间距。 如果要增加价格文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

价格线的高度

行高会影响价格文本各行之间的间距如果要增加各行之间的间距,请使用范围滑块调整间距或在输入字段中输入所需的间距大小位于光标右侧。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

使用边框

启用此选项将在模块周围放置边框。 可以使用以下条件参数来自定义此边框。

边界的颜色

此选项会影响边框的颜色。 从颜色选择器中选择一种自定义颜色,以将其应用于边框。

边界的宽度

默认情况下,边框为1像素宽。 您可以通过拖动范围滑块或在滑块右侧的输入字段中输入自定义值来增加此值。 支持自定义度量单位,这意味着您可以将默认单位从“ px”更改为em,vh,vw等。

边框样式

边框支持八种不同的样式:实心,虚线,双精度,凹槽,波峰,覆盖和开始。 从下拉菜单中选择所需的样式,以将其应用于边框。

对按钮使用自定义样式

启用此选项会显示各种按钮自定义设置,您可以使用这些设置来更改模块按钮的外观。

按钮文字大小

此设置可用于增加或减小按钮中文本的大小。 该按钮会随着文本大小的增加和减少而适应。

按钮文字颜色

默认情况下,按钮采用主题定制器中定义的主题的强调色。 此选项使您可以为该模块的按钮分配自定义文本颜色。 使用颜色选择器选择自定义颜色以更改按钮颜色。

按钮背景颜色

默认情况下,按钮具有透明的背景色。 可以通过从颜色选择器中选择所需的背景颜色来更改此设置。

按钮边框的宽度

默认情况下,所有Divi按钮的边框均为2px。 使用此设置可以增加或减少边框。 输入0即可删除边框。

按钮边框颜色

默认情况下,按钮边框采用主题自定义程序中定义的主题的强调色。 此选项使您可以为该模块的按钮分配自定义边框颜色。 使用颜色选择器选择自定义颜色,以更改按钮边框的颜色。

按钮边框半径

边框的半径会影响按钮角的圆度。 默认情况下,Divi中的按钮具有较小的边框半径,该边框将角四舍五入3个像素。 您可以将该值减小为0以创建一个方形按钮,或者显着增大该值以创建具有圆形边缘的按钮。

按钮的字母间距

字母间距会影响每个字母之间的间距。 如果要增加按钮文本中每个字母之间的间隔,请使用范围滑块调整间隔或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

布顿警察

您可以通过从下拉菜单中选择所需的字体来更改按钮文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

添加按钮图标

禁用后,此设置将从您的按钮中删除图标。 默认情况下,所有Divi按钮均显示箭头图标。

按钮图示

如果启用了图标,则可以使用此设置选择要在按钮中使用的图标。 Divi有不同的图标可供选择。

按钮图标颜色

调整此设置将更改按钮上显示的图标的颜色。 默认情况下,图标颜色与按钮文本颜色相同,但是此设置可让您独立调整颜色。

按钮图标的位置

您可以选择在按钮的左侧或右侧显示按钮的图标。

将鼠标悬停在按钮上时仅显示图标

默认情况下,仅在悬停时显示按钮图标。 如果您希望图标始终出现,请关闭此设置。

文本颜色在按钮的天桥处

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

悬停按钮背景颜色

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

颜色悬停边框按钮

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

悬停边框半径按钮

当访问者的鼠标悬停在按钮上时,将使用此值。 该值将不同于先前设置中定义的基值。

指向音符间距按钮

当访问者的鼠标悬停在按钮上时,将使用此值。 该值将不同于先前设置中定义的基值。

高级价目表选项

在高级选项卡上,您将找到经验丰富的Web设计人员可能会有用的选项,例如自定义CSS和HTML属性。 在这里,您可以将自定义CSS应用于模块的许多元素中的任何一个。 您还可以将自定义CSS类和ID应用于模块,该自定义CSS类和ID可用于在子主题的style.css文件中自定义模块。

高级期权divi price chart.png

CSS ID

输入用于此模块的可选CSS ID。 ID可用于创建自定义CSS样式或链接到页面的特定部分。

CSS类

输入用于此模块的可选CSS类。 CSS类可用于创建自定义CSS样式。 您可以添加多个类,以空格分隔。 这些类可用于Divi子主题或使用Divi主题选项或Divi Builder页面上的设置添加到页面或网站的自定义CSS样式表中。

自定义CSS

自定义CSS也可以应用于模块和任何模块内部。 在“自定义CSS”部分中,您将找到一个文本字段,您可以在其中直接将自定义CSS样式表添加到每个元素。 这些设置中的CSS条目已经包装在样式标签中。 因此,只需输入用分号分隔的CSS规则即可。

能见度

此选项使您可以控制模块所在的设备。 您可以选择在平板电脑,智能手机或台式机上分别停用模块。 如果要在不同的设备上使用不同的模块,或者要通过从页面中删除某些元素来简化移动设计,这将很有用。

各个定价表的内容选项

个人部分价格table.png

标题

您在此处插入的标题将用于此(高级)定价选项。

副标题

您在此处插入的字幕将出现在标题下方。

设计

在此处输入所需货币的符号。

当前类目

如果您的定价基于订阅,请在此处输入订阅周期(例如,年份)。

价格

在此输入产品价值。

按钮文本

在此处指定按钮的文本。

包装内容

在此字段中,您可以输入产品附带或不附带的功能列表。 用新的一行分隔每个列表项,并以+或-符号开始每一行。 A +指定包含的功能,而A-指定排除的功能。

按钮网址

在每个表格的底部,您可以通过在此字段中插入有效的网址来插入号召性用语按钮。 离开这个和
如果您不想在定价表中添加按钮,请输入空按钮文本字段。

背景颜色

为模块定义自定义背景色,或留空以使用默认颜色。

个别定价表的设计选项

价格栏栏样式divi.png

制作此表格

选择此价格表是否带有此下拉菜单。 这将使董事会在其他方面脱颖而出。

项目颜色排除

对于列表中使用-符号设置为排除的项目,您可以使用此设置调整其颜色。 例如,您可能希望将颜色更改为红色或降低其不透明度,以直观地表示这些项目已从当前包装中排除。

标题字体

您可以通过从下拉菜单中选择所需的字体来更改标题文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

标题字体大小

您可以在此处调整标题文本的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

标题文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改标题文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

标题字母间距

字母间距会影响每个字母之间的间距。 如果要增加标题文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

标题行高度

行高会影响标题文本每一行之间的间距。如果要增加每一行之间的间距,请使用范围滑块调整间距或在光标右侧的输入字段。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

正文字体

您可以通过从下拉菜单中选择所需的字体来更改您的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

正文字体大小

在这里您可以调整您的正文文本大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

正文文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

正文字母的间距

字母间距会影响每个字母之间的间距。 如果要增加文本中每个字母之间的间距,请使用范围滑块调整间距或在滑块右侧的输入字段中输入所需的间距大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

身体线的高度

行高会影响正文中每一行之间的间距如果要增加每一行之间的间距,请使用范围滑块调整间距或在输入字段中输入所需的间距大小位于光标右侧。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

字幕字体

您可以通过从下拉菜单中选择所需的字体来更改字幕文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

字幕字体大小

在这里,您可以调整子标题文本的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

字幕文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改标题的文本颜色,请使用此选项从颜色选择器中选择所需的颜色。

字幕信件的间距

字母间距会影响每个字母之间的间距。 如果要增加标题文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

字幕行的高度

行高会影响字幕文本每行之间的间隔。 如果要增加每行之间的间隔,请使用范围滑块调整间隔或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

货币货币和频率

您可以通过从下拉菜单中选择所需的字体来更改货币的字体和频率文本。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

货币和频率的字体大小

您可以在此处调整货币大小和频率文本。 您可以拖动范围滑块以增加或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需文本大小的值。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

货币和频率的文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改货币和频率文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

字母和货币的间距

字母间距会影响每个字母之间的间距。 如果要增加货币和频率文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

货币和频率线

行高会影响货币和频率文本之间的间隔。如果要增加每行之间的间隔,请使用范围滑块调整间隔或在字段中输入所需的间隔大小在光标右边。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

价格政策

您可以通过从下拉菜单中选择所需的字体来更改价格文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

价格字体大小

您可以在此处调整价格文字的大小。 您可以拖动范围滑块以增大或减小文本的大小,或者直接在滑块右侧的输入字段中输入所需的文本大小值。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

价格文字颜色

默认情况下,Divi中的所有文本颜色都显示为白色或深灰色。 如果要更改价格文本的颜色,请使用此选项从颜色选择器中选择所需的颜色。

价格信件的间距

字母间距会影响每个字母之间的间距。 如果要增加价格文本中每个字母之间的间隔,请使用范围滑块调整间隔,或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

价格线的高度

行高会影响价格文本各行之间的间距如果要增加各行之间的间距,请使用范围滑块调整间距或在输入字段中输入所需的间距大小位于光标右侧。 输入字段支持不同的度量单位,这意味着您可以根据尺寸值输入“ px”或“ em”以更改其单位类型。

对按钮使用自定义样式

启用此选项会显示各种按钮自定义设置,您可以使用这些设置来更改模块按钮的外观。

按钮文字大小

此设置可用于增加或减小按钮中文本的大小。 该按钮会随着文本大小的增加和减少而适应。

按钮文字颜色

默认情况下,按钮采用主题定制器中定义的主题的强调色。 此选项使您可以为该模块的按钮分配自定义文本颜色。 使用颜色选择器选择自定义颜色以更改按钮颜色。

按钮背景颜色

默认情况下,按钮具有透明的背景色。 可以通过从颜色选择器中选择所需的背景颜色来更改此设置。

按钮边框的宽度

默认情况下,所有Divi按钮的边框均为2px。 使用此设置可以增加或减少边框。 输入0即可删除边框。

按钮边框颜色

默认情况下,按钮边框采用主题自定义程序中定义的主题的强调色。 此选项使您可以为该模块的按钮分配自定义边框颜色。 使用颜色选择器选择自定义颜色,以更改按钮边框的颜色。

按钮边框半径

边框的半径会影响按钮角的圆度。 默认情况下,Divi中的按钮具有较小的边框半径,该边框将角四舍五入3个像素。 您可以将该值减小为0以创建一个方形按钮,或者显着增大该值以创建具有圆形边缘的按钮。

按钮字母的间距

字母间距会影响每个字母之间的间距。 如果要增加按钮文本中每个字母之间的间隔,请使用范围滑块调整间隔或在滑块右侧的输入字段中输入所需的间隔大小。 输入字段支持不同的度量单位,这意味着您可以根据大小值输入“ px”或“ em”以更改其单位类型。

按钮字体

您可以通过从下拉菜单中选择所需的字体来更改按钮文本的字体。 Divi随附了数十种由Google字体支持的出色字体。 默认情况下,Divi对页面上的所有文本使用Open Sans字体。 您还可以使用粗体,斜体,大写字母和下划线选项来自定义文本样式。

向按钮添加图标

禁用后,此设置将从您的按钮中删除图标。 默认情况下,所有Divi按钮都将在悬停时显示一个箭头图标。

按钮图示

如果启用了图标,则可以使用此设置选择要在按钮中使用的图标。 Divi有不同的图标可供选择。

按钮图标颜色

调整此设置将更改按钮上显示的图标的颜色。 默认情况下,图标颜色与按钮文本颜色相同,但是此设置可让您独立调整颜色。

图标按钮的位置

您可以选择在按钮的左侧或右侧显示按钮的图标。

将鼠标悬停在按钮上时仅显示图标

默认情况下,仅在悬停时显示按钮图标。 如果您希望图标始终出现,请关闭此设置。

文本颜色在按钮的天桥处

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

在天桥按钮背景颜色

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

边界颜色在天桥

当访客的鼠标悬停在按钮上时,将使用此颜色。 颜色将与之前设置中定义的基础颜色不同。

概述中按钮边框的半径

当访问者的鼠标悬停在按钮上时,将使用此值。 该值将不同于先前设置中定义的基值。

在天桥上按钮的字母间距

当访问者的鼠标悬停在按钮上时,将使用此值。 该值将不同于先前设置中定义的基值。

单个价格表选项高级选项

高级选项divi.png

自定义CSS

自定义CSS也可以应用于模块和任何模块内部。 在“自定义CSS”部分中,您将找到一个文本字段,您可以在其中直接将自定义CSS样式表添加到每个元素。 这些设置中的CSS条目已经包装在样式标签中。 因此,只需输入用分号分隔的CSS规则即可。

[vc_row center_row =“ yes”] [vc_column宽度=“ 1/2”] [vcex_button target =“空白” layout =“展开” align =“ center” font_family =“ Raleway” font_weight =“ 700”样式=“ flat” custom_background =“#18b69d” custom_hover_background =“#118d7a” custom_color =“ #ffffff” custom_hover_color =“ #ffffff” icon_right =“ fa fa-download”]下载主题[/ vcex_button] [/ vc_column] [»vc_column] =» 1/2英寸] [vcex_button url =“ https://www.elegantthemes.com/affiliates/idevaffiliate.php?id=23065&url=40632&tid1=tutorials” target =“ blank” layout =“ expanded” align =“ center” font_family =“ Raleway” font_weight =“ 700”样式=“ flat” custom_background =“#c4226e” custom_hover_background =“#8d184f” custom_color =“ #ffffff” custom_hover_color =“ #ffffff” icon_right =“ fa fa-download”]下载模板DIVI [/ vcex_button] [/ vc_column] [/ vc_row]

其他Divi教程