2

投稿オプションを作成し、その中にワードプレス カラー ピッカー コアを実装したい

多くのチュートリアルやソースから入手したこのコードを試してみましたが、残念ながらまったく機能していません。コードを追加したことがないようです。

HTML

<input name="mv_cr_section_color" type="text" id="mv_cr_section_color" value="#ffffff" data-default-color="#ffffff">


PHP

function Colorpicker(){ 
  wp_enqueue_style( 'wp-color-picker');
  wp_enqueue_script( 'wp-color-picker');
}
add_action('admin_enqueue_scripts', 'Colorpicker');


JQuery

jQuery(document).ready(function(){
   jQuery('#mv_cr_section_color').wpColorPicker();
});
4

2 に答える 2

5

テーマ オプション ページをどのように作成しているかはわかりませんが、以下は実際の例です。サンプル コードとほぼ同じコードですが、エンキューはカスタム メニュー ページのコールバックで直接行われ、jQuery は次のように参照されます$( の宣言に注意してくださいready(function($))。

<?php
/**
 * Plugin Name: Testing the Color Picker
 */

add_action( 'admin_menu', 'b5f_demo_menu' );

function b5f_demo_menu() 
{
    add_menu_page(
        'Test', 
        'Test', 
        'edit_pages', 
        'test-slug', 
        'b5f_callback_function'
    );
}

function b5f_callback_function() 
{
    wp_enqueue_script('wp-color-picker');
    wp_enqueue_style( 'wp-color-picker' );
    ?>
    <input name="mv_cr_section_color" type="text" id="mv_cr_section_color" value="#ffffff" data-default-color="#ffffff">
    <script type="text/javascript">
    jQuery(document).ready(function($) {   
        $('#mv_cr_section_color').wpColorPicker();
    });             
    </script>
    <?php
}

を使用する場合admin_enqueue_scripts、コールバック関数には 1 つのパラメーターがあります$hook_suffix。これにより、スクリプトとスタイルが正しい画面にのみ追加されていることを確認できます。

add_action( 'admin_enqueue_scripts', 'b5f_custom_enqueue' );

function b5f_custom_enqueue( $hook_suffix )
{
    // CHECK IF CORRECT PAGE, IF NOT DO NOTHING
    # if ( 'my_hook-name' != $hook_suffix )
    #    return;

    ?>
    <script type="text/javascript">
        // Use this to check the hook_suffix name
        console.log('<?php echo $hook_suffix; ?>');
    </script>
    <?php
}
于 2013-08-19T20:52:25.013 に答える