在标题导航菜单中添加一个按钮
已发表: 2021-06-22标题导航菜单是 WordPress 是一个经常未被使用的网站空间。 虽然大多数网络管理员仅将其用于导航,但您也可以添加搜索栏甚至促销内容。 但是,为了有效地做到这一点,您应该考虑在标题导航菜单中添加一个按钮。 在本文中,我们将详细说明为什么这样做是有益的,以及如何正确地这样做。
在标题导航菜单中添加按钮的好处
在标题导航菜单中有一个按钮似乎是一件微不足道的事情。 毕竟,标准超链接和按钮之间似乎没有太大区别。 好吧,实际上,使用按钮而不是纯文本会产生令人惊讶的结果。 这主要是由于人的注意力是如何工作的,以及您的按钮有多显着。
人们通常如何体验标题导航菜单
标题导航菜单通常是人们注意到的第二件事。 如果您的网站设计得很好并正确添加了导航菜单,那么您的帖子标题应该是第一个吸引观众眼球的东西。 但是,在那之后,他们的目光自然会转向导航菜单,以查看可用的内容。 如果他们决定留在当前页面上,那就这样吧。 但是,如果您的网站上还有其他兴趣点,它们应该在标题导航菜单中清晰可见。

毕竟,您的目标应该是让人们尽可能长时间地留在您的网站上。 并且有一个易于理解的菜单会很有帮助。 那么,所有这些按钮从何而来?
添加按钮的好处
添加按钮的主要思想是强调一些重要的东西。 虽然标题菜单确实包含有趣的链接,但并非所有链接都具有相同的重要性。 有些是帮助阅读的简单导航工具。 还有一些是更直接的宣传内容,用于引导读者进行转化。 好吧,当涉及到后者的内容时,按钮应该是您的首选。 由于您可以以任何您认为合适的方式更改它们,它们自然会脱颖而出并引起注意。 因此,如果您了解客户通过您的网站的旅程,您可以轻松地使用按钮将他们吸引到社交媒体或成功转换。

定制提示
自定义按钮以获得适当的效果可能有点棘手。 一方面,您不希望它们过于突出,因为它们会破坏网页的外观。 但是,您也不希望它们过多地融入其中,因为它们不会引起注意。 所以,你需要找到中间立场,说起来容易做起来难。 我们的建议是寻找在标题导航菜单中成功使用按钮的网站,看看它们如何使用颜色。 请记住,您可以更改按钮的形状、轮廓、字体和颜色。 因此,在定制中使用这种多样性对您有利。 理想情况下,您会发现与您网站的整体美感相得益彰的风格。 同时也引起了人们的注意。

如何在标题导航菜单中添加按钮
幸运的是,在 WordPress 标题导航菜单中添加一个按钮非常简单。 首先,您需要前往导航菜单并添加要转换为按钮的链接。 您可以在外观 -> 菜单页面上执行此操作。 完成后,单击顶部附近的“屏幕选项”按钮。 通过这样做,您将获得一个带有几个选项的下拉菜单。 对于这种情况,您只需要检查“CSS 类”选项。
完成此操作后,向下滚动并单击展开要转换为按钮的菜单项。 在那里,您将在项目设置中获得一个新的 CSS 类选项。 在其中,您可以输入班级名称。 从理论上讲,您可以以任何您认为合适的方式命名您的班级。 但是,对于本文,我们将给类名“menu-button”以便于理解。 输入姓名后,请记住单击“保存菜单”按钮。
添加 CSS 代码
添加自定义 CSS 类后,我们可以继续添加 CSS 代码。 在这里,您需要转到外观 -> 自定义并启动 WordPress 主题定制器。 通过这样做,您将获得您网站的预览和主题设置列表。 您需要做的是单击 Additional CSS 选项卡并展开它。 在这里,您将获得一个框,您可以在其中添加自定义 CSS 代码。 对于初学者,我们建议您只需粘贴以下代码:
. 菜单按钮 {
背景颜色:#eb5e28;
边框:1px;
边框半径:3px;
-webkit-box-shadow:1px 1px 0px 0px #2f2f2f;
-moz-box-shadow:1px 1px 0px 0px #2f2f2f;
盒子阴影:1px 1px 0px 0px #2f2f2f;
}
.menu-button a, .menu-button a:悬停, .menu-button a:active {
颜色:#fff!重要;
}
添加 CSS 代码后,主题定制器会将其应用于您的网站预览。 这将允许您查看所做的更改。 不用担心,这些变化不是永久性的。 如果您觉得有必要,请继续尝试使用 CSS,看看您能做什么。 为了保存您的更改,请单击“发布”按钮。

有了这个,您就完成了在标题导航菜单中添加一个按钮。
最后的想法
考虑到所有因素,按钮可以成为标题菜单的绝佳插件。 但是,找到正确的设计至关重要。 事实上,人们避免添加按钮的主要原因之一是他们根本无法将按钮与网站设计相适应。 如果您遇到困难,我们强烈建议您咨询专业的平面设计师并重视他们的意见。 如您所见,一旦您确定了设计,添加按钮实际上并不需要太多。