PR

管理画面の投稿一覧に更新日の情報を表示させるには…

last_modified_columns1Wordpree
この記事は約10分で読めます。

特に気にはなっていなかったのですが、管理画面の投稿一覧に公開日と更新日が別々に表示されればいいなと思いいろいろと調べていたところ『ネット起業家JIN』さんのサイトで紹介していた記事を見てこれだ!と思い早速導入させていただくことにしました。
管理画面の投稿一覧のカスタム等については”Admin Columns”などのプラグインで行うこともできるのですがそこまでこったものは必要なかったこととプラグインが増えていくのもあまり気が進まなかったたこともあり、もっとシンプルなものはないかと思っていたところです。
詳しい内容の説明は『ネット起業家JIN』さんの記事をご確認ください。
とりあえず今回行った作業の内容を忘備録として残しておくことにしました。何かのご参考になれば幸いです。

投稿一覧に更新日の情報を表示させる

今回 行いたいのが下の赤枠の部分です。
”ネット起業家JIN”さんのサイトで紹介されていたもので、そのまま同じように表示できるようにしたいと思います。

last_modified_columns1

また、投稿一覧、固定ページ一覧、カスタム投稿一覧(News)にも同じように表示をさせるためにいくつか追記をしています。

PHPへの記述

子テーマなどのFunction.phpへ下記記述をコピー・ペーストをします。
Function.phpを編集する前に必ずバックアップを取ることをお勧めします。
下記記述についての各コマンド等の説明は省いています。
(参考にしたサイトで詳しく説明がされているので)

/*******************************************************
 投稿一覧に最終更新日の列を追加
*******************************************************/
function add_posts_column( $columns ) {
	$new_columns 	= [];
	$check			= false;
  
	foreach ( $columns as $name => $display_name ) {
		if ( $display_name  == 'ID' ) {
			$new_columns['last_modified'] = '更新日';
			$check	= true;
		}
		$new_columns[$name] = $display_name;
	}
	
	if($check == false){
		$new_columns['last_modified'] = '更新日';
	}
	
	return $new_columns;
}
add_filter( 'manage_edit-post_columns', 'add_posts_column' );
add_filter( 'manage_edit-page_columns', 'add_posts_column' );
add_filter( 'manage_edit-news_columns', 'add_posts_column' );

/* ------------------------------------
 最終更新日の取得と表示
------------------------------------*/
function add_posts_column_Value($column_name, $post_id) {
    if ( 'last_modified' == $column_name ) {
        /* 最終更新日の取得 */
		$post_update	= get_the_modified_date('Y年n月j日 g:i A');
		
		/* 投稿日の取得 */
		$post_date	= get_the_time('Y年n月j日 g:i A');
		
		/* 投稿日と同じ場合 */
		if( $post_update == $post_date){
			$show_date	= '<span class="date_same">'.'更新日'.'<br />'.$post_update.'</span>';
		}
		else{
			$show_date	= '<span class="date_not_same">'.'更新日'.'<br />'.$post_update.'</span>';
		}
 
        echo	$show_date;
    } 
}
add_action( 'manage_posts_custom_column', 'add_posts_column_value', 10, 2 );
add_action( 'manage_pages_custom_column', 'add_posts_column_value', 10, 2 );
add_action( 'manage_newss_custom_column', 'add_posts_column_value', 10, 2 );

/* ------------------------------------
 最終更新日の並べ替え
------------------------------------*/
function add_posts_column_sortable( $columns ) {
$columns['last_modified'] = 'modified';
return $columns;
}
add_filter( 'manage_edit-post_sortable_columns', 'add_posts_column_sortable' );
add_filter( 'manage_edit-page_sortable_columns', 'add_posts_column_sortable' );
add_filter( 'manage_edit-news_sortable_columns', 'add_posts_column_sortable' );

カスタム投稿タイプへの表示について

“更新日の列を追加”の
24. add_filter( ‘manage_edit-news_columns’, ‘add_posts_column’ );
“更新日の取得と表示”の
52. add_action( ‘manage_newss_custom_column’, ‘add_posts_column_value’, 10, 2 );
“更新日の並べ替え”の
63. add_filter( ‘manage_edit-news_sortable_columns’, ‘add_posts_column_sortable’ );

