Advanced Custom Fieldsによるカスタムフィールドの出力【基本編】

 

※当ブログのリンクには一部広告が含まれています。

Advanced Custom Fieldsの出力 基本編

WordPressでのサイト制作でもはや無くてはならないプラグイン「Advanced Custom Fields」（以下ACF）。 WordPressのテンプレートタグや関数と同様、使わないとすぐ忘れてしまうので、ここでは出力に絞って使い方をまとめました。

実際のお仕事では、カスタムフィールドの値をそのまま出力するだけではなく、カスタムフィールドの入力内容によって条件分岐をすることも多いので、条件分岐についても書いていきます。

Advanced Custom Fields（公式ページ：英語）

Advanced Custom Fieldsのインストールと基本的な設定方法については以下の記事をご覧ください。

Advanced Custom Fieldsのインストールと基本的な設定方法

参考記事【画像付き】Advanced Custom Fieldsのインストールと基本的な設定方法

ACFの出力にについては以下の記事でも解説しています。他にもフィールドはたくさんあるのですが、よく使うものだけまとめました。

Advanced Custom Fieldsの出力 画像編

参考記事Advanced Custom Fieldsによるカスタムフィールドの出力【画像編】

Advanced Custom Fieldsの出力 画像編

参考記事Advanced Custom Fieldsによるカスタムフィールドの出力【チェックボックス・ラジオボタン編】

このページでは、出力でよく使う最も基本的な2つの関数について説明します。この2つ以外にACFが用意している関数は、公式ページで確認できます。

the_field()

get_field()

フィールド内容を出力する

field_nameには「フィールド名」を入れます。

the_field()を使用する場合

<?php the_field('field_name'); ?>

get_field()を使用する場合

<?php
if(get_field('field_name')) { //フィールド内に値があれば表示
    echo get_field('field_name') ;
  }
?>

変数を使用する場合

<?php
$field = get_field('field_name');
if($field){ //フィールド内に値があれば表示
      echo $field ;
  }
?>

the_field()はフィールド内の値を簡単に表示したい時に、 get_field()は一度変数に格納して使用したい時や、フィールド内に値があるかどうかで分岐をしたい時などに使います。 get_field()を使用時にカスタムフィールドに値がない場合は、「false」が返ってきます。

フィールドタイプが「テキスト、テキストエリア、数値、メール、パスワード」などの場合は、上記の書き方でOK！ オプションで ページIDなども指定できます。

エスケープ処理について

カスタムフィールドでは入力した情報がそのまま出力されるので、特にサイト制作者以外のユーザーが使用する場合は、セキュリティ上エスケープ処理をしておいた方がよいでしょう。

esc_html()
HTMLタグの<>&"’をエンティティ化して適切に処理。
esc_attr()
esc_html()と同じだが、altなどの属性にはこちらを使う。
esc_url()
URLで不適切な文字を削除・エンティティ化する。http://から始まる完全なURLに対してのみ使用可能。

WordPressのエスケープ処理については、以下のページを参考にさせていただきました。

WordPressでechoする文字を適切にエスケープする

ACFを更に使いやすくするACF Pro

Advanced Custom Fieldsでは、次世代バージョンのACFとACFを更にパワーアップさせた高機能なアドオン（The Repeater Field、The Gallery Field、The Flexible Content Field、Clone field、Options Pages）がパッケージ化された「ACF Pro」という有料プラグインが用意されています。便利な機能が多く搭載されているのでオススメです！

ACF Pro 機能紹介

参考記事Advanced Custom Fieldsを更に使いやすく！ACF Proを選ぶ理由と機能紹介

ACF関連記事

▲