上一篇教程中我們介紹了 WordPress 自定義字段,以及自定義字段的操作函數,但是對於自定義字段的時候,在後台添加的使用通過那個面板添加十分不方便,比如你要使用自定義字段來實現 seo 功能,那麼你每次都需要重複輸入字段名稱:titlekeywordsdescription 。

今天這篇文章,我們將講解為自定義字段添加一個固定的面板,這樣就不用每次為每個字段輸入字段名稱了。

説明:不要誤以為自定義面板就是用來添加自定義字段的,你可以通過本篇教程添加一個自定義字段來幹任何事,比如你只是想顯示一個提示信息而已,用來顯示瀏覽次數,等等。。。本篇教程的核心應該是怎樣在後台添加自定義面板。

效果圖:

要在後台創建一個面板,首先了解一個函數:

  1. <?php
  2. add_meta_box( $id$title$callback$post_type$context$priority$callback_args );
  3. //$id--面板的的 id 屬性 (html) 。
  4. //$title--面板標題
  5. //$callback--調用的函數
  6. //$post_type--要在編輯頁面創建面板的文章類型,比如 postpage.. 自定義的文章類型等
  7. //$context--(可選) 面板要顯示的位置,可以使用 normaladvancedside 分別為普通、高級 (貌似跟普通效果差不多) 、邊欄
  8. //$priority--(可選) 顯示的優先級,可以使用 highcoredefaultlow 如果設置為 high 那麼它會顯示在默認的那些自定義字段、評論、作者什麼的前面
  9. //$callback_args--(可選、數組) 要傳給那個 $callback 函數的參數
  10. ?>

準備工作:

1 、準備文件,作者以默認的 twenty ten 主題做測試,在默認主題中新建一個 metabox.php 文件,而後在主題的 functions.php 中 include 該文件。

步驟、(接下來的代碼參考自露兜博客)

一、準備要創建的字段信息,我們將添加 keywords 和 description 兩個字段。在 metabox.php 文件中添加代碼 (php 文件別忘了<?php 和?> 哦):

  1. $new_meta_boxes =
  2. array(
  3.     "description" => array(
  4.         "name" => "description",
  5.         "std" => "這裏填默認的網頁描述",
  6.         "title" => "網頁描述:"),
  7.     "keywords" => array(
  8.         "name" => "keywords",
  9.         "std" => "這裏填默認的網頁關鍵字",
  10.         "title" => "關鍵字:")
  11. );

這是一個二維數組,數組的第一個元素就是 description 字段的信息,包括標題、字段名、描述信息。

二、創建 (顯示) 面板內容的函數

  1. function new_meta_boxes() {
  2.     global $post$new_meta_boxes;
  3.     foreach($new_meta_boxes as $meta_box) {
  4.         $meta_box_value = get_post_meta($post->ID, $meta_box['name'].'_value', true);
  5.         if($meta_box_value == "")
  6.             $meta_box_value = $meta_box['std'];
  7.         echo'<input type="hidden" name="'.$meta_box['name'].'_noncename" id="'.$meta_box['name'].'_noncename" value="'.wp_create_nonce( plugin_basename(__FILE__) ).'" />';
  8.         // 自定義字段標題
  9.         echo'<h4>'.$meta_box['title'].'</h4>';
  10.         // 自定義字段輸入框
  11.         echo '<textarea cols="60" rows="3" name="'.$meta_box['name'].'_value">'.$meta_box_value.'</textarea><br />';
  12.     }
  13. }

該函數用來顯示面板的內容,將作為 add_meta_box 函數才 callback 參數調用。

三、創建面板

  1. function create_meta_box() {
  2.     global $theme_name;
  3.     if ( function_exists('add_meta_box') ) {
  4.         add_meta_box( 'new-meta-boxes', '自定義模塊', 'new_meta_boxes', 'post', 'normal', 'high' );
  5.     }
  6. }

這個函數代碼就不解釋了,看前面函數詳細介紹。

四、保存更新數據

  1. function save_postdata( $post_id ) {
  2.     global $post$new_meta_boxes;
  3.     foreach($new_meta_boxes as $meta_box) {
  4.         if ( !wp_verify_nonce( $_POST[$meta_box['name'].'_noncename'], plugin_basename(__FILE__) ))  {
  5.             return $post_id;
  6.         }
  7.         if ( 'page' == $_POST['post_type'] ) {
  8.             if ( !current_user_can( 'edit_page', $post_id ))
  9.                 return $post_id;
  10.         }
  11.         else {
  12.             if ( !current_user_can( 'edit_post', $post_id ))
  13.                 return $post_id;
  14.         }
  15.         $data = $_POST[$meta_box['name'].'_value'];
  16.         if(get_post_meta($post_id$meta_box['name'].'_value') == "")
  17.             add_post_meta($post_id$meta_box['name'].'_value', $data, true);
  18.         elseif($data != get_post_meta($post_id$meta_box['name'].'_value', true))
  19.             update_post_meta($post_id$meta_box['name'].'_value', $data);
  20.         elseif($data == "")
  21.             delete_post_meta($post_id$meta_box['name'].'_value', get_post_meta($post_id$meta_box['name'].'_value', true));
  22.     }
  23. }

改函數用來保存和更新我們的字段值

 

OK,函數代碼都準備好了,下馬就是觸發了,我們應該先執行 create_meta_box 函數,因為 add_meta_box 是由它調用的。使用動作鈎子,繼續添加下面的代碼:

  1. add_action('admin_menu', 'create_meta_box');
  2. add_action('save_post', 'save_postdata');

同時在保存文章的時候執行更新和保存字段的函數。

 

調用:通過 get_post_meta 函數調用即可

  1. $description = get_post_meta($post->ID, "description_value", true);
  2. $keywords = get_post_meta($post->ID, "keywords_value", true);

注意字段名稱,我們在保存數據的時候,保存的字段名稱分別是 description_value 、 keywords_value 。。。

OK,自定義面板的創建結束。

敬告:此教程發表於 2012 年,建議直接下載本站的提供的框架,研究和使用皆可。