それぞれの”news” の部分をご自分のカスタム投稿タイプ名に変更してください。

ここまで出来たら”ファイルを更新”します。

更新をしたらエラーで更新できない!

ファイルを更新したら、エラーとなり更新ができません!

last_modified_columns2

エックスサーバーのコマンド対策セキュリティーで更新ができないようです。
問題は記述の中に”echo”というコマンドが含まれているため?

解決方法は、ワードプレスの編集画面からではなくFTPソフト又はレンタルサーバーのファイル管理画面から直接、Function.phpを編集する。
または、レンタルサーバーのセキュリティーでWAF設定を変更できるのであれば一旦、WAFの設定をOFFにして編集後ONにし直せば問題ないようです。

エックスサーバーの場合はWAFの設定変更を

エックスサーバーのWAF設定で”コマンド対策”をOFFにすることでFunction.phpの更新を行うことが出来るようになります。
ただし、変更が反映されるの1時間近くかかることもあるので編集前に設定を変えておくことをお勧めします。

Xserver_WAF

Function.phpの記述が全が終わり更新後は、ONに戻すことを忘れずに!

画面を見やすくするために幅を変える

列が増えたことで”タイトル”表示が見にくくなったこともあり、タイトルからIDまでの列の幅を調整することにしました。

last_modified_columns3a

PHPへの記述

/*************************************
 表示項目の列幅の変更
*************************************/

add_action('admin_head', 'column_width');
function column_width() {
    echo '<style type="text/css"> 
        .column-title { text-align: left; width: 25% !important; overflow:hidden }             
        .column-categories { text-align: left; width:10% !important; overflow:hidden }        
        .column-date { text-align: left; width:10% !important; overflow:hidden }    
	.column-last_modified { text-align: left; width:10% !important; overflow:hidden }
        .column-post-id { text-align: left; width:4% !important; overflow:hidden }
	   </style>';
}

ここでは幅の指定をWidth: 10%等で行っていますが、pxで指定を行っても問題ありません。自分に合った数値に変更して調整してください。調整した画面が下になります。

ここまで来たらあとはCSSで更新日の表示の調整となります。

Function.phpからCSSを追記させる

管理画面へのCSS反映については、通常のCSSに記述しても反映されず、別途管理画面用のCSSファイルの設定等をしなければならないこと知らなかったために苦労しました。
また、管理画面用のCSSシートを作成したのですが、思うように反映できなかったためにいろいろと調べているとMiyachi Laboさんのサイトで参考になる記事がありました。
それを参考にして、Function.phpへ記述を行い管理画面用のCSSへ変更を加えることにしました。

PHPへの記述

/* ~ */ でコメントアウトしているものは削除してから記述したほうがいいようです。
CSSファイルにそのまま転記されてしまうので。(そのままでも問題なないですが…)

/*****************************************************
 管理画面用 更新日と経過日数 CSSの追記
*****************************************************/

function my_admin_style() {
  echo '<style>
/****************** ここから下にCSSを追記 **********/  
.date_same {
    color: transparent;	/* 文字は透明にして、見かけ上は非表示 */
}
 
.date_same:before {
    content: "(更新なし)";
    color: #a1a0a0; /* 若干薄い色で文字表示*/
}

/************** ここから上にCSSを追記 *****************/ 
  </style>'.PHP_EOL;
}
add_action('admin_print_styles', 'my_admin_style');
/***************** 管理画面用 CSSの追記終了 ***************/

管理画面用のCSS追記するのはこれが一番簡単で失敗がないような気がします。

さいごに

ネット起業家JIN』さんの紹介していただいている記事のおかげで、投稿一覧で得られる情報が増えたのでいちいち記事の編集画面へ入り公開された記事の更新日を確認する必要がなくなりました。とっても感謝です。
また、『投稿一覧に最終更新日からの経過日数を表示する』もご紹介されていました。追加情報としてはあったほうが便利かも?

コメント

タイトルとURLをコピーしました