選択されているタグ : カスタマイズ , cal-demo

お店が今やってるかどうか、アクセス時点の営業情報を表示する(Plugin_Scheduleと連動)

「今、営業しているかどうか」を表示するカスタマイズ


アクセスした時点での時間(%{G}時%{i}分)をもとに「今、営業しているかどうか」を表示するカスタマイズです。
Plugin_Scheduleモジュールで指定した「休日」や「メッセージ」と、連動して表示できます。
メッセージとは、Plugin_Scheduleの変数{item}のことです。

雑ですみませんが、紹介します。

デモ

デモを見る →

実際のスケジュール(7月5日は休みとか)が設定されていないので、デモといっても分かりづらいかもしれません。
「営業しているかの判別箇所がある」「営業カレンダーがある」ってことが伝わればOKです。

このカスタマイズの対応バージョン

〜Ver. 2.7.7
2017-05-21時点での情報です。

手順

  1. 定休日カレンダーを作る
  2. 今の営業案内を表示させる(例えばTOPページに)

カスタマイズ作業は、大きくこの2つに別れています。


1.定休日カレンダーを作る


1-1.スケジュール管理で、スケジュールセットの設定をする



スケジュールセットを作成。
「セット名」「説明」は何でもOK



ラベルを設定する。



「ラベル名」「クラス」を入力。
ここで決めたクラスを、あとで使います。



登録データの入力



日にちごとに「休み」を設定します


1-2.営業日カレンダーとして表示できるようにする



カレンダーを表示させたいページに、モジュールIDを組み込みます。
ここでは仮に、カテゴリー「cal-demo」に表示するとします。



こんな感じで、専用のテンプレートを作りましょう。
あと、このカテゴリーは、キャッシュさせない方が良いです。
運用次第ですが、営業日の更新がすぐ反映できる方が良いですよね。
そこで、ルール機能を使って「営業カレンダー」カテゴリーだけ、キャッシュさせないコンフィグ設定をしましょう。

Plugin_ScheduleのモジュールIDを作る



まずは、休みか営業かが分かるカレンダー表(七曜表)




↓次に日ごとの詳細が分かるリストを作る。




カレンダー表(七曜表)と、リストに、それぞれモジュールIDを設定する。
サイトによっては七曜表だけで良いかも。





classが付与されていたら成功です。
色づけはcssで行いましょう。


2.TOPページなどに今の営業案内を表示させる


ここまでは、ふつうにPlugin_ScheduleのモジュールIDを使った「定休日カレンダー」です。
ここからが営業時間の判定です。


2-1.postincludeで、キャッシュさせない状態にする


postincludeって何?という方でも、とりあえずコピペすれば分かると思います。

まず目的です。
1ページの中で「ただいまの営業案内」だけ、キャッシュさせないようにしたいです。
たとえば、TOPページそのものはキャッシュが効いているんだけど、営業案内の箇所だけはいつでも最新情報として表示させたい、ということです。

なぜならキャッシュさせると、アクセスした時間での表示ができなくなるからです。
例えば午後8時にアクセスしているのに、正午の情報を表示しちゃうと、本当は閉店時間すぎてるのに「いま営業してます!」とか表示されて困ります。


「キャッシュさせないポストインクルード」のソース


これをコピペすれば、いけるはずです。
「ただいまの営業情報」を表示させたい箇所に、貼り付けましょう。

<form action="" method="post" class="js-post_include-ready" >
	<!-- キャッシュがオンでもランダム表示が可能になる記述ここから-->
	<input type="hidden" name="hash" value="Math.random()" class="js-post_include-eval_value" />
	<input type="hidden" name="query[]" value="hash" />
	<!-- キャッシュがオンでもランダム表示が可能になる記述ここまで-->
  <input type="hidden" name="tpl" value="include/openinfo/hantei.html" />
  <input type="hidden" name="bid" value="%{BID}" />
  <input type="hidden" name="ACMS_POST_2GET" />
</form>

ソースの解説



ちなみに「キャッシュがオンでもランダム表示が可能になる記述」が
なぜそうなるのか、僕も詳しく分かっていないです。
たしか、厳密には違うページとして読み込むことで、結果的にキャッシュが効かないよって話だと記憶してます。


くわしくは下記を参照ください


「キャッシュさせないポストインクルード」については、フォーラムで質問しました。
参照資料として、ごらんください。
フォーラムでの質問


2-2.インクルード先のファイルを用意する


hante.htmlを作る。
hante.htmlも、Plugin_Scheduleのスニペットを貼り付けて作ります。
そのあとは基本的に「営業カレンダー」に表示している情報を、IFブロックで判定していく作業になります。


営業しているかどうか判定させるIFブロックの概要


こんな順にIFブロックで判定していきます。

  1. 今日を特定
  2. 今日は休みか判定
  3. 営業時間を判定
  4. 短縮営業(午後1時〜営業)なのか判定

具体的な作業は下記です。


2-3.「営業しているか」判定用のモジュールIDを作る


IFブロックでの判定作業より前に、モジュールIDを2つ用意します。





そして、IFブロックを書いていくわけですが
ソースを見た方が早いと思うので、下記「判定箇所のソース(例)」をごらんください。


判定箇所のソース(例)


<div class="module-header clearfix">
	<h2 class="">ただいまの営業案内</h2>
	<span class="timeInfo">%{G}時%{i}分時点でのご案内</span>
</div>

