SOY Shopで予約サイトを運営するの記事でSOY Shopを予約アプリ化するプラグインの紹介をした。

最近、このプラグインを活用した予約サイトを構築したいという連絡を4件程連続で頂いたので、

せっかくの機会ということで、


※PCの画面幅で表示


※スマホの画面幅で表示


こんな感じで、

Bootstrap 4系をベースとしたレスポンシブ対応したカレンダーをサンプルコードをコピペするだけで構築できる拡張のプラグインを開発してみた。

Bootstrap · The most popular HTML, CSS, and JS library in the world.


直近の開発案件に対応するため、

PCでカレンダーを表示した場合は1ヶ月分のカレンダー、

スマホの幅で画面を開いた場合は今日から2週間分の縦型のカレンダーになる。


このUIの拡張機能は、

予約カレンダースマホ拡張プラグインをインストールすると使用可能となる。


このプラグインで、

予約カレンダーアプリの導入コストが少しでも下がれば良いなと、

引き続き予約カレンダーアプリの開発を進めることにする。


今回対応分を含んだパッケージは下記のサイトからダウンロード出来ます。

https://saitodev.co/soycms/soyshop/