当前位置:首页 > CMS教程 > WordPress > 列表

WordPress中添加Add_Meta_Box使用方法

发布:smiling 来源: PHP粉丝网  添加日期:2015-03-23 15:41:58 浏览: 评论:0 

Add_Meta_Box是从wordpress2.5以来出的一个插件了,我们可以利用它来实现添加meta模块了,具体来看一些例子,希望对各位有帮助.

描述:add_meta_box() 函数是在 WordPress 2.5 添加的,用来给插件开发者添加 Meta模块 到管理界面.

用法:

  1. <?php 
  2.    add_meta_box( $id$title$callback$post_type$context,$priority$callback_args ); 
  3. ?> 

参数:

$id(字符串)(必需)Meta模块的 HTML“ID”属性

$title(字符串)(必需)Meta模块的标题,对用户可见

$callback(回调)(必需)为Meta模块输出 HTML代码的函数

$post_type(字符串)(必需)显示Meta模块的文章类型,可以是文章(post)、页面(page)、链接(link)、附件(attachment) 或 自定义文章类型(自定义文章类型的别名)

$context(字符串)(可选)Meta模块的显示位置('normal','advanced', 或 'side')

默认值:'advanced'

$priority:(字符串)(可选)Meta模块显示的优先级别('high', 'core', 'default'or 'low')

默认值: 'default'

$callback_args:(数组)(可选)传递到 callback 函数的参数。callback 函数将接收 $post 对象和其他由这个变量传递的任何参数。

以添加一个自定义字段——【推荐指数】为例,来讲讲如何使用Meta Box。

备注:推荐指数,在本例中指的是文章作者对文章的打分,分数在1~10分,为整数。分数越高,越推荐。这样我们可以通过下拉列表来选择值了。

首先,需要使用到add meta boxes Action,该Action允许我们为任何文章类型注册Meta Box,在该Action中,我们需要使用add_meta_box()方法来添加Meta Box的相关信息,代码如下:

  1. function add_rating_meta_box($post_type$post) { 
  2.     // 需要哪些post type添加推荐指数 Meta Box 
  3.     $types = array'post''page' ); 
  4.      
  5.     foreach ( $types as $type ) { 
  6.         add_meta_box( 
  7.             'rating_meta_box_id'// Meta Box在前台页面中的id,可通过JS获取到该Meta Box 
  8.             '推荐指数'// 显示的标题 
  9.             'render_rating_meta_box'// 回调方法,用于输出Meta Box的HTML代码 
  10.             $type// 在哪个post type页面添加 
  11.             'side'// 在哪显示该Meta Box 
  12.             'default' // 优先级 
  13.         ); //开源软件:phpfensi.com 
  14.     } 
  15. add_action( 'add_meta_boxes''add_rating_meta_box' ); 

这里我们在$types数组中定义了Post和Page都需要推荐指数这个自定义字段,然后告诉WordPress使用“render_rating_meta_box”方法来渲染Meta Box,位置在侧边栏(side),因为内容不多,所以侧边栏足够,若内容较多,可以将“side”改为“advanced”,这样就会在主内容区域渲染Meta Box.

