您现在的位置是:首页 > cms教程 > WordPress教程WordPress教程
WordPress添加Meta Box的方法教程
符彬政2025-03-28WordPress教程已有人查阅
导读需要使用到add meta boxes Action,该Action允许我们为任何文章类型注册Meta Box,在该Action中,我们需要使用add_meta_box()方法来添加Meta Box的相关信息。代码如下
需要使用到add meta boxes Action,该Action允许我们为任何文章类型注册Meta Box,在该Action中,我们需要使用add_meta_box()方法来添加Meta Box的相关信息。代码如下
接下来看看是如何渲染的
之后,当文章被保存时,需要将推荐指数也保存起来
至此,我们就完成了对推荐指数自定义字段的改装,可以很方便的选择文章的推荐指数。
等等。。。
细心的朋友可能发现了,在应用了上面三段代码后,的确可以实现功能。但是,在默认的自定义栏目区域下,是可以看到,有一个名为“rating”的栏目,这就是我们刚刚选择的推荐指数。如果想让他不在自定义栏目下,显示,可以将上述代码中的$rating_key改为以下划线开头,这样,WordPress就不会显示出来了。注意有两个地方要改。
function add_rating_meta_box($post_type, $post) {
// 需要哪些post type添加推荐指数 Meta Box
$types = array( 'post', 'page' );
foreach ( $types as $type ) {
add_meta_box(
'rating_meta_box_id', // Meta Box在前台页面中的id,可通过JS获取到该Meta Box
'推荐指数', // 显示的标题
'render_rating_meta_box', // 回调方法,用于输出Meta Box的HTML代码
$type, // 在哪个post type页面添加
'side', // 在哪显示该Meta Box
'default' // 优先级
);
}
}
add_action( 'add_meta_boxes', 'add_rating_meta_box' );
这里我们在$types数组中定义了Post和Page都需要推荐指数这个自定义字段,然后告诉WordPress使用“render_rating_meta_box”方法来渲染Meta Box,位置在侧边栏(side)。因为内容不多,所以侧边栏足够,若内容较多,可以将“side”改为“advanced”,这样就会在主内容区域渲染Meta Box。接下来看看是如何渲染的
function render_rating_meta_box( $post ) {
// 添加 nonce 项用于后续的安全检查
wp_nonce_field( 'rating_nonce_action', 'rating_nonce_name' );
// 获取推荐指数的值
$rating_key = 'rating';
$rating_value = get_post_meta( $post->ID, $rating_key, true );
$rating_value = (int)$rating_value;
$html = '<select name="rating_field">';
for ($i = 0; $i <= 10; $i++) {
$selected = '';
if ($i == $rating_value) {
$selected = 'selected="selected"';
}
$html .= sprintf('<option value="%s" %s>%s星</option>', $i, $selected, $i/2);
}
$html .= '</select>';
echo $html;
}
这里先使用wp_nonce_field()添加了一个nonce field,用来做安全检查,然后,读取推荐指数的值,循环1~10来输出可供选择的值,如果和推荐指数相同,则默认选上。通过下拉框,既可以解决输入不方便和无法验证的问题。记住这里下拉框的name属性的值(rating_field),将通过它在下面的代码中获取选择的值。之后,当文章被保存时,需要将推荐指数也保存起来
function save_rating_post_data( $post_id ) {
// 检查nonce是否设置
if (!isset($_POST['rating_nonce_name'])) {
return $post_id;
}
$nonce = $_POST['rating_nonce_name'];
// 验证nonce是否正确
if (!wp_verify_nonce( $nonce, 'rating_nonce_action')) {
return $post_id;
}
// 如果是系统自动保存,则不操作
if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) {
return $post_id;
}
// 检查用户权限
if ($_POST['post_type'] == 'post') {
if (!current_user_can('edit_post', $post_id )) {
return $post_id;
}
}
$rating_key = 'rating';
// 获取数据
$rating_value = $_POST['rating_field'];
// 更新数据
update_post_meta( $post_id, $rating_key, $rating_value );
}
add_action( 'save_post', 'save_rating_post_data' );
这里做了一系列检查,包括对刚刚设置的nonce检查,用户权限的检查,排除自动保存的情况。然后使用update_post_meta()方法将数据存入数据库。至此,我们就完成了对推荐指数自定义字段的改装,可以很方便的选择文章的推荐指数。
等等。。。
细心的朋友可能发现了,在应用了上面三段代码后,的确可以实现功能。但是,在默认的自定义栏目区域下,是可以看到,有一个名为“rating”的栏目,这就是我们刚刚选择的推荐指数。如果想让他不在自定义栏目下,显示,可以将上述代码中的$rating_key改为以下划线开头,这样,WordPress就不会显示出来了。注意有两个地方要改。
// 原来的代码
$rating_key = 'rating';
// 改后的代码
$rating_key = '_rating';
本文标签:
很赞哦! ()
相关教程
- Flask与Node.js有什么区别?后端框架选型、并发模型与项目对照教程
- Node.js http.ServerResponse.headersSent教程:响应头状态判断与ERR_HTTP_HEADERS_SENT防御
- Node.js process.hrtime()教程:纳秒级计时、Legacy状态解析与hrtime.bigint()迁移
- Node.js fs.rmdir()专业教程:从废弃API到fs.rm()迁移的工程决策
- Node.js process.getegid()教程:POSIX有效组标识读取、平台守卫与权限模型
- Node.js keyObject.asymmetricKeyDetails教程:RSA/EC/DSA密钥参数读取、版本差异与校验
- Node.js crypto.secureHeapUsed()教程:安全堆监控、OpenSSL 内存隔离与生产环境实践
- Node.js util.types.isUint8Array()教程:跨上下文类型判断与二进制数据入口校验
- Node.js URLSearchParams.sort()教程:查询参数排序、稳定性与签名场景实践
- Node.js os.loadavg()怎么用?1/5/15分钟负载均值、Windows返回零值与系统容量判断教程
- Node.js hmac.update()怎么用?HMAC流式更新、编码参数陷阱与Webhook签名验证教程
- Node.js console.trace() 调试方法:调用栈捕获、异步边界与工程化排查教程
图文教程
wordpress网站下载到本地运行测试
作为站长而言,有时候我们可能会碰到更换服务器或者为网站做一个整体布局修改和升级,我们首先需要做的就是对数据库和整个wordpress网站的 主题和插件等等相关文件进行本地备份。
wordpress官网网址是多少,wordpress官网是什么
wordpress官网是“wordpress.org”,但下载的安装包可能因为带有谷歌字体等原因造成网站访问缓慢;国内用户应该访问“cn.wordpress.org”地址
wordpress怎么打包成app,wordpress打包成app的方法
wordpress打包成app,我们可以使用相关插件来简单实现。插件1:AppPresser;插件2:MobiLoud;插件3:Androapp;插件4:WPApp.Ninja
WordPress路径URL伪静态设置方法
WordPress中默认的URL为动态的,为了优化需要将其设置为固定链接。通过WordPress后台,设置---固定连接,选择自定义结构,我设置的是 /%post_id%.html,设置完之后,在前台浏览时
相关源码
-
(响应式自适应)小学初中作文论文文章资讯博客pbootcms模板下载为中小学作文、教育类网站设计,特别适合展示学生作文、教学资源和写作指导等内容。采用响应式技术,确保在不同设备上都能获得良好的阅读体验。查看源码 -
(PC+WAP)院校学院职业学校机构协会网站开源源码下载本模板基于PbootCMS系统开发,为高等院校、职业学校等教育机构设计,特别适合展示学校概况、院系设置、招生信息等内容。采用双端适配技术,确保在PC和移动设备上都能获得良好的浏览体验。查看源码 -
帝国cms7.5大型游戏资讯门户网站源码免费下载本模板基于帝国CMS7.5内核开发,为大型游戏资讯门户网站设计。模板自带响应式手机版,适配多种终端设备。内容架构针对游戏行业特点优化,支持游戏资讯、评测、攻略等内容类型的发布与管理。查看源码 -
(自适应)WordPress二次元博客主题SakurairoSakurairo主题为二次元内容创作者设计,提供丰富的动漫风格元素和个性化的展示效果。该主题在原有Sakura主题基础上进行了功能增强,支持多种自定义设置,满足动漫爱好者建立个人博客的需求。查看源码 -
(PC+WAP)历史复古古典古籍文章资讯类pbootcms模板下载本模板基于PbootCMS系统开发,为古籍研究、历史文献类网站设计,特别适合展示古典书籍、历史档案等文化内容。采用复古风格设计,同时具备现代化响应式布局,确保在PC和移动设备上都能呈现优雅的阅读体验。查看源码 -
pbootcms模板(PC+WAP)微信小程序开发公司网站本模板为微信小程序开发代理、软件开发公司等企业设计,基于PbootCMS内核开发,支持PC+WAP双端响应式布局,数据实时同步,适用于多行业快速建站。查看源码
| 分享笔记 (共有 篇笔记) |

