営業日や定休日を表示するカレンダーの無料ダウンロード

カレンダー
営業日を表示するカレンダーのスクリプトを無料でダウンロードできます。
名称は「ビジネスカレンダー(Business Calendar)」ということにしました。
普通です。ありきたりです。ネーミングに捻りがありません。

現在の最新バージョンは2018年1月12日公開の3.0です。

機能やサンプル

HTMLページにも表示することができ、カレンダーのデザインはすべてCSSで変更できます。
特に、管理画面の使いやすさ・わかりやすさは素晴らしいのではないでしょうか?
PCに不慣れなご年配の方でも確実に使えるでしょう。
主な特徴は以下の通り。

  1. 著作権表示不要。(バージョン3.0以降)
  2. HTMLページに組み込める。
  3. データベース不要。
  4. Ajaxでカレンダーを表示させることにより、前月・次月への切り替えにはページの移動なし。(管理画面ではページ移動があります)
  5. カレンダーのデザインはすべてCSSにて変更可能。
  6. CSSによって1つのdiv要素の横幅を調整するだけで、既存サイトのサイドバー部分などに組み込むことが可能。
  7. 管理画面の操作がわかりやすいので、教育コスト不要。
  8. 管理画面で登録や削除をした後、ブラウザの「戻る」や「進む」ボタンでページを行き来しても、再送信されない仕様。
  9. 美しいHTML。W3C準拠。HTML5文法エラーなし。
  10. 祝日を自動設定するアドオンを追加可能。
  11. 次の月を同時に表示するアドオンを追加可能。

ビジネスカレンダー表示ページのサンプル

管理画面のサンプル
ユーザ名はtani、パスワードは0000です。

ビジネスカレンダーのダウンロード

使い方の説明(基本設置方法)

1、ビジネスカレンダーをダウンロードし、解凍する。

2、フォルダごとアップロードする。

3、ブラウザでindex.htmlにアクセスしてみて、カレンダーが表示されるかどうかの確認をする。

4、config.phpを開き、管理画面にログインするためにユーザー名とパスワードを設定する。

// (必須) 管理者ユーザー名
$bc_admin_user = 'tani';

// (必須) 管理者ログインパスワード
$bc_admin_pass = '0000';

以上です。

「定休日」の文字列を変更したい場合

バージョン3.0からカレンダー下にある「定休日」の文字列を変更できるようになりました。

config.phpの8行目にある以下の部分で自由に変更してください。(以下は「休業日」に変更する例)

// (任意) カレンダーの下に表示される「定休日」の文字設定
$bc_holiday_string = '休業日';

既存サイトに組み込む方法

上記のカレンダー表示ページのソースを見るとわかるように、HTMLファイル内の以下の部分にカレンダーをAjaxによって表示させております。

<div id="business-calendar"></div>

ですので、まずは上記コードを既存サイトのページに貼り付けます。
次に、index.html内に記述されている以下のCSS・JavaScriptファイルの読み込みコードを既存サイトに貼り付けます。

<link rel="stylesheet" type="text/css" href="business-calendar/css/import.css" />
<link rel="stylesheet" type="text/css" href="business-calendar/css/business-calendar.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script type="text/javascript" src="business-calendar/js/business-calendar-js.php"></script>

ディレクトリ階層が変わる場合は、それぞれのパス部分を適宜変更してください。

カレンダー表示のカスタマイズ方法

カレンダーの横幅を狭めたり広げたりする場合は、CSS(business-calendar.css)によって上記の<div id=”business-calendar”></div>widthを変更するだけでOKとなります。
簡単だ!素晴らしい。自分で使いたいぐらいだ!

基本的には横幅を調整するだけで、既存サイトのサイドバー部分などに組み込むことができるでしょう。
それ以外のデザインを変更したい場合はCSSファイル(business-calendar.css)で自由に変更してください。(各セルの縦幅など)

