Genesis主题的导航菜单添加按钮

Genesis主题的导航菜单添加按钮

　　之前，我们有了解到如何将可点击的电话号码添加到WordPress菜单，在本教程中，我们晓得博客将向您展示如何给 Genesis主题 的导航菜单添加按钮。因为Genesis Framework主题没有提供导航小部件，不知道如何实现这一点的话，建议按照以下的内容，添加一个菜单项，使用一些 CSS 对其进行样式设置以创建一个按钮。

添加内容到导航菜单

　　要给菜单添加按钮，首先就是在菜单中添加你需要的内容，登录你的网站，在WordPress仪表盘中点击“外观”->“菜单”，在“自定义链接”，输入想要展示的文字，及链接，点击“添加至菜单”。

设置导航菜单按钮CSS属性

　　然后，添加button-green 到上一步添加的 自定义链接的 CSS 类。也可参考如何将自定义CSS添加到WordPress网站

　　如果您没有看到 CSS 类字段，请单击菜单页面顶部的“显示选项”，点击选择“CSS类”即可。

Genesis主题的导航菜单按钮自定义样式

　　我们在 CSS 中添加一些代码来创建一个按钮。我们将按钮设为绿色。将以下 CSS 添加到您的样式表，或者导航到WordPress仪表盘 ，点击“外观”->”自定义”->”额外 CSS”，并将代码放在那里。

    .button-green{
    background-color:#26CC9F;
    border:1pxsolid#26CC9F;
    border-radius:5px;
    text-align:center;
    text-transform:uppercase;
    }
    .button-green:hover{
    background-color:#fff;
    border:1pxsolid#26CC9F;
    }

　　当然，你的按钮也可以使用其他颜色，只需确保您添加到菜单中 CSS 字段的任何内容与您在附加 CSS 中指定的 CSS 名称相匹配。

总结

　　以上是晓得博客为你介绍的如何在Genesis Framework主题的导航菜单添加自定义按钮的全部内容，希望对你就WordPress建站有所帮助。

　　推荐：Genesis主题建站