Edited at

【Wordpress】固定ページ一覧画面の絞り込み検索にテンプレートで検索する項目を設けてみた

More than 1 year has passed since last update.

本記事はTECH PLAY女子部 Advent Calendar 2017に参加しています。


はじめに

こんにちは。

こちらのイベントに参加した際、お酒の勢いでAdvent Calendarにエントリーしたohuronです。

今回はWordpressの固定ページ一覧画面の絞り込み検索にテンプレートで検索する項目を設ける方法をご紹介します。フックをちょっといじれば固定ページだけじゃなく、カスタム投稿一覧画面にも適用できますし、応用すればいろいろな検索項目を設けることができますよ。


今回実装する機能について

本記事では以下の機能を一覧画面に実装します。


  • 絞り込み検索機能に「記事内で使用しているテンプレートによる絞り込み」機能を追加

  • 固定ページ一覧に使用したテンプレートを表示する項目を追加

以上2点を実装すると、一覧画面がこんな感じになります。

FireShot Capture 14 - 固定ページ ‹ おふろ研究所 —_ - https___www.ohuroro.com_ohuro-laboratory_wp-admin_edit.php.png

FireShot Capture 13 - 固定ページ ‹ おふろ研究所 —_ - https___www.ohuroro.com_ohuro-laboratory_wp-admin_edit.php.png


ソース

では早速、ソースコードを見ていきましょう。functions.phpに以下のコードを記載します。

詳細な解説は後述します。


functions.php

/**

投稿一覧画面のカラムにテンプレート名を追加する
**/

add_filter('manage_pages_columns','add_template_columns');

function add_template_columns($columns){

$new_columns = array();

foreach($columns as $key => $value){
if($key === 'author'){
$new_columns['template'] = 'テンプレート';
}
$new_columns[$key] = $value;
}

return $new_columns;
}

add_action('manage_pages_custom_column','custom_template_column',10,2);

function custom_template_column($column,$post_id){

switch($column){

case 'template':
$templates = get_page_templates();
$current_temp = get_post($post_id)->page_template;
$result = __( 'Default Template' );
foreach($templates as $temp_name => $file_name){

if($file_name === $current_temp){
$result = $temp_name;
}
}

echo $result;
break;
}
}

/**
END
**/

/**
投稿一覧画面にテンプレート検索の機能を追加する
**/

add_action('restrict_manage_posts','add_template_dropdown');

function add_template_dropdown(){

$post_type = get_post_type();
$args = array(
'posts_per_page'=>-1,
'post_type' =>'page',
);
$posts = get_posts($args);

for($i = 0;$i < count($posts);$i++){
$value = get_post_meta($posts[$i]->ID,'_wp_page_template',true);
$current_temp[$i] = $value;
}

// 重複した値を削除
$current_temp = array_unique($current_temp);

// キーを振りなおす
$current_temp = array_values($current_temp);

$template = get_page_templates();
echo '<select name="template">';
echo "<option value=\"\">テンプレートタイプ</option>";
if(!empty($_GET['template']) && $_GET['template'] === 'default'){
echo "<option selected value=\"default\">".__( 'Default Template' )."</option>";
}
else{
echo "<option value=\"default\">".__( 'Default Template' )."</option>";
}

foreach($template as $temp_name => $file_name){

for($i=0;$i < count($current_temp);$i++){
if($current_temp[$i] === $file_name && !empty($_GET['template']) && $_GET['template'] === $file_name){
echo "<option selected value=\"{$file_name}\">{$temp_name}</option>";
}elseif($current_temp[$i] === $file_name) {
echo "<option value=\"{$file_name}\">{$temp_name}</option>";
}

}

}
echo '</select>';
}
/**
END
**/

/**
テンプレートを検索条件に加える
**/

add_filter('query_vars','add_param');

function add_param($vars){

$vars[] = 'template';
return $vars;
}

add_filter('posts_where','custom_post_where');

function custom_post_where($where){

global $wpdb;

$template = get_query_var('template');

if(!empty ($template)){

$where .= $wpdb->prepare("AND EXISTS (SELECT * FROM {$wpdb->postmeta} as m WHERE m.post_id = {$wpdb->posts}.ID AND m.meta_key='_wp_page_template' AND m.meta_value = %s)",$template);
}

return $where;
}
/**
END
**/



投稿一覧画面のカラムにテンプレート名を追加する

カラムの追加とカラムの中身の追加処理をしています。

著者欄の左に表示したかったので、add_template_columnsのforeachでキー名が'author'の

配列を検索して、その前にキー名'template'の配列を追加しています。

