【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をコピーしました!
スゴヨクン
この記事の執筆者
スゴヨクン

成果主義Webマーケター見習い。
SEOから広告運用、アクセス解析まで「売れる仕組みづくり」を魔法のように研究中。
難しい用語もやさしく噛み砕いてお届けします。
「スゴくヨクなる」ヒントを、今日もあなたに。

株式会社スゴヨク 川上晋平
この記事の監修者
川上 晋平

株式会社スゴヨクにてマーケティング戦略の立案から実行までを統括。中小企業やスタートアップ向けにWeb広告運用、LP制作、SEO対策など幅広い支援を行っており、これまでに100社以上のデジタル施策をサポート。現場の視点とデータに基づいた分析力に定評があり、確かな実績と最新の知見に基づいた監修を行っています。
■資格:
Google アナリティクス認定資格
Google 広告の検索広告認定資格
Google 広告「ディスプレイ広告」認定資格


CONTACT US

CONTACT US お問い合わせ・ご相談

お見積り・ホームページ制作・運用、広告に関するご質問まで、
どんなことでもお気軽にご相談ください。
日・祝日・休業日以外は24時間以内に返信いたします。

目次