コンタクトフォームの日付をカレンダーで選択する方法【Contact Form 7 Datepicker】

みーちゃん
コンタクトフォームの日付をカレンダーで選択する方法はないのかな??

 

そんな疑問に答える本記事です!

 

こんにちは。未経験から稼げるエンジニアになった、いちかわともや(@tomochan8282)です。本日は、コンタクトフォームの日付をカレンダーで選択する方法をご紹介したいと思います。

 

本記事を読めば、コンタクトフォームの日付をカレンダーで選択する方法がわかります。

未経験から
稼げるエンジニアになる
正しい方法

侍エンジニア塾なら、わずか6ヶ月で稼げるエンジニアを目指せます。IT業界が人手不足の今、思い切ってエンジニアになってみませんか?

 

コンタクトフォームの日付をカレンダーで選択する方法【Contact Form 7 Datepicker】

◆もくじ

コンタクトフォームの日付をカレンダーで選択する方法【Contact Form 7 Datepicker】

  1.  Contact Form 7 Datepickerをインストール
  2.  カレンダーのデザインを選択
  3.  昨日以前の日付を選択できなくする設定




 

▼コンタクトフォームの設定方法はコチラ

 

Contact Form 7 Datepickerをインストール

 

こちらは、コンタクトフォームの日付選択の初期状態です。数字を選んで入力しなければいけません。

 

このような記述になっています。

 

カレンダーで日付を選択する機能を追加するために、「プラグイン」>「新規追加」より「Contact Form 7 Datepicker」をインストールします。

 

「有効化」をクリックしましょう。

 

カレンダーのデザインを選択

「お問い合わせ」>「コンタクトフォーム」に戻り、「Datepicker Theme」タブを選択します。

 

①カレンダーのデザインを選択し、保存します。②最後に、全体の保存もします。

 

 

このように、日付をカレンダーで選択できるようになりました。

 

昨日以前の日付を選択できなくする設定

 

さらに、

 

[date date-date]

を削除して、「日付」をクリックし、「min-date」に「0d」と入力をすると、、

 

昨日以前の日付の選択ができなくなりました!(本記事は2019年5月29日に執筆)

 

最後までお読みいただきありがとうございました!

未経験から
稼げるエンジニアになる
正しい方法

侍エンジニア塾なら、わずか6ヶ月で稼げるエンジニアを目指せます。IT業界が人手不足の今、思い切ってエンジニアになってみませんか?

 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA