シェアオフィス6F
貸会議室6F

こんにちは。コワーキングスペース7Fのスタッフのユースケです。

今日はWordPressの管理画面の投稿一覧をちょっとカスタマイズするお話しです。

カスタムフィールド、みなさん使っていますよね?

以前、【WordPress】カスタムフィールドの日付項目で並び替え・期間指定して記事を取得では、サイト上で記事を表示させるときに並び替える小技を紹介しましたが、今日は管理画面で並び替える小技です!

投稿一覧は、タイトルやカテゴリー、タグ、投稿日なんかが表示されていて、タイトルと投稿日で並び替えが出来るようになっています。
やりたいことは、ここにカスタムフィールドを表示させて、その項目での並び替えです。

まずはカスタムフィールドを表示させましょう。
前回の記事でも例にあげた「開催日」を表示させてみましょう。

任意の項目を投稿一覧に表示させるには、2つのフックを利用します。

1つ目は、「manage_posts_columns」です。
こちらは投稿一覧に表示されるカラムのリストに適用されるフィルターです。
引数が連想配列(Key:カラム名、Value:表示名)になっているので、そちらに追加して戻り値として返せばOKです。

2つ目は、「manage_posts_custom_column」です。
こちらは上記で追加したカラムリストに実際の情報を挿入するアクションです。
引数がカラム名と投稿IDになっているので、カラム名が一致した時に該当のカスタムフィールド値を出力するようにすればOKです。

サンプルコードはこちら

function manage_custom_columns($columns) {
    $columns['開催日'] = '開催日';
    return $columns;
}
add_filter('manage_posts_columns', 'manage_custom_columns');

function add_custom_columns($column_name, $post_id) {
    if ($column_name == '開催日') {
        echo date('Y年m月d日', strtotime(get_post_meta($post_id, '開催日', true)));
    }
}
add_action('manage_posts_custom_column', 'add_custom_columns', 10, 2);
もし投稿一覧から項目を削除したい場合は、先ほどの「manage_posts_columns」を利用します。
例えば、「タグ」を投稿一覧から削除する場合は下記のようにします。

function manage_custom_columns($columns) {
    unset($columns['tags']);
}
add_filter('manage_posts_columns', 'manage_custom_columns');

これで投稿一覧に項目を追加できましたね。
それでは今度は並び替えです。

投稿一覧の並び替え項目を追加するには、2つのフックを利用します。

1つ目は、「request」です。
こちらは、SQLが生成される前にquery_stringを置き換えるフィルターです。
引数がquery_stringなので、指定項目での並び替えが「orderby」に設定されている場合に、その部分をカスタムフィールド用の指定方式で設定し直して、戻り値として返せばOKです。

2つ目は、「manage_edit-[投稿タイプのslug]_sortable_columns」です。
こちらは、対象の投稿タイプの一覧画面での並び替え項目に適用されるフィルターです。
引数が連想配列(Key:カラム名、Value:表示名)になっているので、そちらに追加して戻り値として返せばOKです。
※フィルターフック名に投稿タイプが含まれているため、投稿タイプごとに指定する必要があります。

サンプルコードはこちら

function column_orderby_custom( $vars ) {
    if ( isset( $vars['orderby'] ) && '開催日' == $vars['orderby'] ) {
        $vars = array_merge( $vars, array(
            'meta_key' => '開催日',
            'orderby' => 'meta_value'
        ));
    }
    return $vars;
}
add_filter( 'request', 'column_orderby_custom' );

function posts_register_sortable( $sortable_column ) {
    $sortable_column['開催日'] = '開催日';
    return $sortable_column;
}
add_filter( 'manage_edit-post_sortable_columns', 'posts_register_sortable' );

上記のコードを functions.php に記載したら、投稿一覧ページを開いてみてください。「開催日」が追加されていますね。
さらにテーブルヘッダーの「開催日」のところにカーソルを当ててみてください。「タイトル」や「日時」のようにクリックできるようになっていて、クリックすると「開催日」で並び替えが行われますね。

いかがでしたでしょうか?
デフォルトの一覧表示から不要な項目を除き必要な項目を追加してあげることで、ユーザーが投稿を探す手間を軽減してあげることができます。今回のような日付項目などは並び替えができると、さらに優しい一覧になりますよね。なにより自分が使いやすいです。
カスタムフィールドを使用する際は、ぜひ一覧表示にも気を配って、使いやすい管理画面にカスタマイズしてみてください。

スポンサーリンク

スポンサーリンク

この記事を書いた人

7Fを運営している株式会社コミュニティコムでプログラマーをしています。担当はWeb制作ですが、受付にもフワッと座ってます。呼称は「ゆーすけ」なので気軽に呼んでください。7F受付にあるチェックインシステムを作った人だったりします。好きなものはお酒です。でも痛風なのでビールは与えないでください!だんだん年齢に抗えなくなってきたので、イイ感じにできる運動があれば紹介してください。



メールマガジン登録

週1回程度でメールマガジンにて、コワーキングスペース7Fのイベントや勉強会情報や近況、Web関係や地域情報などを配信しています。
もし良ければ以下のフォームにメールアドレスを入力して登録してくださいね!

7F情報をぜひフォローください!


スポンサーリンク

月額会員募集中の申し込みフォーム
イベント情報
会議室ご予約
オープンスペースご予約
無料見学ご予約
お問い合わせ
メールマガジン登録フォーム
フロアマップ
よくある質問
Amazonコワーキングスペース7Fのほしい物リスト
一時託児施設利用
7F大学
リブライズ
Eightどこでもスキャン計画
7Fスタッフ募集のお知らせ
シェアオフィス6F
貸会議室6F

混雑状況やイベント情報

サイト内検索