カメラの撮影時に保存され、サイトへアップロードした時に転送されるデータ(EXIF情報)を、管理画面のメディアライブラリの一覧へ表示させるためのコードを紹介します。
管理画面上では通常アップロード日しか表示されないので、撮影日を知りたいといった時などに便利かと思います。
本ページ掲載のコードを使用するときは
本ページで掲載しているコードは、以下に了承した上で使用ください
- コードは商用・非商用問わず自由に使っていただいて構いませんが、コード追加による不具合やトラブルが発生しても当方では一切責任を負いません
- コードは有効化しているテーマのfunctions.php、style.cssなどへ追加することで機能します。それらのファイルへの変更を行うことに不安のある方は使用しないでください
- コードは本ページの公開日時点で私の環境において動作したものです。WordPressバージョン他環境の違いによって動作しないことがあります
- コードは、セキュリティ、コードの正確さなどにおいて完全なものではありません。中には紹介するコードを簡略化するために省略している部分があるものもありますので、ご自身でコードを十分に検証し、必要な部分の編集を行った上で使用するようにしてください
- 掲載しているのは参考コードです。自身の環境に合わせるための編集はご自身で対応いただく必要があります(コメント欄等から質問いただいても基本回答は致しません)
- 掲載しているコードの転載を禁じます(SNSで紹介いただいたり、本ページへのリンクを張っていただくことは大歓迎です)
EXIF情報をメディア一覧へ表示する手順
今回はメディアライブラリの一覧へ列とデータを追加するという内容で紹介していますが、管理画面の一覧へ列を追加する基本的な流れは同じなので、以下のようにコードを整備すると覚えておくとよいでしょう。
【補足】管理画面のカラムへ一覧を追加する基本的なコードの流れ
今回はメディアライブラリの一覧へ列とデータを追加するということを紹介していますが、管理画面の一覧へ列を追加する基本的な流れは同じなので、以下のようにコードを整備すると覚えておくとよいでしょう。
- 「manage_〇〇_columns」へフックさせて「カラム」を追加
- 「manage_〇〇_custom_column」へフックさせて「カラムに表示する内容」を追加
- 「admin_head」へフックさせて管理画面へスタイルを出力
そしてすべて「何かを追加する」という指示をするわけですから、「add_action()」というアクションフックを使用します。
これを踏まえ、今回はメディアの一覧へカラム・データを出力したいので「manage_media_columns」「manage_media_custom_column」へフックさせるようにします。
では、1つずつコードを追加していきましょう。
コードは有効化しているテーマのfunctions.phpへ追加して動作させます。コードの追加に不慣れな方や、トラブル発生時に対処が難しい方はご遠慮ください(トラブル等の責任は一切負いません)
メディアライブラリの一覧へカラム(列)を追加する
まずは取得したEXIF情報を表示させる列を作成します。今回は「撮影日」「機種」「ISO」を表示させるための列を追加します。
/***** メディアにEXIF情報を表示 *****/
/* メディア一覧にカラム追加 */
function pwcn_media_columns_exif( $posts_columns ) {
$posts_columns['ph_exif_date'] = __( '撮影日' );
$posts_columns['ph_used_camera'] = __( '機種' );
$posts_columns['ph_iso'] = __( 'ISO' );
return $posts_columns;
}
add_filter( 'manage_media_columns', 'pwcn_media_columns_exif' );
コード中の「ph_exif_date」がプログラム上で「撮影日」、「ph_used_camera」が「機種」、「ph_iso」が「ISO」とプログラムが認識するようにしています(この列に次項のデータを表示させます)
それぞれのカラムへデータを表示させる
表示するデータを抽出し、前項のコードで作成したカラム(列)へ紐づけるためのコードを追加します。
/* カラムにデータを表示 */
function pwcn_media_custom_column_exif( $column_name, $post_id ) {
$meta = wp_get_attachment_metadata($post_id);
//カメラ
if ( $column_name == 'ph_used_camera') {
$used_camera = $meta['image_meta']['camera'];
if(!empty($used_camera)){
$data = $used_camera;
}else{
$data = __( 'データなし' );
}
}
//撮影日
if ( $column_name == 'ph_exif_date') {
$unix_time = $meta['image_meta']['created_timestamp'];
if(!empty($unix_time)){
$data = date_i18n( get_option( 'date_format' ) . ' ' . get_option( 'time_format' ), $unix_time );
}else{
$data = __( 'データなし' );
}
}
//iso
if ( $column_name == 'ph_iso') {
$iso = $meta['image_meta']['iso'];
if(!empty($iso)){
$data = $iso;
}else{
$data = __( 'データなし' );
}
}
//各列にデータを出力
if(!empty($data)){
echo $data;
}else{
echo '';
}
}
add_action( 'manage_media_custom_column', 'pwcn_media_custom_column_exif', 10, 2 );
「撮影日」「機種」「ISO」ともコードの流れは同じで、以下のように書いています。
- カラム名(ph_exif_dateなど)が追加されているかを判断
- データを取得して、$dataという変数へ格納
そして最後に$dataを出力させています。
EXIFデータ中の日付と時刻はシリアル(UNIX時刻)なので、WordPressサイトの日付フォーマットへ変換するためのコードを書き加えています
ここまで追加した段階でメディアライブラリを開いてみると、カメラからアップロードした画像で「撮影日」「機種」「ISO」情報のあるものにはその値が、ないものは「データなし」と表示されるはずです。
列の表示崩れを防ぐ
列とデータの追加自体は前項までを行えば大丈夫です。
ただ、各列の幅を指定しておかないと、一覧に表示する列が増えた時に欄外に表示されてしまったり、表示が不用意に縦に並んでしまったりするので、以下のコードで全部の列の合計のうちの10%(ちょっとややこしいのでこの程度の説明にとどめます)が確保されるようにします。
/* 管理画面上のスタイル */
function pwcn_admin_media_exif_column_style_init(){
?>
<style>
.column-ph_exif_date,
.column-ph_used_camera,
.column-ph_iso
{width:10%;}
</style>
<?php
}
add_action('admin_head','pwcn_admin_media_exif_column_style_init');
このコード中のCSSクラス指定にも「ph_exif_date」「ph_used_camera」「ph_iso」が出てきます。それ位、このカラムに指定する文字列は重要でサイトの中で一意でないといけないのが理解できると思います。
取得できるEXIFデータ
このデータは、「post_meta」テーブルの「_wp_attachment_metadata」に、「image_meta」として以下のような配列(サブ項目)で保存されています。
今回紹介したコード中で、例えば「camera」は、列のデータを$meta[‘image_meta’][‘camera‘];で引き出していまますから、この文字列を以下に変えればそのデータが呼び出せます。
image_metaの項目 | 内容 |
---|---|
aperture | 撮影時のレンズの絞り値 |
credit | 画像の著作権者やクレジット情報 |
camera | 使用されたカメラの情報 |
caption | 画像のキャプション |
created_timestamp | 画像が作成されたタイムスタンプ ※UNIX時刻なので日付形式への変換が必要 |
copyright | 画像の著作権情報 |
focal_length | 使用されたレンズの焦点距離 |
iso | 撮影時のISO感度 |
shutter_speed | 使用されたシャッタースピード |
コメントを残す