WordPress主題小工具，可以自由拖動到側邊欄，并在前臺實現相應功能！但主題自帶的小工具一般不能滿足我們更強大的需求，怎樣，跟著看看怎么自定義側邊欄小工具！

我們先來了解一些個概念性的東西，不想了解可直接跳過，無妨對后面的小工具制作的理解！WordPress提供了一個WP_Widget類，我們只需要擴展WP_Widget類，就可以制作自己的小工具（widget），此類文件位于 wp-includeswidgets.php，無聊的可以扒來看看！

下面結合實例來說一下小工具的制作流程，實例小工具的功能是實現調用指定分類的文章！下面正式開始：

新建一個文件 cat_posts.php，并在主題 Functions.php 里引入此文件！cat_posts.php 主要包含以下幾個部分：

1、自定義擴展類

首先定義一個 WP_Widget 的擴展類，類名隨意但不得與其它類名沖突，比如 catPostsWidget，同時構造函數。

class catPostsWidget extends WP_Widget {
 /*
  ** 聲明一個數組$widget_ops，用來保存類名和描述，以便在主題控制面板正確顯示小工具信息
  ** $control_ops 是可選參數，用來定義小工具在控制面板顯示的寬度和高度
  ** 最后是關鍵的一步，調用WP_Widget來初始化我們的小工具
  **/
 function catPostsWidget(){
  $widget_ops = array(‘classname’=>’widget_random_posts’,’description’=>’隨機顯示你博客中的文章’);
  $control_ops = array(‘width’=>250,’height’=>300);
  $this->WP_Widget(false, ‘分類文章調用’, $widget_ops, $control_ops);
 }
}

注：構造函數 catPostsWidget() 中定義了兩個數組變量$widget_ops和$control_pos，傳遞給$this->WP_Widget()進行小工具的初始化。

WP_Widget參數詳解：

第一個參數是$id_base，我們一般設置成false即可，也可以使用小工具的名字，如 ‘catPostsWidget’；

第二個參數指定小工具顯示的名稱；

第三個參數指定類名和小工具的描述，這兩個參數結合在一起的效果如下

第四個參數定義小工具的寬度和高度，一般只需要前三個參數即可，它影響的效果是當你把小工具拖到側邊欄時的寬度和高度。

2、擴展類的三個重要函數

小工具擴展類需要定義的三個重要函數：form()、update()、widget()

form()函數一般是用來顯示小工具的選項設置表單，表單的內容根據需要自己定義，示例小工具定義了4個選項可供設置：

title：模塊標題，可設默認值，如“分類文章”；

title_en：英文標題，可設默認值，如“Title”；

num：顯示文章數量，可設默認值，如 10；

cat：分類目錄ID，，可設默認值，如0，即顯示所有分類下的文章

后臺顯示效果：

form() 函數代碼：

function form($instance){
 //title:模塊標題，title_en:英文標題，showPosts:顯示文章數量，cat:分類目錄ID
 $instance = wp_parse_args((array)$instance,array(‘title’=>’分類文章’,’title_en’=>’Title’,’showPosts’=>10,’cat’=>0));//默認值
  $title = htmlspecialchars($instance[‘title’]);
  $title_en = htmlspecialchars($instance[‘title_en’]);
  $showPosts = htmlspecialchars($instance[‘showPosts’]);
  $cat = htmlspecialchars($instance[‘cat’]);
 echo ‘<p style=”text-align:left;”><label for=”‘.$this->get_field_name(‘title’).'”>標題:<input style=”width:200px;” id=”‘.$this->get_field_id(‘title’).'” name=”‘.$this->get_field_name(‘title’).'” type=”text” value=”‘.$title.'” /></label></p>’;
 echo ‘<p style=”text-align:left;”><label for=”‘.$this->get_field_name(‘title_en’).'”>英文標題:<input style=”width:200px;” id=”‘.$this->get_field_id(‘title_en’).'” name=”‘.$this->get_field_name(‘title_en’).'” type=”text” value=”‘.$title_en.'” /></label></p>’;
 echo ‘<p style=”text-align:left;”><label for=”‘.$this->get_field_name(‘showPosts’).'”>文章數量:<input style=”width:200px;” id=”‘.$this->get_field_id(‘showPosts’).'” name=”‘.$this->get_field_name(‘showPosts’).'” type=”text” value=”‘.$showPosts.'” /></label></p>’;
 echo ‘<p style=”text-align:left;”><label for=”‘.$this->get_field_name(‘cat’).'”>分類ID:<input style=”width:200px” id=”‘.$this->get_field_id(‘cat’).'” name=”‘.$this->get_field_name(‘cat’).'” type=”text” value=”‘.$cat.'” /></label></p>’;
}

設置表單中$instance數組的4個key：title、title_en、showPosts、cat（key名可自由定義），然后由 WordPress 的函數 get_field_name 和 get_field_id 將表單中的設置項都保存到相應的數組Key中。

update()函數用于更新保存由 form() 表單傳遞來的設置項數據。

function update($new_instance,$old_instance){
 $instance = $old_instance;
 $instance[‘title’] = strip_tags(stripslashes($new_instance[‘title’]));
 $instance[‘title_en’] = strip_tags(stripslashes($new_instance[‘title_en’]));
 $instance[‘showPosts’] = strip_tags(stripslashes($new_instance[‘showPosts’]));
 $instance[‘cat’] = strip_tags(stripslashes($new_instance[‘cat’]));
 return $instance;
}

注：此函數也可省略不定義，默認返回的將是 $new_instance，也就是說在小工具選項中所做的更改同樣能得到保存，但為了保證表單中數據的安全性，我們可以定義一下，并可使用php函數 strip_tags 和 stripslashes 來過濾掉輸入的不合法的字符。

widget() 函數定義小工具在前臺頁面中的顯示樣式

function widget($args, $instance){
 extract($args);
 $title = apply_filters(‘widget_title’, empty($instance[‘title’]) ? __(‘分類文章Title’,’yang’) : $instance[‘title’]);//小工具前臺標題
 $title = $title . ”.$instance[‘title_en’].”;
 $showPosts = empty($instance[‘showPosts’]) ? 10 : $instance[‘showPosts’];
 $cat = empty($instance[‘cat’]) ? 0 : $instance[‘cat’];  echo $before_widget;
 if( $title ) echo $before_title . $title . $after_title;  $query = new WP_Query(“cat=$cat&showposts=$showPosts&orderby=rand”);
 if($query->have_posts()){
  echo ‘<ul>’;
  while($query->have_posts()){
   $query->the_post();
   echo ‘<li><a href=”‘.get_permalink().'”>’.get_the_title().'</a></li>’;
  }
  echo ‘</ul>’;
 }  echo $after_widget;
}

先使用了extract函數把數組中的keys轉換成變量，然后從$instance中取出保存的各個key的值，再輸出一下文章列表樣式即可。

前端效果圖如下：

注冊小工具

到此，自定義小工具類 catPostsWidget 已經定義完成，最后我們還需要一步：注冊小工具類，以完成對小工具的激活。

register_widget(‘catPostsWidget’);

注：激活代碼要放在類定義之外。

好了，如此完整，你還不趕緊自定義一個！！