概要
この文書では、WordPressのプラグインAdvanced Custom Fields（ACF）の「acf/field_group/admin_enqueue_scripts」アクションについて詳しい解説を行います。このアクションはフィールドグループを編集するときに、「enqueue_scripts」アクション中に発生します。
使用されるシナリオ
このアクションは、以下のような機能を実装する際によく使われます。
1. 管理画面でのスタイルシート（CSS）の追加
2. JavaScriptファイルの追加
3. 特定のフィールドグループにのみスクリプトを適用
4. グループ専用のカスタムスクリプトの読み込み
5. 管理画面でのユーザーインターフェースを拡張
6. アセットのバージョン管理
構文
add_action('acf/field_group/admin_enqueue_scripts', 'your_function_name');
パラメータ
$field_group: ACFのフィールドグループの詳細を含む配列。
戻り値
このアクションには戻り値はありません。主にスクリプトやスタイルシートをキューに追加するために使用されます。
サポートされるバージョン
- ACFのバージョン: 5.x以上
- WordPressのバージョン: 5.0以上
サンプルコード
サンプル1: CSSを追加
このサンプルコードは、特定のフィールドグループを編集する際にカスタムCSSを管理画面に追加します。
add_action('acf/field_group/admin_enqueue_scripts', 'my_custom_css');
function my_custom_css($field_group) {
wp_enqueue_style('my-custom-css', get_template_directory_uri() . '/css/my-custom.css');
}
（出典: https://www.advancedcustomfields.com/resources/acfe-field-group-admin_enqueue_scripts/）
サンプル2: JavaScriptを追加
この例では、特定のフィールドグループの管理画面でカスタムJavaScriptファイルを読み込みます。
add_action('acf/field_group/admin_enqueue_scripts', 'my_custom_js');
function my_custom_js($field_group) {
wp_enqueue_script('my-custom-js', get_template_directory_uri() . '/js/my-custom.js', array('jquery'), null, true);
}
（出典: https://www.advancedcustomfields.com/resources/acfe-field-group-admin_enqueue_scripts/）
サンプル3: フィールドグループに条件を付けてスクリプトを読み込む
このコードは、特定のフィールドグループIDに対してのみJavaScriptを追加します。
add_action('acf/field_group/admin_enqueue_scripts', 'conditional_enqueue_scripts');
function conditional_enqueue_scripts($field_group) {
if ($field_group['key'] === 'group_123456') {
wp_enqueue_script('script-for-group-123456', get_template_directory_uri() . '/js/special-script.js', array('jquery'), null, true);
}
}
（出典: https://www.advancedcustomfields.com/resources/acfe-field-group-admin_enqueue_scripts/）
サンプル4: 複数のスクリプトをキューに追加
複数のスクリプトを同時に管理画面に追加する例です。
add_action('acf/field_group/admin_enqueue_scripts', 'enqueue_multiple_scripts');
function enqueue_multiple_scripts($field_group) {
wp_enqueue_script('first-script', get_template_directory_uri() . '/js/first.js', array('jquery'), null, true);
wp_enqueue_script('second-script', get_template_directory_uri() . '/js/second.js', array('jquery'), null, true);
}
（出典: https://www.advancedcustomfields.com/resources/acfe-field-group-admin_enqueue_scripts/）
サンプル5: バージョンを指定してCSSを追加
バージョン管理を行う際のCSS追加サンプルです。
add_action('acf/field_group/admin_enqueue_scripts', 'enqueue_versioned_styles');
function enqueue_versioned_styles($field_group) {
wp_enqueue_style('versioned-style', get_template_directory_uri() . '/css/style.css', array(), '1.0.0');
}
（出典: https://www.advancedcustomfields.com/resources/acfe-field-group-admin_enqueue_scripts/）
この関数のアクションでの使用可能性
| アクション | 使用例 |
|---|---|
| mu_plugin_loaded | |
| registered_post_type | |
| plugins_loaded | |
| wp_roles_init | |
| setup_theme | |
| after_setup_theme | |
| set_current_user | |
| init | |
| register_sidebar | |
| wp_loaded | |
| send_headers | |
| parse_query | |
| pre_get_posts | |
| wp | |
| template_redirect | |
| get_header | |
| wp_head |