当サイトでもお世話になっている「Contact Form 7」なのですが、設定画面で日付を選ぶと出力されるHTMLのinputタグにtype=”date”が自動的に付加されます。
これはHTML5から強化されたフォームコントロールを使うための属性で、対応ブラウザの場合、ユーザーはより簡単で正確にフォーム入力をすることが可能になります。例えばChromeの場合だとtype属性にdateを指定したフィールドはカレンダー入力ができるようになります。また、iPhoneやAndroidのブラウザでもサポートされています。詳しくはこちら。

サイトのユーザーにとっても開発者にとっても素晴らしい仕様なのですが、残念なことに<input type=”date”>の入力補助は、現在のところ、まだ主要ブラウザの一部では使うことができません（IEとかFirefoxとか）。

Contact Form 7 Datepickerを使ってみた

Contact Form 7の日付のカレンダー入力には「Contact Form 7 Datepicker」というプラグインがよく使われているっぽかったので、さっそく自分も導入してみたところ、PCで使うぶんには問題ありませんでしたが、iOSのSafariで見るとカレンダーとキーボードが両方いっぺんに出てきて、ややこしわ！って言いたくなる感じでした。
さらに言うと、iOSのSafariにおいては先述の通りもともと<input type=”date”>に対応していて、スマートフォンのような画面サイズの小さいデバイスではカレンダー入力よりも、デフォルトの入力方法（スピナーとかスピニングウィールとか言ったりするそうです）のほうが個人的には使いやすいと感じました。
というわけで、こちらのプラグインは却下させて頂きました。

プラグインを使わずにクロスブラウザ対応する

もっと良い方法は無いかと調べてみると、本家サイトにちゃんと対策が載っていました。

CONTACT FORM 7 は HTML5 の入力タイプをサポートしますか?

Contact Form 7 は date、number 両入力フィールドのために jQuery UI ベースのフォールバック機能を提供することができます。これを利用することで、Firefox でも Internet Explorer でも、date フィールドにはカレンダーの UI を、number フィールドにはスピンボックスの UI を、それぞれ提供することができるようになります。

その方法は至って簡単です。
functions.phpに以下のコードを追記するだけ。

add_filter( 'wpcf7_support_html5_fallback', '__return_true' );

これにより、<input type=”date”>をサポートしているブラウザではデフォルトの入力方法で、未対応のブラウザではjQuery UIのDatepickerによるカレンダー入力が可能となります。

あと、日本語化するには、header.php等に以下を記入しておく必要があります。

wp_enqueue_script('jquery.ui.datepicker-ja','http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/i18n/jquery.ui.datepicker-ja.js');

※追記する場所（読み込む順番）によっては正常に日本語化しない場合があります。

 おまけ

選択できる日付を“今日から◯日後以降”としたい場合は、dateのショートコード内に「min:today+5days」と追加します。（この場合は今日から5日後となります。）
ブラウザによっては選択できてしまうんですが、送信ボタンを押すとちゃんとエラーが吐かれます。