只需要 2個步驟, 就可以讓網頁的輸入框(text) 下方多彈出日期的挑選器。只是，預設彈出來的是英文版日歷，再加一些參數就可以變成中文版日曆。
這個範例使用到 jqueryui, 官方網站：
First write following code in template file. These code will include js and datepicker class in the template.
wp_enqueue_script('jquery');
wp_enqueue_script('jquery-ui-core');
wp_enqueue_script('jquery-ui-datepicker');
wp_enqueue_style('jquery-ui-css', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css');
Write following php code in functions.php for date field. Or you can also write this code in template file.
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#atm_datetime').datepicker({
dateFormat: 'yy-mm-dd',
dayNames:["星期日","星期一","星期二","星期三","星期四","星期五","星期六"],
dayNamesMin:["日","一","二","三","四","五","六"],
monthNames:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
monthNamesShort:["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
prevText:"<上月",
nextText:"下月>",
firstDay: 1,
isRTL: false,
showMonthAfterYear: true,
yearSuffix: '年',
weekHeader:"週"
});
});
</script>
這裡比較特別的是只能用 2個 yy, 用 4個 yy 會變成 20172017 變8碼。 @_@;
Add Id “date” to input field.
<input id="date" name="date" />
相關文章：
jQuery UI Autocomplete for Search field in WordPress
http://stackoverflow.com/questions/42717105/jquery-ui-autocomplete-for-search-field-in-wordpress
jQuery UI Datepicker 示例（三）
http://wiki.jikexueyuan.com/project/jquery-tutorial/jquery-ui-datepicker-example-three.html