ワードプレスカスタムメタボックスの日付ピッカー

Question

私はワードプレスを使い慣れていません。日付ピッカーをサポートするメタボックスフィールドを作成するにはどうすればよいですか？

function enqueue_date_picker(){ 
     wp_enqueue_script(
      'field-date', 
      get_template_directory_uri() . '/admin/field-date.js', 
      array('jquery', 'jquery-ui-core', 'jquery-ui-datepicker'), 
      time(), 
      true 
     ); 

     wp_enqueue_style('jquery-ui-datepicker'); 
    } 

add_action('admin_enqueue_scripts', 'enqueue_date_picker'); 

Answer 1

私はこのようなことをしましたが、tinyMCEリッチテキストエディタをカスタムメタボックスに適用しました。だから、あなたのコードを見て、あなたが変更する必要があります。

add_action('admin_enqueue_scripts', 'enqueue_date_picker'); 

を

add_action('admin_print_footer_scripts', 'enqueue_date_picker'); 

にあなたがワードプレスのコアのjQueryを使用する場合は、あなたのJSファイルに代わり$をjQuery接頭辞を使用するように注意してください。

Answer 2

があなたのプラグインからjqueryのUIのDatePickerのライブラリをエンキューする次のコード行を追加します。

wp_enqueue_script('jquery-ui-datepicker'); 

あなたはjquery ui libraryサイトからスタイルシートファイルをダウンロードしてプラグインに含めることができます。 （あなたはこのルートを経由して行けば、あなたのプラグインでCSSファイルを出荷する必要はありません）は、GoogleからjQueryのUIのCSSを含めることができ、また

wp_enqueue_style('jquery-ui-css', 'http://www.example.com/your-plugin-path/css/jquery-ui.css'); 

：あなたは、次のようなCSSファイルをエンキューう：今

<script type="text/javascript"> 
jQuery(document).ready(function($) { 
$('.custom_date').datepicker({ 
dateFormat : 'yy-mm-dd' 
}); 
}); 
</script> 

することができます：それは「CUSTOM_DATE」のクラスにすべてのフィールドに日付ピッカーを添付して

wp_enqueue_style('jquery-ui-css', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/smoothness/jquery-ui.css'); 

は、あなたのjavascriptファイルに次のjQueryコードを追加します。 HTMLコードの日付フィールドに「custom_date」クラスを追加するだけで、ユーザーがそのフィールドをクリックすると日付ピッカーカレンダーが表示されます。

<input type="text" class="custom_date" name="start_date" value=""/>