文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

使用 WordPress 的导航菜单

WordPress 原来默认的导航菜单只能是页面，或者分类，或者两者，如果想自己加入一个自定义链接都需要修改主题，非常不方便，所以一个完全可定制化的自定义的 WordPress 导航菜单成了所有人的需求...WordPress 3.0 这个全新的导航菜单。...WordPress 导航菜单系统的概述 首先我们简单解释下这个导航系统的几个概念： 主题位置：就是定义导航菜单在当前主题位置的名称，比如你在导航位置定义了一个菜单，名字就叫做导航菜单，那么这里就显示...使用 WordPress 的导航菜单 如何激活 WordPress 自带的导航菜单 要使用 WordPress 导航菜单功能，首先要给当前的主题注册导航菜单，从上面我们知道，我们可以注册一个或者多个导航菜单的主题位置...这里我们只注册一个导航菜单的主题位置： register_nav_menu( 'nav-menu', '导航菜单'); nav-menu 是这个导航菜单的名字，用来在函数中定义身份的，而“导航菜单”则是名称

3.3K10
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    wordpress导航菜单详解及改造

    对于wordpress主题来说 wp的菜单是必不可少的 可以用于制作导航栏 也可以做侧边栏、页脚导航等等 只要熟练掌握 就能利用wp菜单做成想要的东西 话不多说 现在先讲一下菜单的创建 首先要开启导航菜单功能...); 代码内的菜单名与别名根据实际需要来起 当然照我所写代码也可 具体怎么使用稍后会讲 然后在wp后台菜单处显示如下 至于怎么设置菜单，具体见下面wordpress大学的教程 https://www.wpdaxue.com.../wordpress-nav-menus.html 菜单创建好了 要怎么引用呢？...可以看到，生成的class名太多了 但图中红线划中的地方 在某些情况下对我们是很有帮助的 例如通过点击导航栏某个栏目 跳转到这个栏目的页面时 导航栏此栏目位置高亮 观察导航栏结构 我们会发现 该栏目会有一个类名.../courses/highgrade/610.html 可以参考一下 那么以上就是关于wordpress菜单几乎所有的教程了 这是我通过长时间的积累 以及这期间搜集的教程 整理出这个wp菜单教程 希望能对大家有所帮助

    3.9K70

    wordpress导航菜单链接处添加nofollow

    wordpress导航菜单链接处添加nofollow 作者：matrix 被围观: 2,700 次 发布时间：2015-05-29 分类：Wordpress 兼容并蓄 | 5 条评论 » 这是一个创建于...2652 天前的主题，其中的信息可能已经有所发展或是发生改变。...WordPress后台选项  外观-〉菜单处可以给导航栏自定义URL，但是个别链接需要添加rel="nofollow"的时候会发现没有办法。其实WordPress是有这个选项的，只是隐藏了。...点击顶部的“显示选项”展开， 链接关系网（XFN）处打勾就可以了。 如果是4.2的版本会无法点击“显示选项” ，可以审查元素手动修改DOM来临时解决问题： 1。...点击旁边的“帮助”选项 参考: http://www.tseoer.com/wangzhanjiansheyouhuatuiguang/13.html

    85430

    删除 WordPress 导航菜单的多余 CSS 选择器

    在默认情况下，WordPress 的导航菜单会输出很多如menu-item、menu-item-type-taxonomy、menu-item-object-category等加上 id 组成的CSS...选择器，无疑，对于一些人来说，这些选择器导致整个html 格式变得难看，看着碍眼的东西最好是将它去掉，下面介绍删除（去除）WordPress 导航菜单的多余 CSS 选择器的方法。...如本站 DeveWork.com 的导航菜单的相关CSS 代码如下： ? ?...代码如下，还是加入到主题的functions.php 文件中（代码来源网络，作者未知）： add_filter('nav_menu_css_class' , 'special_nav_class' ,...current-menu-item", "menu-item-home", 'last'); $classes = array_intersect($item->classes,$current_and_home); //保留有需要的

    2.2K70

    删除 WordPress 导航菜单的多余 CSS 选择器

    在默认情况下，WordPress 的导航菜单会输出很多如menu-item、menu-item-type-taxonomy、menu-item-object-category等加上 id 组成的CSS...选择器，无疑，对于一些人来说，这些选择器导致整个html 格式变得难看，看着碍眼的东西最好是将它去掉，下面介绍删除（去除）WordPress 导航菜单的多余 CSS 选择器的方法。...如本站 DeveWork.com 的导航菜单的相关CSS 代码如下： ? ?...代码如下，还是加入到主题的functions.php 文件中（代码来源网络，作者未知）： add_filter('nav_menu_css_class' , 'special_nav_class' ,...current-menu-item", "menu-item-home", 'last'); $classes = array_intersect($item->classes,$current_and_home); //保留有需要的

    2.8K70

    WordPress为导航菜单添加个性图标字体

    我们还可以单独为导航菜单上的项目也配上个性化的图标字体。 具体方法： 一、WP后台--插件--安装插件页面搜索：Font Awesome 4 Menus，下载安装并启用。...二、WP后台---外观---菜单，进入菜单设置页面，选择并编辑一个菜单项，在CSS类中输入一个图标字体选择器名称，如图： ?...如果在编辑菜单项目面板中无CSS类，可以打开右上角的“显示选项”，在显示菜单高级属性中勾选“CSS类”。（今天才发现有这个的！！！）...CSS类中输入fa fa-home就可以了。...那然这个图标字体库并不只局限于使用在导航菜单上，只要把相应的图标代码加到主题模板的相应位置，也同样可以显示。

    2.4K10

    【说站】修改WordPress知更鸟导航菜单 分类字体颜色、大小

    知更鸟主题的导航文字、大小和颜色其实都可以进行自定义的，下面就介绍一下如何单独修改导航菜单分类和整体修改导航菜单分类字体、颜色、大小的具体方法。...如何单独修改导航菜单的字体颜色、大小 首先在WordPress后台，找到外观，选择“菜单”， 我们找到需要单独设置的导航分类，点击打开，找到“css类”，在这里输入给这个菜单栏目定义的css类。...我们看下效果： 如何整体修改导航菜单的字体颜色、大小 上面说的单独修改导航菜单稍微复杂一些，如果要整体修改就比较简单。...20px;控制字体大小，根据需要进行修改 #site-nav .down-menu li a {     font-weight: bold;     font-size: 20px; } 如果有多级菜单...，只对一级菜单的颜色、字体大小进行更改的话按照下面的代码：     #site-nav .down-menu a {         font-weight: bold;         font-size

    2.9K30

    调用wordpress菜单中的分类ID方法

    wordpress输出菜单分类(Category)的ID，可以通过获取分类信息并输出其ID来实现。WordPress提供了get_categories()函数来获取分类信息。...以下是一个示例代码，展示如何输出分类的ID：cat_ID：每个分类对象中包含一个cat_ID属性，这就是分类的唯一标识符。输出格式：在上面的代码中，每个分类的ID会以逗号分隔的形式输出。你可以根据需要调整输出格式。...示例输出：如果分类有分类A和分类B，它们的ID分别为2和4，那么输出将是：2,4,如何使用：将上述代码放在你需要输出分类ID的位置即可。...例如，你可以将其放在主题的模板文件(如header.php或sidebar.php)中。进一步定制：如果你只想输出特定分类的ID，可以通过include参数指定分类的ID列表。例如：<?

    41100

    WordPress导航菜单图标字体插件font awesome 4 menus纯代码版

    换成 Begin 主题之后，大伙都不约而同的给菜单用上了图标字体，确实给博客带来了一定的美化效果。 与之配套的是 font awesome 4 menus 这个图标字体插件，其实还是挺小巧的。...那如何使用到 WordPress 导航菜单呢？...很简单，依次打开 WordPress 后台==>外观==>菜单，然后点开已有菜单，将得到的 class 填入到 CSS 类即可，比如我在官方图标库查到“家”图标的 class 是 fa fa-home，...保存之后，WordPress 导航菜单上的【首页】前面就会出现一个“家”的图标了。 如果发现点开菜单没有 CSS 类栏位怎么办？ 很明显，你没把这个功能开出来。...点击菜单页面右上方的【显示选项】，勾上 CSS 类即可： ? 如果发现点击【显示选项】没动静怎么办？ 看来你的 WordPress 也是升级 4.2 了。

    3.6K50

    html导航栏可以展开的下拉菜单,html导航栏下拉菜单如何制作

    html导航栏菜单实例解析： html导航栏菜单的HTML部分： 我们可以使用任何的HTML元素来打开下拉菜单，如：,或a元素。...html导航栏菜单的CSS部分： .dropdown类使用position:relative,这将设置下拉菜单的内容放置在下拉按钮(使用position:absolute)的右下角位置。....dropdown-content类中是实际的下拉菜单。默认是隐藏的，在鼠标移动到指定元素后会显示。 注意min-width的值设置为160px。你可以随意修改它。...看，这就是代码的效果，有导航栏下拉列表，隐身的导航栏，鼠标移上去才有反应。 这就是导航栏下拉菜单的简单制作，有问题的可以在下方留言。...看完了这篇文章，相信你对html导航栏下拉菜单如何制作有了一定的了解，想了解更多相关知识，欢迎关注亿速云行业资讯频道，感谢各位的阅读！

    12.7K20

    汽车网站导航菜单的设计技巧

    首先我们分析一下汽车网站常用的颜色。黑白灰属于非彩色，可以搭配很多颜色。很多网站设计师喜欢用大图作为网站的背景，然后把导航菜单设计成深灰色的主色调，显得有辨识度，视觉上有质感。...然后把正在使用的菜单项目设置为饱和度较高的蓝色矩形，这样导航栏就与网页的背景图相互呼应了，而且在色彩的搭配上也干净利落，既美观大方，又能重点突出。...2、 对于导航栏设计的分析采用扁平化导航菜单设计，即在网页的顶端使进行导航栏呈现横向的传统表现方式，而导航栏的背景则由简约的矩形来构成。...然后就是上面所说的使用高饱和度的蓝色矩形来体现正在访问的菜单项，在对蓝色矩形进行倾斜设计，会使网页更显动感，与汽车网站的主体相吻合。...3、 导航栏的普遍设计风格在汽车导航栏中，大多数的设计都比较简约，都会是像上面这样用色块做背景的导航栏设计方式。但仍然要注意导航栏在细节上表现。

    1.3K10

    更改WordPress插件的菜单名称

    如果您想在不直接编辑插件的情况下更改WordPress内部管理菜单的名称，您可以使用$menuWordPress管理员中存在的全局变量。操作此数据结构将允许您更改由任何插件添加的管理菜单的文本或名称。...这在您希望提供项目内容的清晰度或为客户端提供更好的管理UX的情况下非常有用。...为此，将以下PHP添加到主题functions.php文件中： /**  * Custom Plugin Menu Name(s)  *  * Rename admin menus added by...menu[k][6] = } } add_action( 'admin_init', 'kl_rename_plugin_menus' ); 添加此代码后，您将需要更改$updates数组中的值...关键是您当前在WordPress中看到并想要更改的现有插件菜单的名称。该值是具有两个属性的更改数组： name - 要用于插件菜单的新名称 icon - 您要使用的图标，作为可选的自定义

    4.9K10
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券