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

概要

elementor/dynamic_tags/registerは、Elementorでカスタムダイナミックタグを登録するためのアクションフックです。このフックを使用することで、特定のデータを動的に表示することができ、ユーザーのサイト作りをさらにカスタマイズ可能にします。以下のような機能を実装する際によく使われます。

カスタムフィールドの値を表示する。
ユーザーのメタデータを取得して表示する。
サイトの設定情報を動的に表示する。
WooCommerceの商品情報をカスタマイズして表示する。
SNSのシェアカウントのリンクを動的に生成する。
外部APIから取得したデータを表示する。

構文

add_action('elementor/dynamic_tags/register', 'your_function_name');

パラメータ

your_function_name: ダイナミックタグを登録するためのコールバック関数。

戻り値

特段の戻り値はありません。

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

Elementorのバージョン: 3.0以降
WordPressのバージョン: 5.0以降

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

アクション	使用例
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: カスタムテキストタグの登録

add_action('elementor/dynamic_tags/register', function($dynamic_tags) {
    class Custom_Text_Tag extends ElementorCoreDynamicTagsTag {
        public function get_name() {
            return 'custom-text-tag';
        }
        public function get_title() {
            return __('Custom Text', 'plugin-name');
        }
        public function render() {
            echo 'This is a custom text tag content.';
        }
    }
    $dynamic_tags->register(new Custom_Text_Tag());
});

このサンプルコードでは、”custom-text-tag”というカスタムダイナミックタグを生成し、特定のテキストを出力します。

サンプル2: ユーザーのメタデータを表示

add_action('elementor/dynamic_tags/register', function($dynamic_tags) {
    class User_Meta_Tag extends ElementorCoreDynamicTagsTag {
        public function get_name() {
            return 'user-meta-tag';
        }
        public function get_title() {
            return __('User Meta', 'plugin-name');
        }
        public function render() {
            $user_id = get_current_user_id();
            $meta_value = get_user_meta($user_id, 'your_meta_key', true);
            echo esc_html($meta_value);
        }
    }
    $dynamic_tags->register(new User_Meta_Tag());
});

このコードでは、ログイン中のユーザーの特定のメタデータを表示するダイナミックタグを作成します。

サンプル3: 投稿のカスタムフィールドを表示

add_action('elementor/dynamic_tags/register', function($dynamic_tags) {
    class Post_Custom_Field_Tag extends ElementorCoreDynamicTagsTag {
        public function get_name() {
            return 'post-custom-field';
        }
        public function get_title() {
            return __('Post Custom Field', 'plugin-name');
        }
        public function render() {
            $custom_field = get_post_meta(get_the_ID(), 'your_custom_field_key', true);
            echo esc_html($custom_field);
        }
    }
    $dynamic_tags->register(new Post_Custom_Field_Tag());
});

このサンプルでは、現在の投稿に関連するカスタムフィールドの値を取得して表示します。

サンプル4: WooCommerceの商品価格を表示

add_action('elementor/dynamic_tags/register', function($dynamic_tags) {
    class Product_Price_Tag extends ElementorCoreDynamicTagsTag {
        public function get_name() {
            return 'product-price-tag';
        }
        public function get_title() {
            return __('Product Price', 'plugin-name');
        }
        public function render() {
            global $product;
            if ($product) {
                echo wp_kses_post($product->get_price_html());
            }
        }
    }
    $dynamic_tags->register(new Product_Price_Tag());
});

このコードは、WooCommerceの商品価格を動的に表示するカスタムタグを登録します。

サンプル5: 外部APIデータの表示

add_action('elementor/dynamic_tags/register', function($dynamic_tags) {
    class Api_Data_Tag extends ElementorCoreDynamicTagsTag {
        public function get_name() {
            return 'api-data-tag';
        }
        public function get_title() {
            return __('API Data', 'plugin-name');
        }
        public function render() {
            $response = wp_remote_get('https://api.example.com/data');
            if (is_array($response) && !is_wp_error($response)) {
                $body = wp_remote_retrieve_body($response);
                echo esc_html($body);
            }
        }
    }
    $dynamic_tags->register(new Api_Data_Tag());
});

このサンプルでは、外部APIからデータを取得し、その結果を表示するダイナミックタグを作成します。

概要

構文