<div class="openInfo">
<!-- BEGIN_MODULE Plugin_Schedule id="calendarThis" --><!-- BEGIN unit:loop -->
<!-- BEGIN month:loop -->           
	<!-- BEGIN week:loop -->
    	<!-- BEGIN day:loop -->	        	
            	
        	<!-- BEGIN day:veil -->
            	<!-- BEGIN_IF [{day}/eq/%{d}] --><!-- ▼▼▼今日を特定 -->
            	
            		<!-- BEGIN dayClass:veil -->
	            		<!-- BEGIN_IF [{dayClass}/eq/yasumi] --><!-- ▼▼▼休みか判定 -->
	            		<div class="kekka"><span class="shopClose">CLOSE</span>本日は臨時のお休みです。</div><span class="timeInfo">(%{n}月 %{j}日時点でのご案内)</span>
	            		<!-- ELSE_IF [{dayClass}/eq/eigyou] --><!-- 臨時営業 --><div class="kekka"><span class="shopOpen">OPEN</span>本日は臨時で営業しています。</div><span class="timeInfo">(%{n}月 %{d}日時点でのご案内)</span>
	            		<!-- ELSE_IF [{weekNo}/lk/w0] --><div class="kekka"><span class="shopClose">CLOSE</span>日曜日は定休日です。</div><span class="timeInfo">(%{n}月 %{d}日時点でのご案内)</span>
	            		<!-- ELSE --><!-- ▼▼▼休みでもなく日曜でもない -->
	            			<!-- BEGIN_IF [%{G}%{i}/lt/945] --><!-- ここから営業時間を判定 -->
	            			<!-- ▼▼▼18時30分以降である --><div class="kekka"><span class="shopClose">CLOSE</span>開店時間まで、お待ちください。</div><p class="normalTime"><span class="acms-icon acms-icon-time"></span>通常、午前9:45〜開店いたします。</p>
	            			<!-- ELSE_IF [%{G}%{i}/gt/1830] --><!-- ▼▼▼18時30分以降である --><div class="kekka"><span class="shopClose">CLOSE</span>本日の営業は終了いたしました。</div>
							<!-- ELSE --><!-- ▼▼▼営業中である -->
								<div class="kekka"><span class="shopOpen">OPEN</span>本日、営業日です。</div>
									<!-- BEGIN_IF [{dayClass}/eq/gogoichi] --><!-- ▼▼▼午後1時〜営業 -->
									 ※本日は午後1時より営業<hr class="clear">
									<!-- ELSE --><p class="normalTime"><span class="acms-icon acms-icon-time"></span>午前9:45〜午後6:30まで</p><hr class="clear">
									<!-- END_IF --><!-- ▲▲▲後1時〜営業 -->
							<!-- END_IF -->
	            		<!-- END_IF --><!-- ▲▲▲休みか判定 -->
            		<!-- END dayClass:veil -->
            	<!-- END_IF --><!-- ▲▲▲今日を特定 -->	            	
        	<!-- END day:veil -->
			
        <!-- END day:loop -->
	<!-- END week:loop -->            
<!-- END month:loop -->
<!-- END unit:loop -->
<!-- END_MODULE Plugin_Schedule -->
</div>
  1. 今日を特定
  2. 休みか判定
  3. 営業時間を判定
  4. 短縮営業(午後1時〜営業)なのか判定

ソースから、この流れでIFブロックを使っていることが、分かると思います。

条件を加えたいなら、IFブロックを書き足していけばいい

条件を加えないときは、対応するスケジュールのラベルも増やすます。
例えば「閉店時間がいつもより3時間早い」とか。
そもそも、どのくらいの精度で判定させたいかによって、ここは変わります。

2-4.メッセージは、スケジュールの変数{item}を使って表示させる

営業日・営業時間の判定とは別に、日ごとのメッセージ({item})も表示できます。
そのためにモジュールID「calendarThisItem」を使います。



メッセージ({item})箇所のソース


<!-- BEGIN_MODULE Plugin_Schedule id="calendarThisItem" --><!-- BEGIN unit:loop -->
<!-- BEGIN month:loop -->           
	<!-- BEGIN week:loop -->
    	<!-- BEGIN day:loop -->	        	
        	<!-- BEGIN day:veil -->
            	<!-- BEGIN_IF [{day}/eq/%{d}] --><!-- ▼▼▼今日を特定 -->
				<!-- BEGIN plan --><!-- BEGIN item:veil --><p class="">「{item}」</p><!-- END item:veil --><!-- END plan -->
	            <!-- END_IF -->
        	<!-- END day:veil -->
        <!-- END day:loop -->
	<!-- END week:loop -->            
<!-- END month:loop -->
<!-- END unit:loop -->
<!-- END_MODULE Plugin_Schedule -->

{item}を表示するには、スケジュールのモジュールIDで「リスト表示」に指定する必要があります。
「七曜表」の表示では、{item}が表示できないです。(たぶん)
そのため、こうして別のモジュールを使うことになります。


雑でごめんね。


雑ですみませんが、これでスケジュールと連動しら「今の営業案内」ができます。
営業前のセリフとか、営業終了後のセリフとか考えるのが楽しいですよ。
RPGツクール思い出します。

さらに盛り込むなら

標準のグローバル変数は、今日の「時間」「分」だけです。
「明日」に関するグローバル変数を作れば、さらに色々できそうです。

たとえば、定休日に「明日は9時から営業します!」とか「明日から10%オフセールです!」とか表示できるのでは?


投稿者名 すずきカレー 投稿日時 2017年05月20日 | Permalink