WordPress教程||后台文章添加自定义字段面板

  • A+
所属分类:WordPress技巧

在我们开发WordPress插件的过程中,难免要使用到自定义字段,以及对自定义字段进行操作。这样一来,在对自定义字段进行操作的时候总是在后台来回折腾也挺不方便的。

今天我们就来学习一下,如何为自定义字段添加一个固定的面板,这样就不用每次为每个字段来回的输入名字和值了。

说明一下:添加的自定义字段面板是一种技巧,这个技巧可以用来管理自定义字段,但是不局限于此。我们可以用面板来做很多的事情,这就需要大家细心的发掘了。

首先来看一张效果图:

要在后台创建一个面板,首先了解一个函数:

<?php
add_meta_box( 
  $id, 
  $title, 
  $callback, 
  $post_type, 
  $context, 
  $priority, 
  $callback_args );
//$id--面板的的id属性(html)。
//$title--面板标题
//$callback--调用的函数
//$post_type--要在编辑页面创建面板的文章类型,比如post\page..自定义的文章类型等
//$context--(可选)面板要显示的位置,可以使用normal\advanced\side分别为普通、高级(貌似跟普通效果差不多)、边栏
//$priority--(可选)显示的优先级,可以使用high\core\default\low 如果设置为high那么它会显示在默认的那些自定义字段、评论、作者什么的前面
//$callback_args--(可选、数组)要传给那个$callback函数的参数
?>

一、准备工作:

准备文件,老幾是用在开发的插件做测试,在插件默认的PHP文件中添加相对应的代码。

二、准备要创建的字段信息

我们将添加3个字段,分别为frommate_xxs(文章来源)、fromname_xxs(来源名称)、fromurl_xxs(来源地址)。在PHP文件中添加代码(php文件别忘了<?php 和?>哦):

//创建一个数组
$new_meta_boxes_xxs =
  array( 
    "frommate_xxs" => array("name" => "from_xxs", "std" => "原创?转载?翻译?投稿?", "title" => "文章来源:"),
    "fromname_xxs" => array("name" => "name_xxs", "std" => "",         "title" => "来源名称:"),
    "fromurl_xxs"  => array("name" => "url_xxs",  "std" => "",         "title" => "来源地址:"),
       );

这是一个二维数组,数组的第一个元素就是字段的信息,包括标题、字段名、描述信息。

三、创建(显示)面板内容的函数

//创建要显示的函数		
function new_meta_boxes_xxs() {
  //创建两个全部变量
  global $post, $new_meta_boxes_xxs;
  foreach($new_meta_boxes_xxs as $meta_box) 
   {
    $meta_box_value = get_post_meta($post->ID, $meta_box['name'].'_value', true);
    //若值为空,则显示设置的默认值
    if($meta_box_value == "")$meta_box_value = $meta_box['std'];
    // 自定义字段输入框
    echo'<input type="hidden" name="'.$meta_box['name'].'_noncename" id="'.$meta_box['name'].'_noncename" value="'.wp_create_nonce( plugin_basename(__FILE__) ).'" />';
    echo '<strong>'.$meta_box['title'].'</strong><input style="width: 100%;height: 36px;" type="text" name="'.$meta_box['name'].'_value" value="'.$meta_box_value.'"></input><br />';
  }
}

该函数用来显示面板的内容,将作为add_meta_box函数才callback参数调用。

四、创建面板

//创建面板
function create_meta_box() {
   global $theme_name;
   if ( function_exists('add_meta_box') ) 
    {
    //添加面板的ID、显示的名称、显示内容的函数等信息
    add_meta_box( 'new-meta-boxes_xxs', 'XXS-文章版权信息设置', 'new_meta_boxes_xxs', 'post', 'normal', 'high' );
   }
}

这个函数代码就不解释了,看前面函数详细介绍。

五、保存更新数据

//保存文章的时候保存自定义字段的数据
function save_postdata( $post_id ) {
   global $post, $new_meta_boxes_xxs;
   foreach($new_meta_boxes_xxs as $meta_box) {
     if ( !wp_verify_nonce( $_POST[$meta_box['name'].'_noncename'], plugin_basename(__FILE__) )) {
      return $post_id;
     }
     if ( 'page' == $_POST['post_type'] ) {
      if ( !current_user_can( 'edit_page', $post_id ))
      return $post_id;
     }
     else {
      if ( !current_user_can( 'edit_post', $post_id ))
      return $post_id;
     }
     $data = $_POST[$meta_box['name'].'_value'];
     if(get_post_meta($post_id, $meta_box['name'].'_value') == "")
      add_post_meta($post_id, $meta_box['name'].'_value', $data, true);
     elseif($data != get_post_meta($post_id, $meta_box['name'].'_value', true))
      update_post_meta($post_id, $meta_box['name'].'_value', $data);
     elseif($data == "")
      delete_post_meta($post_id, $meta_box['name'].'_value', get_post_meta($post_id, $meta_box['name'].'_value', true));
   }
}

改函数用来保存和更新我们的字段值

六、函数代码都准备好了,下面就是触发了,

我们应该先执行create_meta_box函数,因为 add_meta_box是由它调用的。使用动作钩子,继续添加下面的代码:

add_action('admin_menu', 'create_meta_box');
add_action('save_post', 'save_postdata');

同时在保存文章的时候执行更新和保存字段的函数。

七、字段信息的调用

通过 get_post_meta函数调用即可

$frommate_xxs = get_post_meta($post->ID, "frommate_xxs_value", true);
$fromname_xxs = get_post_meta($post->ID, "fromname_xxs_value", true);
$fromurl_xxs = get_post_meta($post->ID, "fromurl_xxs_value", true);

注意字段名称,我们在保存数据的时候,保存的字段名称分别是

  • frommate_xxs_value、
  • fromname_xxs_value、
  • fromurl_xxs_value
  • 。。。

OK,自定义面板的创建结束。

版权声明©本文为原创文章,转载本文必须以链接形式注明作者和原始出处。
本文地址:https://www.3cfun.cn/archives/2938
本文出处:业余网民 » WordPress教程||后台文章添加自定义字段面板

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: