首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

WordPress 自定义菜单功能介绍和使用详解

如果仅仅是调用文章分类 或者页面链接作为导航的话,会比较难控制,无法自由的添加链接等。当然,成熟的 WordPress 系统已经为我们考虑到了这一点,添加了一个 “自定义菜单” 功能。...让 WordPress 主题支持自定义菜单功能 下面来详细讲解如何在主题中,添加这个功能。也很简单,只需要在两个地方,添加两小段代码即可!...> 这个数组是必选参数,定义自定义菜单的位置标记(键名)和位置描述(键值)。...wp_nav_menu 之后,在主题中添加自定义菜单。在主题中合适的位置,添加下面的函数: 可选,设置包裹自定义菜单的标签形式。默认:%3$s,通常不要修改 。

1K20

wp_nav_menu 函数经Walker_Nav_Menu 自定义导航菜单HTML

WordPress 中有一个导航菜单函数wp_nav_menu,通过这个函数可以控制菜单输出的HTML 结构,一般开发者用这个函数的一般是在输出HTML 中自定义一些id 或者class 而已,整体的HTML...项目的需求是各种各样的,了解如何自定义导航菜单HTML 结构就十分重要了。 wp_nav_menu 函数 囿于篇幅,本文不会教你怎么使用wp_nav_menu 函数,请自行补习。...="">学习 这个默认的菜单HTML 结构有非常大的限制(比如说我想在每个li前面添加个标签办不了,一些class...的名称也定义不了),如果只这么用根本不能适应各种各样的项目需求,好在WordPress 提供了一个Walker_Nav_Menu ,通过这个我们可以自定义HTML 结构。...例子: 比如说WordPress 中输出二级菜单的话,ul名默认是sub-menu,那我想改为child-menu,怎么办?

2.4K70
您找到你想要的搜索结果了吗?
是的
没有找到

WordPress主题制作(四):制作头部模板header.php

我们一起来看看如何修改header.php吧。 修改页面标题 不同页面的标题都是不一样,而且title的设置会影响到SEO的效果,应该谨慎设置。...>" /> 添加wp_head 有些插件需要在网页头部执行一些添加一些js或css的动作,要让这些插件能够正常的工作,也让你的主题有更好的兼容性,你应该添加wp_head()函数。...$description1 : $description2; // 填写自定义字段keywords时显示自定义字段的内容,否则使用文章tags作为关键词 $keywords = get_post_meta...>" /> 显示菜单栏 这里只在菜单栏中列出页面page,将header.php中以下代码: /">主页 刷新缓存 在前面,后面添加PHP代码,用于提高程序运行效率: 本次练习到此结束!

1.2K20

WordPress 主题进行单元测试(Theme Unit Test)

在制作 WordPress 的过程中,除了对整体的结构等进行排版布局等,还必须要对正文的内容和其他地方进行修饰和排版,例如正文中可能出现的 标题(h2、h3)、列表(ul、ol)、表格(table) 以及不同的文章类型效果等等...这就是 WordPress 主题的单元测试(Theme Unit Test)。 单元测试是比较复杂的工作,特别是添加测试数据。...成至少两个自定义菜单: 大菜单:包含所有的页面链接 小菜单:包含2、3个页面链接 测试主题文件的一般准测 需要检查主题中的如下文件:默认首页模板(index.php)、存档模板(archive.php)...(Menus)测试 测试大量的分类目录和页面组成的菜单是否显示正常,测试多层菜单是否正常显示不错位 如果主题的自定义菜单可用,测试启用自定义菜单和没有启用时使用默认菜单的布局,测试是否正常无错位 部件(...Widgets)测试 所有的部件显示是否正常 WordPress 内置的部件在所有的显示部件的区域显示正常,并加样式合理修饰 如果主题使用自定义部件,测试自定义部件是否工作正常 在所有可以使用部件的区域测试所有部件的显示效果和功能是否正常

1.8K10

WPJAM Basic 扩展:相关文章

我很早之前就基于 WordPress 的标签和分类写过一个 WordPress 相关文章的插件,后来有个外国人,想利用它做个服务,那时候太穷,我就1万美元卖给他了,不过那个插件可以说是我爱水煮鱼博客的成名之作...「相关文章」扩展功能 WPJAM Basic 的「相关文章」的扩展通过简单的方式实现 WordPress 相关文章的功能,主要有下面三个功能: 「相关文章」扩展还是基于标签和分类,并且如果系统有自定义分类...使用「相关文章」扩展 启用扩展之后,在 「WPJAM」主菜单下的「文章设置」菜单就会出现「相关文章」的标签页,点击进去就可以进行设置。...样式:为了方便大家样式化相关文章列表,这里提供了两个选项:外层 div id 和 相关文章列表 ul 的 class,外层 div id 不填则外层不添加 div。...比如我博客的相关这样设置后,在通过 CSS 就可以定义成下面的样式: 自动:就是自动附加相关文章列表到文章末尾,如果没有勾选该选项,你需要在主题中添加下面获取相关文章列表函数wpjam_get_related_posts

