Advanced Custom Fields PRO版のオプションページの追加方法

構築・開発WordPress
スポンサーリンク

設定・使用方法

オプションページを使うには、functions.php 内に関数を追加します。

if( function_exists('acf_add_options_page') ) {
  acf_add_options_page();
}

これだけで、Option というメニューが増えます。
メニュー「カスタムフィールド」より、フィールドグループを追加してください。

設定した項目を読み出すには、通常の get_field や the_field を使用します。
第二引数 $post_id のところを ‘option’ に変えるだけ。

get_field($selector, 'option');
the_field($selector, 'option');

 

カスタマイズ

メニューの挿入位置について

acf_add_options_page関数に設定を何も入れない状態では、メニューの挿入位置は、「設定」の下になってしまいます。
メニューの位置を変更したい場合は、position を追加します。

array(
  'position' => 21
}

初期からあるメニューの各数値は、下記となります。

2:ダッシュボード
5:投稿
10:メディア
15:リンク
20:固定ページ
25:コメント
60:外観
65:プラグイン
70:ユーザー
75:ツール
80:設定

例えば、固定ページとコメントの間にメニューを差し込みたい場合は、21を指定します。

 

メニューのアイコンについて。

なにも指定しない場合は、初期では歯車となってしまいます。
変更したい場合は、icon_url を追加します。

'icon_url' => 'dashicons-admin-page'

使用できるアイコンの種類は、WordPress公式をご確認ください。
https://developer.wordpress.org/resource/dashicons/

キャプチャの設定内容です。
固定ページの下にメニュー配置し、アイコンを固定ページと同じものに変えています。

if( function_exists('acf_add_options_page') ) {
  acf_add_options_page(array(
    'page_title' => 'ページ内パーツ',
    'menu_title' => 'ページ内パーツ',
    'menu_slug'  => 'parts_data',
    'icon_url'   => 'dashicons-admin-page',
    'position'   => 21,
    'redirect'   => true
  ));
  acf_add_options_sub_page(array(
    'page_title'  => 'ブロック1',
    'menu_title'  => 'ブロック1',
    'menu_slug'   => 'afc_block1',
    'parent_slug' => 'parts_data',
    'capability'  => 'edit_posts',
    'redirect'    => false
  ));
  
  acf_add_options_sub_page(array(
    'page_title'  => 'ブロック2',
    'menu_title'  => 'ブロック1',
    'menu_slug'   => 'afc_block2',
    'parent_slug' => 'parts_data',
    'capability'  => 'edit_posts',
    'redirect'    => false
  ));
}

 

ACF公式ドキュメントはこちら
https://www.advancedcustomfields.com/resources/acf_add_options_page/

コメント

スポンサーリンク
タイトルとURLをコピーしました