MENU

【Datepicker】コンタクトフォーム7 Datepickerで特定の曜日を選択できないようにする

コンタクトフォーム7 特定の曜日 選択できない

福岡、大阪、東京でホームページ制作、SEO対策を行っている株式会社スゴヨクです。
さて今回は、
ワードプレスで来店予約のフォームを作る時のカスタマイズについて書きたいと思います。
来店予約のフォームを作る時は、プラグインを用いて、
コンタクトフォーム7 + Contact Form 7 Datepicker(プラグイン)
上記の2つのプラグインで作ることが多いのではないかと思います。
店休日や土日を最初から選択できないようにカスタマイズしていきます。

jsファイルの中に
$(function() {
    $('input[name="date"]').datepicker({
      beforeShowDay: function(date) {
        // 日曜日
        if (date.getDay() == 0) {
          return [false, ''];
      }
        // 水曜日
        if (date.getDay() == 3) {
            return [false, ''];
        }
        // 土曜日
        if (date.getDay() == 6) {
          return [false, ''];
      }
        return [true, ''];
      }
    });
});

このコードを読み込んでいるjsファイルの中に記述すれば選択できないようになります。

簡単に説明すると、今回は日曜を週初めに設定しているので、
0=日曜日
1=月曜日
2=火曜日
3=水曜日
4=木曜日
5=金曜日
6=土曜日
数字を変更、削除するだけでDatepicker上で選択できないようになります。
祝日なども選択できないようする方法などはググると出てくるので、探してみてください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

目次