管理画面のメディア一覧へファイルの情報を表示する

公開日: マニュアル
管理画面のメディア一覧へファイルの情報を表示する

本機能は【ha-Basic】バージョン4.0でファイル容量のみ表示するよう実装し、バージョン4.1でファイル容量に加えて画像の縦横サイズを表示するようにしています。

本機能は、上図のようにWordPress標準仕様で画像の編集画面を開いた時のみ表示される、アップロードしたオリジナル(元)画像の「ファイル容量(画像のファイルサイズ-KB)」と「画像の縦横サイズ(ピクセル)」を下図のようにメディアの一覧上で見えるようにするものです。

これにより、メディアの編集画面を開くことなく前述の情報を見ることができ、画像縦横サイズの最適化、容量の大きい画像の入れ替え等のヒントとして活用いただくことができます。

管理画面のメディア一覧へファイルの情報を表示するの画像|ha-Basic
管理画面のメディア一覧へファイルの情報を表示するの画像|ha-Basic

本機能の有効/無効化の仕方

テーマカスタマイザー(外観→カスタマイズ)を開き、「ha-Basic設定」→「ログイン画面・管理画面」メニューにある「メディア一覧へメディアサイズを表示」項目にチェックを入れることで有効化できます(デフォルトでは無効にしてあります)。

無効にするには、メディアライブラリ一覧の表示オプションタブから「ファイル容量」のチェックを外していただくか、テーマカスタマイザー上でチェックを外すかのいずれかで行えます

サイトへアップロードしている画像の数や一覧のページあたりの表示数によっては思わぬ負荷がかかる可能性がありますので、後者(カスタマイザー)の方法で無効にしていただくことをおすすめします。

本機能を【ha-Basic】以外のテーマで実装したいときは

以下のコードを有効化中のテーマ(または子テーマ)のfunctions.phpへ追記すれば機能します。

/***** メディアにファイルサイズを表示 *****/
/* ユーザー定義 メディア一覧にカラム追加 */
if ( !function_exists( 'hab_media_columns_filesize' ) ){
function hab_media_columns_filesize( $posts_columns ) {
	$posts_columns['filesize'] = __( 'File Size', 'ha-basic' );

	return $posts_columns;
}
}

/* ユーザー定義 サイズを表示 */
if ( !function_exists( 'hab_media_custom_column_filesize' ) ){
function hab_media_custom_column_filesize( $column_name, $post_id ) {
	if ( 'filesize' !== $column_name ) {
		return;
	}

	$bytes = filesize( get_attached_file( $post_id ) );
    $meta = wp_get_attachment_metadata($id);
	
		echo size_format( $bytes, 2 ).'<br>';
           echo 'W'.$meta['width'].' x h'.$meta['height'].'(px)';
}
}

/* ユーザー定義 カラムの幅調整 */
if ( !function_exists( 'hab_filesize_column_filesize' ) ){
function hab_filesize_column_filesize() {
	echo
	'<style>
		.fixed .column-filesize {
			width: 12%;
		}
	</style>';
}
}

/* 有効化 */
add_filter( 'manage_media_columns', 'hab_media_columns_filesize' );
add_action( 'manage_media_custom_column', 'hab_media_custom_column_filesize', 10, 2 );	
add_action( 'admin_print_styles-upload.php', 'hab_filesize_column_filesize' );

コードはユーザー定義関数名が競合した場合にエラーが出ないよう、元々あったコードが優先されるようにしています。コードを追加したのに機能しない場合にはユーザー定義関数名を変更してみるなどの措置を行ってみてください。

コードは【ha-Basic】での有効性が確認できたものとなります。お使いのテーマやプラグイン、WordPress本体のバージョンによってはエラーとなったり、「重大なエラーが発生しました」と表示され、管理画面にすら入れなくなる可能性がありますので、自己判断で実装ください(不具合が発生しましても当方では一切責任を負いません)

機能実装の参考にさせていただいたページ

本機能は以下のページで紹介されているコードを参考にしました。

How to Add Dimensions Column to WordPress Media Library

Show file size in WordPress Media library

サイトへの支援をお願いします

サイトへお越しいただきありがとうございました。
テーマを無料で提供し続けることができるよう、投げ銭によるサイトへの支援、およびSNSによる拡散をお願いします

  •  白黒ハチワレ猫の【モモ】とのんびり暮らしながらフリーランスでサイト制作のお手伝いをしています。
    ブログツールでありながら本格的なウェブサイトに必要な機能を追加できるWordpressの良さを活かした楽しく便利なサイト作りのお手伝いをさせていただいております

QR Code

このページはモバイル端末でもご覧いただけます

左のQRコードを読み取っていただくと、このページのURLが表示され、簡単にアクセスできます。ぜひモバイル端末でもご覧ください。

WordPressのカスタマイズ・不具合対応などご相談ください

Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。