Template Party

「タイプ2:管理ページ版」のカレンダープログラムについて

※今まで「平日」だった日が「祝日」になった場合
『国民の休日』など、今まで平日だった日が突然祝日になる場合があります。そういった場合は手作業で祝日設定を行って下さい

使用テンプレートを手元に準備しておいて下さい

今回の例題では、tp_shop4テンプレートを使いますが、基本的にどのテンプレートにもカレンダーは設置できます。

カレンダー用プログラムをダウンロードします

calender.zip (jsファイルと、calenderフォルダ内にcalender.phpが梱包されています)
をダウンロードして解凍します。

解凍したプログラムをご利用のテンプレートに移動します

calenderフォルダはそのままテンプレート内に移動します。
jsフォルダについては、ご利用のテンプレートにすでにjsフォルダがある場合は、フォルダ内のcalender.jsファイル1枚だけをお手元のjsフォルダに移動します。jsフォルダがお手元にない場合はフォルダごと移動して下さい。

「タイプ2:管理ページ版」のカレンダープログラムの設置方法

基本的に全ページにカレンダーを入れたい場合が多いと思いますが、まずトップページ(index.html)に設定してみましょう。ご利用のテンプレートのindex.htmlファイルを開き、htmlタグが見えるようにしておいて下さい。

まずはhtmlの上の方にある</head>の上の行に次の1行を入れます。

次に、カレンダーを表示させたい場所に次の2行を入れます。

最後にhtmlの下の方にある</body>の前に次の行を入れます。

カレンダー用のスタイルをcssフォルダのstyle.cssに追加します。

ファイル一式をアップロードします

カレンダーが表示されればひとまずOKです。次は専用管理ページにログインします。

専用管理ページについて

「タイプ2:管理ページタイプ」カレンダーには専用管理ページがついています。
以下のアドレスでアクセスして下さい。
http://(あなたのサイトのドメイン)/calender/calender.php?mode=form
ユーザー名:admin、パスワード:test1234でログインします。
※ユーザー名とパスワードは必ず変更して下さい。calender.phpファイル本体の冒頭で変更できます。

ログインできない、サーバーエラーが出る場合

calenderディレクトリにパーミッションの設定を行う必要があります。書き込みができる設定に変更して下さい。パーミッションの数値や設定方法はご利用のサーバー会社にお尋ね下さい。

ログインしたら

「カレンダー設定」ページが開きますので、必要に応じて定休日など入力して下さい。
最後に管理ページ一番下にある「保存」ボタンを押します。

保存が終わったらログアウトして下さい

管理ページ左上に「ログアウト」ボタンがありますので選択してログアウトして下さい。

以下の画像をクリックすると、実際の完成サンプルを見る事ができます

背景色を変更したい場合

cssフォルダのstyle.cssに上のステップで追加した「.cal .on」の「background」の色を変更すればOK。

その他の使い方:ずっと先のカレンダーを表示させたい場合

1年後とか、特定の年・月のカレンダーを表示させたい場合、htmlの下の方に追加したタグから以下の部分を変更して下さい。以下の例だと、2018年の9月と10月のカレンダーが表示されます。
実際のサンプルはこちら。

マニュアル通りにやったけど、うまくいかない!という場合は

サポート掲示板をご利用下さい。