网站建设资讯

NEWS

网站建设资讯

wordpress导航标 wordpress导航源码

关于wordpress 添加导航菜单图标

这个的前提是导航在header里,不在的话你要对应着你的主题改位置

成都创新互联从2013年创立,是专业互联网技术服务公司,拥有项目网站建设、成都网站设计网站策划,项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命,1280元肃南裕固族自治做网站,已为上家服务,为肃南裕固族自治各地企业和个人服务,联系电话:13518219792

如何自定义修改WordPress的导航栏

1

首先,登录您的WordPress管理后台,依次进入【Appearance(外观) – Menus(菜单或叫做导航菜单)】模块,进入导航菜单设置页面;

2

如果您之前没有使用或者没有设置过菜单的话,您需要点击右侧上方的“+”按钮,添加新的 Menu Name(菜单名),之后,点击右侧的 Create Menu(创建菜单)按钮,激活新的菜单(本例新建菜单名称为header_menu)

3

建立新菜单header_menu后,默认状态的菜单是空的; 在这个页面左侧,你可以看到 Theme Locations(主题位置)、Custom Links(自定义链接)、Pages(页面列表)、Categories(分类列表)等内容。

在左侧的这些内容中,选择你要显示的页面、分类或自定义链接等项目后,点击各个项目分别对应的 Add to Menu(添加到菜单)按钮,使得你选中的栏目添加到右侧的新建菜单header_menu中,以添加Pages(页面列表)项目为例

4

添加到右侧新建菜单header_menu中的栏目以列表形式出现,现在你需要在这里,用鼠标上下拖拽的方式排列菜单的显示顺序;需要注意的是添加进来的菜单都是一级显示的,如果你要建立二级(多级)菜单的话,你还需要同样适用鼠标上下左右标拖拽方式设置二级(多级)菜单,每右移一格为一级

5

保存完后, 您的自定义菜单就设置好了。

怎样为wordpress导航菜单设置图标

说简单一下,利用插件实现,试试这个插件Font Awesome 4 Menus,

一、WP后台--插件--安装插件页面搜索:Font Awesome 4 Menus,下载安装并启用。

二、WP后台---外观---菜单,进入菜单设置页面,选择并编辑一个菜单项,在CSS类中输入一个图标字体选择器名称,如图:

如果在编辑菜单项目面板中无CSS类,可以打开右上角的“显示选项”,在显示菜单高级属性中勾选“CSS类”。

图标字体选择器名称,打开此页查看:

点开一个认为合适的图标字体,在下会显示类似:

i class="fa fa-home"/i

只需在菜单CSS类中输入fa fa-home就可以了。

那然这个图标字体库并不只局限于使用在导航菜单上,只要把相应的图标代码加到主题模板的相应位置,也同样可以显示。

wordpress怎么在导航栏上加hot,new等小图标

在主题设置+自定义CSS里面加入如下代码即可实现哦!

.menu-item.hot:after {

background-color: red;

border-radius: 3px;

color: #fff;

content: "HOT";

font-size: 10px;

line-height:1;

padding: 1px 3px;

position: absolute;

right: -1px;

top: 12px;

}


文章标题:wordpress导航标 wordpress导航源码
网页路径:http://cdweb.net/article/ddecess.html