また、Ajaxでカレンダーを表示させている関係上、上記の<div id=”business-calendar”></div>内に挿入されるカレンダーのソースは表示されません。
そのため、カレンダーのソースを確認したい場合は、以下のファイル(index.php)に直接アクセスすることで確認ができます。
https://www.1-firststep.com/samplephp/business-calendar-v3.0/business-calendar/php/index.php

このindex.phpindex.html内の<div id=”business-calendar”></div>内に表示させているとお考えください。

使用している外部ライブラリ

jQuery:jquery.min.js
https://jquery.com/

注意点

本プログラムの使用においていかなる損害が発生したとしても、当方は責任を負いません。
了承していただける方のみご利用ください。

ダウンロードできるのはこのページだけにしたいため、再配布や無断での販売だけは禁止いたします。
それ以外であれば、カスタマイズして自分のお店サイトやクライアントの企業サイトなどに使用するのも自由です。

また、ページ最下部にある著作権表示を削除するアドオン(追加機能)を有料で販売している関係上、著作権表示を無断で削除するのは禁止いたします。
無断で削除した場合、プログラムは正常に動作しなくなるかもしれません。ご注意ください。

(バージョン3.0からは著作権表示はなくなりました)

サポートに関して

無料のものですから、基本的にはサポートはありません。
が、初期状態での設置でエラーが出る場合は、サポートBBSにて無償対応いたしております。

初期状態とは、すべてのファイルを一切編集していない状態、またはconfig.phpだけを編集した状態のことを指します。
それ以外のファイルが編集されていたり、既存サイトに組み込んだ場合などのお問い合わせは有償となりますので、ご了承ください。

有償メールサポート(3,000円)設置代行サービス(10,000円)をご用意しておりますので、お急ぎの方にはおすすめです。

設置代行サービスや独自カスタマイズについて

設置の代行は10,000円(1つにつき・税抜)でお引き受けしています。
これは購入時に申し込む必要はありません。
まずはご自身でチャレンジしてみて、どうしようもなくなった時に設置代行を依頼されてもオーケーです。

設置代行はダウンロードしたままの初期状態のものを設置する形になります。
お客様の手によってカスタマイズされたものを設置するサービスではありませんのでご了承ください。

追加アドオン(追加機能)について

ビジネスカレンダーには以下の追加機能(アドオン)を用意しております。
各アドオンは併用することが可能ですので、ご自身にとって必要な機能だけを追加して使用することができます。

著作権表示を削除するアドオン
バージョン3.0からは著作権表示はなくなりました。

次月を同時に表示するアドオン
https://www.1-firststep.com/archives/4366

祝日を自動で赤色表示するアドオン
https://www.1-firststep.com/archives/4355

アップデート履歴

2012/10/05 バージョン1.0
  • 公開。
2017/05/14 バージョン2.0
  • 全面リニューアル。
2017/05/30 バージョン2.0.1
  • Chromeで「前月」と「次月」の表示がずれる件を修正。
2017/07/13 バージョン2.0.2
  • 「前月」と「次月」の文字の横にある矢印をクリックした際に反応がない点を修正。
2018/01/12 バージョン3.0
  • 著作権表示を無くしました。
  • 管理画面でのカレンダー表示を正方形に近い形にしました。
  • 「定休日」の文字をconfig.phpで変更できるようになりました。
  • 前月・次月をクリックした際に、ローディング画像が表示されるようになりました。
  • 次の月を同時に表示するアドオンを追加。
  • その他、細かなバグ修正など。

サポートBBS

サイト内を検索
サイト運用事例
提供サポート
メールフォーム

ダウンロード一覧へ

カレンダー

ダウンロード一覧へ

BBS

ダウンロード一覧へ

その他おすすめ

ダウンロード一覧へ

Web制作のブログ

ブログ記事一覧へ

カテゴリ別
制作者の詳細
  • 谷元博のブログ
  • Google+