2021.04.27プラグイン

Advanced Custom Fields のオプションページの設定方法と表示方法

この記事を書いた人

土井純也

WordPressスペシャリスト・エンジニア/株式会社プレート取締役

1985年北海道生まれ。200社以上のWordPressサイトの制作を担当し、「wp.support」では一部上場企業を含め、様々なサイトのWordPress保守・セキュリティをサポートしている。

この著者の他の記事を見る >>

Advanced Custom Fields には、便利なオプションページという機能があります。
※オプションページは、有料版であるAdvanced Custom Fields Proが必要となります。

通常のカスタムフィールドは投稿やタクソノミーに関連付けて管理することが出来ますが、このオプションページは独立してカスタムフィールドを使用することが出来ます。

そのため、ヘッダーの一部を管理したり、複数のページで共通して使用するパーツなどをカスタムフィールドで管理する際に便利です。

このAdvanced Custom Fieldsのオプションページの設定方法と表示方法を説明します。

各情報のURL

プラグイン

外部参考リンクAdvanced Custom Fields

オプションページの公式ドキュメント

外部参考リンクAdvanced Custom Fields オプション公式ドキュメント

導入手順

1．プラグインをインストール

Advanced Custom Fieldsの管理画面からlicenceを購入後、以下のURLにアクセスし最新版のPro版プラグインをダウンロードしてください。
外部参考リンクAdvanced Custom Fields My Account

その後、WordPressの管理画面に上記でダウンロードしたzipファイルをアップロードし、有効化してください。

プラグインの選び方で困った場合は、以下のページを参考にしてください。
関連記事WordPressのプロ直伝！失敗しないプラグインの選び方

2．functions.php にオプションページの記載をする

if( function_exists('acf_add_options_page') ) {
	acf_add_options_page(array(
		'page_title' 	=&gt; 'テストオプションページ',
		'menu_title'	=&gt; 'テストオプションページ',
		'menu_slug' 	=&gt; 'test-optionpage-settings',
		'capability'	=&gt; 'edit_posts',
		'redirect'		=&gt; false
	));
}

if( function_exists('acf_add_options_page') ) {

acf_add_options_page(array(

'page_title' => 'テストオプションページ',

'menu_title' => 'テストオプションページ',

'menu_slug' => 'test-optionpage-settings',

'capability' => 'edit_posts',

'redirect' => false

));

}

※acf_add_options_pageの引数については、以下のURLを参照してください。
外部参考リンクhttps://www.advancedcustomfields.com/resources/acf_add_options_page/

3．管理画面からカスタムフィールドの設定を行う。

管理画面のオプションページにアクセスすると、「カスタムフィールドグループを作成」を促されます。

「カスタムフィールドグループを作成」をクリックすると、カスタムフィールドの作成画面に遷移します。

この画面で必要なカスタムフィールドを作成してください。

4．使用したい箇所のテーマにオプションページに記載した内容を出力する。

オプションページで設定した内容を記載する場合は以下の記述で表示ができます。

get_field('field_name', 'option');

1	get_field('field_name', 'option');

set_field('field_name', 'option');

1	set_field('field_name', 'option');

<!--?php if (get_field('topic_title', 'option') &amp;&amp; get_field('page_link', 'option')): ?-->

1	<!--?php if (get_field('topic_title', 'option') && get_field('page_link', 'option')): ?-->

まとめ

オプションページを使用することにより、簡単に拡張ができますのでテーマを設計する際にオプションページの採用も検討してみてください。

また、Advanced Custom Fieldsには上記以外にも便利な機能がたくさんありますので以下のドキュメントを参考に使用してみてください。
外部参考リンクhttps://www.advancedcustomfields.com/resources/

もし、Advanced Custom Fields等を使用したWordPressのカスタマイズでお困りの際は、wp.makeにお気軽にご相談ください。

wp.makeWordPressサイトの制作・リニューアル等のご相談はこちら

2020.12.08