40220

WordPress主题开发基础:Body 指南

您可以自定义特定的作者个人资料页面,基于日期的档案等。 现在让我们看一下如何以及何时使用body。...如何添加自定义body WordPress有一个过滤器,您可以在需要时使用它来添加自定义body。...在您展示特定用例场景之前,我们将您展示如何使用过滤器添加body,以便每个人都可以在同一页面上。...现在,在这种情况下,您可以将条件标记与一些自定义代码一起使用,以将自定义动态添加到body。 为此,您需要将以下代码添加到主题的functions.php文件中。...例如,如果您使用诸如Genesis之类的主题框架,则可以使用它在主题中添加自定义。 您可以使用body_class函数为全宽页面布局、侧边栏内容、页眉和页脚等添加CSS

2K20

Sticky Posts Switch插件教程WordPress中为分类添加置顶文章

在本文中,我们晓得博客将您展示如何WordPress中为类别添加置顶文章。 注意:Sticky Post仅适用于内置帖子类型帖子,不适用于自定义帖子类型。  ...推荐:Astra主题怎么设置顶部固定菜单/粘性浮动菜单为什么要在WordPress类别添加置顶文章?  随着网站的发展,新访问者可能很难找到您的内容或热门文章。...Sticky Posts Switch插件简介  该插件在帖子管理列中添加了一个新列,可让您轻松标记帖子以使其具有粘性。...Sticky Posts Switch插件教程WordPress中为分类添加置顶文章 Sticky Posts Switch插件的特点使您可以对首页、存档页面或类别页面上的每个自定义帖子类型使用粘性帖子功能对自定义帖子类型的快速和批量编辑支持选择帖子类型...和 MultilingualPress如何WordPress中为类别添加置顶文章?

5.5K20

WordPress后台仪表盘“概览”小工具添加其他文章类型数据

WordPress自定义文章类型是非常好的一个功能,允许我们根据需求创建和文章等类似的文章类型,每种文章类型都有自己的管理菜单和功能。...如果你的网站拥有自定义文章类型,你肯定希望可以文章、页面和评论一样,在仪表盘的【概览】小工具显示其他文章类型的数据,如下图所示: 这就是WordPress大学今天要分享的教程:如何WordPress...后台仪表盘“概览”小工具添加其他文章类型数据。...你只需要根据自己的实际情况,修改第四行代码的 array() 数组的文章类型别名,然后添加到当前主题的 functions.php 即可。...如果你要查看文章类型的值,可以在后台点击对应文章类型导航菜单下的第一个菜单,比如页面-全部页面,就可以在网址中看到 /wp-admin/edit.php?

39720

WordPress 初学者词汇表(术语解释)

除了父主题之外,还使用主题来显示自定义。当您想对主题(实际代码)进行核心更改时,您需要使用主题来继续更新您的父主题。...Plugin(插件) 插件是一种扩展功能或其他软件添加特定功能的软件。...在 WordPress 中,小部件用于Widget Areas(小部件区域)添加内容和功能,例如侧边栏、页脚或启用小部件的任何其他位置。...这可以包括上传自定义徽标、选择主要网站强调色、创建菜单添加小部件、自定义帖子类型设置等等。此部分可以在外观 > 自定义下的 WordPress 主仪表板中找到。...幸运的是,您的 WordPress 网站添加 SSL很容易,而且由于 Let’s Encrypt 等服务通常是免费的。

7.1K20

WordPress主题开发必备函数wp_list_categories获取分类列表

WordPress主题开发必备函数wp_list_categories获取分类列表,将分类以列表的形式显示为链接。...也可以通过wp_list_categories()函数来制作网站头部导航栏菜单,这在大多数的CMS主题中我们就可以常常看到。 'name',//分类列表按什么排序,这里是按名称排列'order'=>'ASC',//分类列表的排序,这里是升序;DESC - 降序'style'=>'list',//是否用列表样式(ul...无分类时显示的标题'number'=>null,//显示多少个分类'echo'=>1,//是否显示,显示或者返回字符串'depth'=>0,//层级限制'current_category'=>0,//添加一个没有的分类...'taxonomy'=>'category',//使用的分类法'walker'=>null//用于显示的); wp_list_categori·es($args); ?

1.1K10

前端|Bootstrap——导航组件

通常都是利用列表实现来导航的,常用的是无序列表()和有序列表()。自定义列表()一般不会用来实现导航。 常见的导航菜单有标签式的导航菜单,胶囊式的导航菜单等等。...图1.1 效果图 问题描述 如何制作导航菜单 首先要引入jquery.js、bootstrap.min.js和bootstrap.min.css文件。... 元素添加一个标题class="active",则表示当前默认菜单选项,添加class=“navbar-header”,会让文本看起来更大一号如下图就是现在的效果图: ?...图2.1 效果图 (2)页面可跳转的菜单栏 常见的导航菜单是一定可以实现页面切换的。这里就可以利用a标签。实现标签切换只需要在a标签上添加自定义属性data-toggle=“tab”。...下来菜单的实现需要使用到触发器“dropdown”,标签添加添加data-toggle="dropdown" 就可以实现切换下拉菜单功能。

