こんにちは。建山です。
ひさしぶりのブログ投稿です。

今回は、WordPressの管理画面の投稿一覧にボタンを表示する方法です。
そもそも、こんなことをやりたいニーズは少ないかもしれませんが、
お客様向けに管理画面をカスタマイズされている方などに、少しでもお役に立てたら幸いです。

目標はこんな画面

1

普通の画面

WS000046

方法

1.functions.phpに以下を追記

/* 投稿一覧にボタン追加 */
function add_posts_columns_mybutton($columns) {
 $columns['mybutton'] = 'ボタン';
 return $columns;
}
function add_posts_columns_mybutton_row($column_name, $post_id) {
 if( 'mybutton' == $column_name ) {
 $slug = get_post($post_id) -> post_name;
 echo '<a class="button button-primary" href="'.esc_attr(home_url('/').$slug).'" >投稿を表示</a>';
 }
}
add_filter( 'manage_posts_columns', 'add_posts_columns_mybutton' );
add_action( 'manage_posts_custom_column', 'add_posts_columns_mybutton_row', 10, 2 );

※manage_posts_columnsフックを使って列を追加しています。manage_posts_custom_columnフックを使ってボタンを表示しています。今回は、投稿へのリンクを取得したかったのですが、直接取得できなかったようなので、スラッグを取得してサイトのURLと連結して、投稿へのリンクとしています。

※注意・・・今回の投稿へのリンクは、http://example.com/abcとなりますので、パーマリンク設定を「投稿名」に設定して下さい。 今回は、スラッグを取得しましたが、他にもいろんな投稿の情報を取得して表示させることができます。

2.ボタンを装飾

WS000048

ボタンの装飾には今回、

<a class="button button-primary"href="…">

のように、button、button-primaryと、WordPressが最初から用意しているクラスを付けて装飾しました。好みで、style属性をつけるか、管理画面にadmin_headフックなどを使って、cssを別途読み込ませて装飾してください。

3.完了!

1 2

 

WordPressの投稿一覧は、これ以外にもいろんなカスタマイズができるので、いろいろ試してみてはいかがでしょうか!ありがとうございました。

このブログを書いた人

S・T・K
皆さんの喜ぶ情報を投稿していきます。ご期待ください。
この人のすべてのブログを見る