プラグインElementorのelementor/editor/initアクションの使用方法・解説

概要

elementor/editor/init アクションは、Elementorのエディタが初期化される際にトリガーされる重要なフックです。このアクションは、さまざまなカスタマイズ機能を実装する際に特に役立ちます。具体的には、以下のような機能を実装する際に使用されます。

新しいコントロールやウィジェットの追加
スタイルやスクリプトのエンキュー
テンプレートやブロックの登録
カスタムデータのジェネレーション
既存のウィジェットの追加機能の拡張
APIへのアクセス権限の管理

構文

add_action('elementor/editor/init', 'custom_function_name');

パラメータ

引数はありませんが、エディタ初期化に関連するコンテキスト情報が利用可能です。

戻り値

なし。アクションフックの実行時に特定の機能を実行します。

使用可能なプラグインElementorのバージョン

Elementのバージョン2.0以降で使用可能です。

使用可能なWordPressのバージョン

WordPress 4.x以上で使用可能です。

この関数のアクションでの使用可能性

アクション	使用例
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

サンプルコード

サンプル1: カスタムコントロールの追加

このコードは、Elementorエディタにカスタムコントロールを追加します。

add_action('elementor/editor/init', function() {
    ElementorPlugin::$instance->controls_manager->register_control('custom_control_name', [
        'label' => __('Custom Control', 'plugin-domain'),
        'type' => ElementorControls_Manager::TEXT,
    ]);
});

サンプル2: カスタムスクリプトのエンキュー

Elementorエディタが初期化されたときにカスタムスクリプトをエンキューします。

add_action('elementor/editor/init', function() {
    wp_enqueue_script('custom-script', plugin_dir_url(__FILE__) . 'assets/js/custom-script.js', ['jquery'], null, true);
});

サンプル3: 新しいウィジェットの登録

このコードは、カスタムウィジェットをElementorに登録します。

add_action('elementor/editor/init', function() {
    ElementorPlugin::$instance->widgets_manager->register_widget_type(new My_Custom_Widget());
});

サンプル4: ショートコードの登録

このコードは、Elementorエディタ内でショートコードを利用できるようにします。

add_action('elementor/editor/init', function() {
    add_shortcode('my_shortcode', 'my_shortcode_function');
});

サンプル5: カスタムデータの追加

エディタ初期化時にカスタムデータを追加します。

add_action('elementor/editor/init', function() {
    ElementorPlugin::$instance->dynamic_tags->register_tag('custom_dynamic_tag', 'My_Custom_Dynamic_Tag');
});

引用元は存在しないため、明記するURLはありません。

概要

構文