プラグインElementorのelementor/schemes/enabled_schemesフィルタの使用方法・解説

概要

elementor/schemes/enabled_schemes フィルタは、Elementorのテーマビルダーやカスタムテンプレートにおいて、利用可能な色のスキームやスタイルを拡張するために使用されます。このフィルタを活用することで、特定のスキームを追加したり、カスタマイズしたりすることができ、デザインの一貫性やブランドのアイデンティティを強化することが可能です。

このフィルタは主に以下のような機能を実装する際に役立ちます：

カスタムカラースキームの追加
デフォルトスキームの上書き
特定の条件下でのスキームの変更
Elementorコンポーネントに固有のスタイルの適用
複数スキームの管理
デザインの迅速なカスタマイズ

フィルタの概要

構文: add_filter('elementor/schemes/enabled_schemes', 'your_function_name', 10, 1);
パラメータ:
- $enabled_schemes: 現在有効なスキームの配列
戻り値: カスタマイズされたスキームの配列
使用可能なプラグイン: Elementor（すべてのバージョンで利用可能）
使用可能なWordPressのバージョン: 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_filter('elementor/schemes/enabled_schemes', function( $enabled_schemes ) {
    $enabled_schemes['my_custom_scheme'] = 'My Custom Scheme';
    return $enabled_schemes;
});

このコードはカスタムカラースキーム「My Custom Scheme」をElementorに追加します。

サンプルコード2: 既存のスキームの上書き

add_filter('elementor/schemes/enabled_schemes', function( $enabled_schemes ) {
    if ( isset( $enabled_schemes['default'] ) ) {
        $enabled_schemes['default'] = 'My Overridden Default';
    }
    return $enabled_schemes;
});

このコードはElementorのデフォルトスキームを「My Overridden Default」に変更します。

サンプルコード3: 特定条件でのスキームの変更

add_filter('elementor/schemes/enabled_schemes', function( $enabled_schemes ) {
    if ( is_page('custom-page') ) {
        $enabled_schemes['custom_page_scheme'] = 'Custom Page Scheme';
    }
    return $enabled_schemes;
});

このコードは特定のページが表示されているときにカスタムスキームを追加します。

サンプルコード4: 複数のスキームの管理

add_filter('elementor/schemes/enabled_schemes', function( $enabled_schemes ) {
    $additional_schemes = [
        'scheme_one' => 'Scheme One',
        'scheme_two' => 'Scheme Two',
    ];
    return array_merge( $enabled_schemes, $additional_schemes );
});

このコードは二つの新しいカラースキームをElementorに追加します。

サンプルコード5: 特定の条件を満たす場合のみスキームを追加

add_filter('elementor/schemes/enabled_schemes', function( $enabled_schemes ) {
    if ( is_single() && 'post' === get_post_type() ) {
        $enabled_schemes['blog_post_scheme'] = 'Blog Post Scheme';
    }
    return $enabled_schemes;
});

このコードは、単一の投稿ページが表示されているときのみ「Blog Post Scheme」を追加します。

(著作権フリーのコードで構成されています。)

概要