web-dev-qa-db-ja.com

テーマカスタマイザーカラーピッカーのJavascript設定オプションの変更

私はWordpressテーマカスタマイズAPIを私のWordpressテーマに完全に統合し始めました、そしてそれは驚異的です。私が遭遇した一つの問題は、デフォルトのカラーピッカーを含めることは素晴らしいことですが、私は使用されているアイリスカラーピッカーの設定オプションを変更する方法を決定しようとしています。

デフォルトでは、テーマのカスタマイズペインのカラーピッカーにはピッカーの下にカラーパレットがあり、右側には明るさの縦線があります。テーマのフロントエンドで使用している設定を（アイリスピッカーを使用して）模倣したいと思います。

これらの設定を使用するようにTheme Customizationカラーピッカーを変更する方法について教えてください。私のサイトのフロントエンドに使用している設定とはまったく異なるものについては、以下を参照してください。

   $("#theme-color").wpColorPicker({
        border: false,
        controls: {
            horiz: 's', // horizontal defaults to saturation
            vert: 'l', // vertical defaults to lightness
            strip: 'h' // right strip defaults to hue
        },
        mode: 'hsl',
        palettes: false,
        width: 160,
        change: function(event, ui) {
            var selectedColor = ui.color.toString();

            $.removeCookie('spot_colour');

            // Set our cookie to last for 1 day
            $.cookie('spot_colour', selectedColor, { expires: 1, path: '/' });

            // Apply any selected colours
            applySpotColours();
        }
    });
theme-developmentcustomizationtheme-customizercolor-picker
2
Dwayne Charrington

カラーピッカーのものはjQuery UIウィジェットとして登録されているので、ウィジェットがページで使用される前にそのプロトタイプオブジェクトを変更することができます。

add_action('customize_controls_print_footer_scripts', function(){

  ?>
  <script>

    jQuery(document).ready(function($){

      $.wp.wpColorPicker.prototype.options = {

        border: false,
        // other options here...

      };         
    });   

  </script>
  <?php

});

（あなたはそれをあなたの.jsファイルに入れるべきです）

2
onetrickpony