特にこだわりがない場合は$columns['template'] = 'テンプレート';としてもよいと思います。

manage_pages_columnsー>manage_{$post_type}_posts_columns

manage_pages_custom_columnー>manage_{$post_type}_posts_custom_column

と、することでカスタム投稿タイプに対応することができます。


fucntions.php

    add_filter('manage_pages_columns','add_template_columns');

function add_template_columns($columns){

$new_columns = array();

foreach($columns as $key => $value){
if($key === 'author'){
$new_columns['template'] = 'テンプレート';
}
$new_columns[$key] = $value;
}

return $new_columns;
}

add_action('manage_pages_custom_column','custom_template_column',10,2);

function custom_template_column($column,$post_id){

switch($column){

case 'template':
$templates = get_page_templates();
$current_temp = get_post($post_id)->page_template;
$result = __( 'Default Template' );
foreach($templates as $temp_name => $file_name){

if($file_name === $current_temp){
$result = $temp_name;
}
}

echo $result;
break;
}
}



投稿一覧画面にテンプレート検索の機能を追加する

絞り込み検索の部分に使用しているテンプレートのドロップダウンリストを追加します。

ドロップダウンリストには、現在使用されているテンプレートのみが表示される仕様です。

ドロップダウンリストの生成については、wordpressで用意されているpage_template_dropdown()の使用も考えましたが、検索後の一覧画面を表示する際、検索条件として選択した値にselectedを指定する処理がうまくできませんでした……。


fucntions.php

    add_action('restrict_manage_posts','add_template_dropdown');

function add_template_dropdown(){

$post_type = get_post_type();
$args = array(
'posts_per_page'=>-1,
'post_type' =>'page',
);
$posts = get_posts($args);

for($i = 0;$i < count($posts);$i++){
$value = get_post_meta($posts[$i]->ID,'_wp_page_template',true);
$current_temp[$i] = $value;
}

// 重複した値を削除
$current_temp = array_unique($current_temp);

// キーを振りなおす
$current_temp = array_values($current_temp);

$template = get_page_templates();
echo '<select name="template">';
echo "<option value=\"\">テンプレートタイプ</option>";
if(!empty($_GET['template']) && $_GET['template'] === 'default'){
echo "<option selected value=\"default\">".__( 'Default Template' )."</option>";
}
else{
echo "<option value=\"default\">".__( 'Default Template' )."</option>";
}

foreach($template as $temp_name => $file_name){

for($i=0;$i < count($current_temp);$i++){
if($current_temp[$i] === $file_name && !empty($_GET['template']) && $_GET['template'] === $file_name){
echo "<option selected value=\"{$file_name}\">{$temp_name}</option>";
}elseif($current_temp[$i] === $file_name) {
echo "<option value=\"{$file_name}\">{$temp_name}</option>";
}

}

}
echo '</select>';
}



テンプレートを検索条件に加える

ドロップリストを加えただけでは検索項目として機能しないので、パブリッククエリにtemplateを追加し、パブリッククエリtemplateに値が入っている場合のみ検索条件を追加する、という処理を追加します。


fucntions.php

add_filter('query_vars','add_param');

function add_param($vars){

$vars[] = 'template';
return $vars;
}

add_filter('posts_where','custom_post_where');

function custom_post_where($where){

global $wpdb;

$template = get_query_var('template');

if(!empty ($template)){

$where .= $wpdb->prepare("AND EXISTS (SELECT * FROM {$wpdb->postmeta} as m WHERE m.post_id = {$wpdb->posts}.ID AND m.meta_key='_wp_page_template' AND m.meta_value = %s)",$template);
}

return $where;
}



さいごに

実装すると、こんな風にテンプレートで絞り込み検索ができるようになります!すごい!!

FireShot Capture 16 - 固定ページ ‹ おふろ研究所 —_ - https___www.ohuroro.com_ohuro-laboratory_wp-admin_edit.php.png



FireShot Capture 17 - 固定ページ ‹ おふろ研究所 —_ - https___www.ohuroro.com_ohuro-laboratory_wp-admin_edit.php.png

使用したテンプレートで絞り込み検索をかけたい、ということはあまりないかもしれませんが、もし実装する必要がでてきたとき、この記事の存在を思い出していただけると幸いです。それでは皆様、よいクリスマス&wordpress管理画面カスタムライフを!!!


参考にした記事一覧

WordPress 管理画面の投稿一覧にカラムを追加してカスタムフィールドの値を出す

WordPressの投稿一覧からカスタムフィールドの絞り込み検索を追加するカスタマイズ。