按钮
在这篇文章中,我们将向您展示如何使用主题选项下的按钮设置设置按钮样式,将应用于整个网站。
按钮设置和按钮元素的区别
通常,一个网站会使用多种按钮样式。您可以使用一种样式的呼叫行动按钮,另一种样式的”阅读更多”你的博客页面上的按钮”加入购物车”在你的商店页面上。
但是,通常有一种按钮样式在站点的不同区域是通用的- - - - - -一种比其他字体更常用的字体。你可以称之为”默认的”风格。作为效率的问题,你会想要在一个地方设置默认按钮样式的能力,并将它应用到多个地方。这就是”按钮设置”进来。
要访问按钮设置,请转到主题选项>按钮.

现在,假设您有以下这些设置(我将在后面解释每个设置)并单击”保存。”

这些设置的结果是一个如下所示的按钮(当然,文本除外)。

当你在Pro的内容生成器,X的基石或使用WordPress模板文件中的短代码(例如single.php)添加一个新的经典按钮元素时,它会自动使用你设置的全局设置主题选项>按钮。

不接触任何其他设置,除了文本而且href,你会得到一个按钮,看起来像我们全局设置的那个。这使得保持一致的外观非常容易。
现在,假设您已经将该按钮添加到许多页面中,并且决定(或者您的客户已经决定)他不想要圆形的按钮,而是想要看起来像药丸的东西。您不必手动更改每一个。简单地回到主题选项>按钮并将按钮形状更改为”药丸”如下所示。

点击之后”保存”您网站上所有遵循全局设置的经典按钮将被更改。

现在,假设你想创建不同类型的按钮- - - - - -一个小的,方形的,有外部阴影,底部有边框。一个像这样的。

您所需要做的就是在Classic Button Element中为以下字段选择不同的选项。

你可以看到默认情况下它们都有这个选项”全局设置”选中。这意味着它们都遵循按钮设置中的任何设置。您可以通过选择不同的选项来覆盖全局设置。

您将在上面看到,我为所有3个字段选择了不同的选项,以实现前面描述的我们想要的按钮外观。现在,你不需要改变所有的。如果你只需要改变类型并保留形状而且大小,你可以这样做。下面是一个例子。

你会在上面看到两者形状而且大小选项来保留全局设置”全局设置”选项,而仅类型使用与全局设置不同的选项。
想要创建一个透明版本的按钮?只需选择”透明的”选择类型.因为在本例中,我们已经在按钮设置中设置了白色作为文本颜色,并且没有用于更改经典按钮元素颜色的专业内容生成器和基石,所以您必须使用CSS来更改文本颜色。

按钮设置说明
现在让我们从。开始深入到不同的按钮设置按钮的风格,按钮形状而且按钮大小.但比起向你解释它们,我更愿意向你展示它们的样子。









颜色设置
现在让我们进入按钮颜色设置。在按钮设置下面有两个颜色设置:颜色而且盘旋的颜色.

颜色是在鼠标不与按钮交互时设置按钮颜色的地方。你可能会说它包含按钮的颜色设置在休息的时候。假设你想要一个蓝色的按钮并设置这些颜色颜色.

盘旋的颜色另一方面,当鼠标指向一个按钮时,你可以在这里设置按钮的颜色。为了演示,让我们将鼠标悬停时的背景颜色设置为橙色。

在网页设计中,当用户将鼠标指向按钮时,改变按钮的颜色通常是一个很好的做法,因为额外的反馈强化了用户的意识,即他将鼠标指向的元素确实是一个按钮,它是可点击的,点击后会发生一些事情。
有4种不同的颜色设置,出现在两个颜色而且盘旋的颜色.它们如下:

现在根据按钮类型,你会看到所有的,三个或两个设置。如果您选择3D按钮类型,你会看到所有选项如上图所示。如果你选择平面,你会有三个:

如果你选择透明,你只会看到两个:

下图显示了每个颜色设置应用到按钮的位置。

总结
就是这样!现在您知道了如何使用主题选项中的按钮设置全局设置按钮的样式、类型、颜色和大小。您还知道如何覆盖那些您希望看起来不同于您已全局设置的按钮的全局设置。
看到不准确的地方了吗?让我们知道