WordPress管理画面にカラーピッカーを設置する方法です。
環境はWordPress4.8.2で確認しました。
/テーマ/js/colorPicker.js
1 2 3 4 5 |
(function( $ ) { $(function() { $('.myColorPicker').wpColorPicker(); }); })( jQuery ); |
.myColorPickerクラスにカラーピッカーjsを適用させます。
function.php
1 2 3 4 5 6 7 8 9 10 |
add_action('admin_print_styles', 'my_admin_print_styles'); function my_admin_print_styles() { wp_enqueue_style( 'wp-color-picker' ); } add_action('admin_print_scripts', 'my_admin_print_scripts'); function my_admin_print_scripts() { wp_enqueue_script( 'wp-color-picker' ); wp_enqueue_script( 'my-admin-script', get_bloginfo('stylesheet_directory') . '/js/colorPicker.js', array( 'wp-color-picker' ), false, true ); } |
表示方法
WordPress4.8管理画面に項目を追加してそれを画面に表示する方法を試しました。
環境はWordPress4.8.2で確認してい...
上記のfunction hoge_box_options_page()のinputのclassにmyColorPickerクラスを設定すればカラーピッカーが管理画面に表示されます。
実際のユーザが見る画面に表示するやり方は上記のページに記載があります。