接下来看看是如何渲染的,代码如下:

  1. function render_rating_meta_box( $post ) { 
  2.     // 添加 nonce 项用于后续的安全检查 
  3.     wp_nonce_field( 'rating_nonce_action''rating_nonce_name' ); 
  4.     // 获取推荐指数的值 
  5.     $rating_key = 'rating'
  6.     $rating_value = get_post_meta( $post->ID, $rating_key, true ); 
  7.     $rating_value = (int)$rating_value
  8.     $html = '<select name="rating_field">'
  9.     for ($i = 0; $i <= 10; $i++) { 
  10.         $selected = ''
  11.         if ($i == $rating_value) { 
  12.             $selected = 'selected="selected"'
  13.         }//开源软件:phpfensi.com 
  14.         $html .= sprintf('<option value="%s" %s>%s星</option>'$i$selected$i/2); 
  15.     } 
  16.     $html .= '</select>'
  17.     echo $html

这里先使用wp_nonce_field()添加了一个nonce field,用来做安全检查,然后,读取推荐指数的值,循环1~10来输出可供选择的值,如果和推荐指数相同,则默认选上,通过下拉框,既可以解决输入不方便和无法验证的问题,记住这里下拉框的name属性的值(rating_field),将通过它在下面的代码中获取选择的值.

最后,当文章被保存时,需要将推荐指数也保存起来,代码如下:

  1. function save_rating_post_data( $post_id ) { 
  2.     // 检查nonce是否设置 
  3.     if (!isset($_POST['rating_nonce_name'])) { 
  4.         return $post_id
  5.     } 
  6.     $nonce = $_POST['rating_nonce_name']; 
  7.     // 验证nonce是否正确 
  8.     if (!wp_verify_nonce( $nonce'rating_nonce_action')) { 
  9.         return $post_id
  10.     } 
  11.     // 如果是系统自动保存,则不操作 
  12.     if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) { 
  13.         return $post_id
  14.     } 
  15.      
  16.     // 检查用户权限 
  17.     if ($_POST['post_type'] == 'post') { 
  18.         if (!current_user_can('edit_post'$post_id )) { 
  19.             return $post_id
  20.         } 
  21.     } 
  22.     $rating_key = 'rating'
  23.     // 获取数据 
  24.     $rating_value = $_POST['rating_field']; 
  25.     // 更新数据 
  26.     update_post_meta( $post_id$rating_key$rating_value ); 
  27. add_action( 'save_post''save_rating_post_data' ); 

这里做了一系列检查,包括对刚刚设置的nonce检查,用户权限的检查,排除自动保存的情况,然后使用update_post_meta()方法将数据存入数据库.

至此,我们就完成了对推荐指数自定义字段的改装,可以很方便的选择文章的推荐指数,等等。。。

细心的朋友可能发现了,在应用了上面三段代码后,的确可以实现功能,但是,在默认的自定义栏目区域下,是可以看到,有一个名为“rating”的栏目,这就是我们刚刚选择的推荐指数,如果想让他不在自定义栏目下,显示,可以将上述代码中的$rating_key改为以下划线开头,这样,WordPress就不会显示出来了,注意有两个地方要改,代码如下:

  1. // 原来的代码 
  2. $rating_key = 'rating'
  3. // 改后的代码 
  4. $rating_key = '_rating'

添加meta box 来上传图片

1.首先要支持图片的上传,要在functions.php中加入一下代码:

  1. function my_add_edit_form_multipart_encoding() { 
  2.     echo ' enctype="multipart/form-data"'
  3. add_action('post_edit_form_tag''my_add_edit_form_multipart_encoding'); 

2.然后安装meta box,代码如下:

  1. function my_setup_meta_boxes() { 
  2.     add_meta_box('my_image_box''Upload Image''my_render_image_attachment_box''page''normal''high');//这个地方的参数大家可以去官方网站查看,我只是要说明一下第4个参数,如果想让post支持就填写post如果是page就填写page,如果是自定义类型就填写自定义类型的名称 
  3. add_action('admin_init','my_setup_meta_boxes'); 

3.添加回调函数,代码如下:

  1. function my_render_image_attachment_box($post) { 
  2.     // 显示添加的图片 
  3.     $existing_image_id = get_post_meta($post->ID,'_my_attached_image', true); 
  4.     if(is_numeric($existing_image_id)) { 
  5.         echo '<div>'
  6.             $arr_existing_image = wp_get_attachment_image_src($existing_image_id'large'); 
  7.             $existing_image_url = $arr_existing_image[0]; 
  8.             echo '<img src="' . $existing_image_url . '" />'
  9.         echo '</div>'
  10.     } 
  11.     // 如果已经上传了图片就提示 
  12.     if($existing_image) { 
  13.         echo '<div>Attached Image ID: ' . $existing_image . '</div>'
  14.     }  
  15.     echo 'Upload an image: <input type="file" name="my_image" id="my_image" />'
  16.     // 获得图片的状态 
  17.     $status_message = get_post_meta($post->ID,'_my_attached_image_upload_feedback', true); 
  18.     // 显示图片状态 
  19.     if($status_message) { 
  20.         echo '<div class="upload_status_message">'
  21.             echo $status_message
  22.         echo '</div>'
  23.     } 
  24.     // 自动保存 
  25.     echo '<input type="hidden" name="my_manual_save_flag" value="true" />'

4.图片的更新,代码如下:

  1. function my_update_post($post_id$post) { 
  2.  //获得图片类型 
  3.     $post_type = $post->post_type; 
  4.     if($post_id && isset($_POST['my_manual_save_flag'])) {  
  5.         switch($post_type) { 
  6.             case 'page'
  7.                 if(isset($_FILES['my_image']) && ($_FILES['my_image']['size'] > 0)) { 
  8.                     $arr_file_type = wp_check_filetype(basename($_FILES['my_image']['name'])); 
  9.                     $uploaded_file_type = $arr_file_type['type']; 
  10.                     $allowed_file_types = array('image/jpg','image/jpeg','image/gif','image/png'); 
  11.                     if(in_array($uploaded_file_type$allowed_file_types)) { 
  12.                         $upload_overrides = array'test_form' => false );  
  13.                         $uploaded_file = wp_handle_upload($_FILES['my_image'], $upload_overrides); 
  14.                         if(isset($uploaded_file['file'])) { 
  15.                             $file_name_and_location = $uploaded_file['file']; 
  16.                             $file_title_for_media_library = 'your title here'
  17.                             $attachment = array
  18.                                 'post_mime_type' => $uploaded_file_type
  19.                                 'post_title' => 'Uploaded image ' . addslashes($file_title_for_media_library), 
  20.                                 'post_content' => ''
  21.                                 'post_status' => 'inherit' 
  22.                             ); 
  23.                             $attach_id = wp_insert_attachment( $attachment$file_name_and_location ); 
  24.                             require_once(ABSPATH . "wp-admin" . '/includes/image.php'); 
  25.                             $attach_data = wp_generate_attachment_metadata( $attach_id$file_name_and_location ); 
  26.                             wp_update_attachment_metadata($attach_id,  $attach_data); 
  27.                             $existing_uploaded_image = (int) get_post_meta($post_id,'_my_attached_image', true); 
  28.                             if(is_numeric($existing_uploaded_image)) { 
  29.                                 wp_delete_attachment($existing_uploaded_image); 
  30.                             } 
  31.                             update_post_meta($post_id,'_my_attached_image',$attach_id); 
  32.                             $upload_feedback = false; 
  33.                         } else {  
  34.                             $upload_feedback = 'There was a problem with your upload.'
  35.                             update_post_meta($post_id,'_my_attached_image',$attach_id); 
  36.                         } 
  37.                     } else {  
  38.                         $upload_feedback = 'Please upload only image files (jpg, gif or png).'
  39.                         update_post_meta($post_id,'_my_attached_image',$attach_id); 
  40.                     } 
  41.                 } else {  
  42.                     $upload_feedback = false; 
  43.                 } 
  44.                 update_post_meta($post_id,'_my_attached_image_upload_feedback',$upload_feedback); 
  45.             break
  46.             default
  47.         }  
  48.     return
  49. }  
  50.     return
  51. add_action('save_post','my_update_post',1,2); 

Tags: WordPress Add_Meta_Box

分享到: