wordpress カスタムフィールドを使って meta 要素を出力する

2013年6月14日

WordPress でプラグインを使わずに、カスタムフィールドを使って meta 要素の「description」と「keywords」を出力する。

  • head 要素内の title 要素の後に、ページ種類と値が入力されているかによって条件分岐
  • メタボックスを使って meta 要素の独自のカスタムフィールドの入力項目を追加

カスタムフィールドの入力項目を作成

以下を functions.php に記述すると、「キーワード:このページのキーワードを入力してください。…」というような独自のカスタムフィールドを追加できる。詳細は「編集画面に独自のカスタムフィールドの入力項目を追加する」、「特定のページにだけメタボックスを追加する」を参照。

function add_my_box() {
  //固定ページ(page)にメタボックスを追加
  add_meta_box('meta_info', 'ページ情報', 'meta_info_form', 'page', 'normal', 'high');
  //カスタム投稿タイプ(works)にメタボックスを追加
  add_meta_box('meta_info', 'ページ情報', 'meta_info_form', 'works', 'normal', 'high');
}
add_action('add_meta_boxes', 'add_my_box');

//メタボックス(カスタムフィールド)に表示する内容
function meta_info_form() {
  global $post;
  wp_nonce_field(wp_create_nonce(__FILE__), 'my_nonce');
?>
  <div id="meta_info">
    <p><label>キーワード:このページのキーワードを入力してください。複数記入する際には半角のカンマ(,)で区切ってください。<br />
    <input type="text" name="meta_keywords" value="<?php echo esc_html(get_post_meta($post->ID, 'meta_keywords', true)); ?>"  style="width:80%" />
    </label></p> 
  </div>
    <p><label>説明:このページの説明を入力してください。(60~120文字前後)<br />
    <input type="text" name="meta_description" value="<?php echo esc_html(get_post_meta($post->ID, 'meta_description', true)); ?>"  style="width:80%" />
    </label></p>    
<?php
}

//カスタムフィールド(メタボックス)に入力された内容の更新などの処理
function my_box_save($post_id) {
  global $post;
  $my_nonce = isset($_POST['my_nonce']) ? $_POST['my_nonce'] : null;
  if(!wp_verify_nonce($my_nonce, wp_create_nonce(__FILE__))) {
    return $post_id;
  }
  if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) { return $post_id; }
  if(!current_user_can('edit_post', $post->ID)) { return $post_id; }
  if($_POST['post_type'] == 'works'){  
    update_post_meta($post->ID, 'meta_keywords', $_POST['meta_keywords']);
    update_post_meta($post->ID, 'meta_description', $_POST['meta_description']); 
  }
  if($_POST['post_type'] == 'page'){  
    update_post_meta($post->ID, 'meta_keywords', $_POST['meta_keywords']);
    update_post_meta($post->ID, 'meta_description', $_POST['meta_description']); 
  }
}
add_action('save_post', 'my_box_save');

カスタムフィールドに入力された値を meta 要素の content 属性の値として出力

上記の記述で固定ページとカスタム投稿タイプのページでは「キーワード」と「説明」の値を入力できるようになったが、フロントページ、ブログのトップページやカスタム投稿タイプのカスタムタクソノミーのアーカイブページは個別のページを持たないため、編集画面からそれらの値を入力することはできない。

それらのページの「キーワード」と「説明」は head 要素内で直接記述する。

  • 固定ページとカスタム投稿タイプ(works)の個別ページの場合は、カスタムフィールドに入力された値があればそれを出力
  • フロントページ、ブログのトップページ、カスタムタクソノミーのアーカイブページの場合は、直に記述
  • head 要素内の title 要素の後に以下を記述。
</title>// title 要素の後に記述
<?php if(is_front_page()): ?>  //フロントページの場合
    <meta name="description" content="フロントページの説明" />
    <meta name="keywords" content="フロントページのキーワード" />
<?php elseif(is_page() || is_singular('works')): ?>  //固定ページとカスタム投稿タイプの場合
  <?php
    //カスタムフィールドの値を取得
    $meta_description = get_post_custom_values('meta_description', $post->ID);
    $meta_keywords =  get_post_custom_values('meta_keywords', $post->ID);
  ?>
  <?php if($meta_description[0]): ?>//取得した値(配列の最初の要素)が空なければ出力
    //出力する際は esc_attr でエスケープ処理をする(trim で前後のホワイトスペースを削除)
    <meta name="description" content="<?php echo esc_attr(trim($meta_description[0])); ?>" />
  <?php endif; ?>
  <?php if($meta_keywords[0]): ?>//取得した値(配列の最初の要素)が空なければ出力
    <meta name="keywords" content="<?php echo esc_attr(trim($meta_keywords[0])); ?>" />
  <?php endif; ?>
<?php else: ?>
  <?php if(is_home() && !is_front_page()): ?>  //ブログのトップページの場合
    <meta name="description" content="ブログのトップページの説明" />
    <meta name="keywords" content="ブログのトップページのキーワード" />
  <?php elseif(is_tax('works_cat', 'crystal')): ?>  //カスタムタクソノミーのアーカイブページの場合
    <meta name="description" content="カスタムタクソノミーのアーカイブページの説明" />
    <meta name="keywords" content="カスタムタクソノミーのアーカイブページのキーワード" />
  <?php endif; ?>
<?php endif; ?>
get_post_custom_values($key, $id)
カスタムフィールド名(キー)を指定してそのカスタムフィールドの値を取得
パラメータ
 $key カスタムフィールド名(必須):値を取得したいカスタムフィールドのキー
 $id 投稿の ID(オプション):値を取得したい投稿の ID。省略時は現在の投稿の ID
戻り値:カスタムフィールドの値の配列