6.6K10

如何WordPress网站中添加Cookie弹出窗口(不使用插件)

在这篇文章中,晓得博客为你详细介绍不适用插件如何WordPress 网站中添加Cookie弹出窗口。...不适用插件WordPress网站添加Cookie通知   WordPress网站添加插件可能会减慢速度。因此,如果可能,最好限制插件安装并手动调整所有内容。...找到你使用的主题,找到header.php文件(如果没有的话,可以复制主题的header.php到主题)。 5、打开文件并将代码粘贴到标记下。 6、单击更新文件以保存更改。...总结   以上为不使用插件在WordPress网站中添加Cookie弹出窗口,现在,你已经学会了如何通过粘贴生成的代码来显示WordPress Cookie通知。...推荐:如何WordPress网站中添加免费在线聊天功能-Chaty插件教程 晓得博客,版权所有丨如未注明,均为原创 晓得博客 » 如何WordPress网站中添加Cookie弹出窗口(不使用插件)

4K30

纯代码给WordPress网站手机端底部添加菜单栏功能

前段时间突发奇想,想给自己的WordPress网站手机端底部加个菜单栏,但是怎么实现呢,于是全百科网研究了两天终于有了办法,所以今天就分享给大家如何实现。...2、打开 style.css 文件,在最后面添加 css 样式,大家可以自己美化修改: // 作者:全百科网 // 网站:http://www.quanbaike.com/ /** footer menu...li:last-child { border-right: 0; } .footer-nav ul li a { line-height: 35px; } .footer-nav ul...important; } 3、找到自用主题常用的 js 文件,打开并在其最后添加以下 js 代码: // 作者:全百科网 // 网站:http://www.quanbaike.com/ // 页脚菜单...实现方法是不是很简单,快给你的WordPress网站手机端底部添加菜单栏功能吧。

1.1K40

实用的五大WordPress下拉菜单插件推荐

实用的五大WordPress下拉菜单插件推荐 ---- 我们在使用WordPress建站的时候经常会在网站添加下拉菜单,因为添加下拉菜单具有改善网站导航、将重要内容放在首屏上、避免用户过度滚动和增强用户体验等等优势...WP Mega Menu by Themeum WP Mega Menu是您的站点添加下拉菜单的最佳选择之一。如果您正在寻找一种简单的解决方案来组织网站链接,那么此插件非常适合您。...使用UberMenu创建的菜单可在任何设备上响应,因此用户无论与之交互如何,都可以享受您的导航。 3....这个免费WordPress插件需要零编码技能,因此即使是初学者,也可以在其WordPress网站上添加漂亮的菜单。响应式菜单带有150多个自定义选项,因此您可以按照自己的需要创建下拉菜单。...它的富文本编辑器使您可以使用易于添加到不同文章和页面的短代码来设置自定义内容的样式。通过合并图标、图像、文本、章节等来设计菜单项。 5.

2.3K20

WordPress设置首页页脚友链(附wp_list_bookmarks配置)

有些WordPress主题因为是单栏主题同时没有配置首页页脚友链的功能,导致主页不通过自定义HTML是没办法放置友链,这样的话,无论是站长之家的友链检测,还是百度来的爬虫,都是没办法检测到自己网站的友链的...(因为友链全部都放在页了),所以我们可以通过WP后台的主题编辑器来添加首页页脚友链。...-- 友情链接调用 --> 并将下列CSS代码放于style.css的最下面或者WordPress后台 - 外观 - 自定义 - 额外CSS,如果主题设置中有前台自定义CSS也可以放在这里面。...class (字符串)链接分类列表所在。默认值为'linkcat'。 category_orderby (字符串)用以排列链接分类的值。...1 (true) 0(false)——默认值 show_updated (布尔型)是(TRUE)否(FALSE)显示最近更新的时间标记

1.1K10

wordpress导航菜单详解及改造

当然照我所写代码也可 具体怎么使用稍后会讲 然后在wp后台菜单处显示如下 至于怎么设置菜单,具体见下面wordpress大学的教程 https://www.wpdaxue.com/wordpress-nav-menus.html...'%3$s' 去ul保持li不变 更多相关的内容 参考官方对菜单函数的说明 https://developer.wordpress.org/reference/functions/wp_nav_menu.../ 下面是一些实例 如果只用最简单的代码 输出的结构是这样的 (方便起见,不写名) 如果我们要更改输出的结构 像外层div 只需 'container' => false 即可 如果要去除外层ul 那么可以这样写...一般来说 我们最多只需要二级菜单 我们只需把depth改为2即可 但如果要三级菜单以上呢 可不是简简单单那改个depth就行了 构造三级菜单 我们需要对菜单进行定制 需要使用walker参数 该参数接受一个自定义的...sub-menu,三级菜单名为third-menu的菜单 四级菜单

3K70
领券