設計情報

投稿者: SPIRERS ナレッジ向上チーム 2025年4月23日 (水)

テンプレートアプリ「QR来場受付」

この記事では、テンプレートアプリ「QR来場受付」の概要や内容物をご紹介いたします。
テンプレートアプリとは、SPIRAL ver.2にインポートし、業務に合わせてカスタマイズして使用できるアプリパッケージです。
SPIRAL ver.2 テンプレートアプリ一覧」にて、様々なテンプレートアプリを配布しています。

概要

セミナーや展示会等の受付業務で紙で記入していた作業を、QRコードを使用することでWeb化可能です。
QRコードを読み取れるスマホで誰でも受付が可能になりますので、様々なシーンでご利用いただくことが可能です。

フロー図

受付開始時間の制御
来場受付を開始する時間と終了する時間を設定することで、QRコードを読み込んでも対象時間外の場合は
画面の表示を変更し、お客様が受付期間以外で来場ステータスを更新することを防ぐことが可能です。


QR来場受付のブロックの自動登録より来場受付の開始日と終了日を設定可能です。
スタッフコードの入力記録機能
来場の受付の際は受付スタッフDBのスタッフコードの入力が必要ですが、
一度入力すれば内容がセッションに記録されます。
PHPを利用してセッションが有効な間はスタッフコードが自動的に入力する挙動のため、
受付のたびに入力する必要はございません。
インポート後のインポート後も設定の修正は不要です。
QRコードの作成
来場受付のためのQRコードは、JSとjqueryを利用して表示しています。
テンプレートアプリをダウンロードする

※ テンプレートアプリの導入手順はこちら

難易度
ビジュアル設定ソース設定
70%30%
DB数2
ページ数6
ブロック数8
JavaScriptあり
PHPあり
APIなし
インポートの所要時間 … 約10分

内容物(アプリ)

DB
表示名 レコードサイズ 備考
QR受付登録DB【AP009】 1.5 KiB イベントに申し込みを行うDB
表示名 識別名 タイプ 必須 ユニーク
申込ID appID テキスト
認証キー certificationKey テキスト
会社名・組織名 company_name テキスト
部署名 department_name テキスト
氏名 name テキスト
メールアドレス email メールアドレス
電話番号 telephone_number 電話番号
郵便番号 postal_code テキスト
都道府県 prefecture セレクト
市区町村 address1 テキスト
番地 address2 テキスト
建物名・部屋番号 address3 テキスト
受付スタッフコード staffCode 参照フィールド
受付日 receptionDate 日付
ステータス status セレクト
受付スタッフDB【AP009】 512 bytes 来場受付をするスタッフを登録するDB
表示名 識別名 タイプ 必須 ユニーク
受付スタッフコード staffCode テキスト
スタッフ名 staffName テキスト
スタッフメールアドレス staffMail メールアドレス
アプリロール
表示名 備考
来場受付管理者【AP009】 来場受付やスタッフ登録を管理するアプリロール

内容物(サイト)

ページ
識別名 表示名 備考
resist イベント申込【AP009】 認証エリア
click_login_error クリックログインエラー【AP009】 ログインエラーページ
session_errer セッションエラー【AP009】 セッションエラーページ
logout ログアウト【AP009】 ログアウトページ
QR_check イベント申込【AP009】 来場を受け付けるページ
resist QRコード来場受付【AP009】 QRコードを表示するページ
app イベント申込【AP009】 イベント申込ページ
※ ページの識別名がURLパスになります。
ブロック(汎用パーツ)
表示名 設置認証エリア 設定方法 ブロック種類 備考
header 設定なし ビジュアル フリーコンテンツ ロゴ付きのヘッダー
footer 設定なし ビジュアル フリーコンテンツ フッター

別途必要なファイル

サイトファイルはパッケージに含まれないため、別途用意していただく必要があります。
サイトファイル
フォルダ/ファイル名 タイプ 備考
header_logo.png 画像 ヘッダーのロゴ画像※jpgやsvgも利用可能
jquery.js JSファイル jquery.min.js(ダウンロード先:jQuery公式サイト
※ver3.7.1にて動作確認。
※サイトファイルは「.」が2つ以上、使用できないので、リネームが必要です。
jquery_qrcode_min.js JSファイル jquery.qrcode.min.js(ダウンロード先:GitHub
※サイトファイルは「.」が2つ以上、使用できないので、リネームが必要です。

インポート後の必須修正点

メールアクションの有効化
インポート後は全てのメールアクションのステータスが「無効」になっており、アクションによるメール配信が
実行されません。

下記のメールアクション一覧を参考に、各アクションのステータスを「有効」に切り替えていただく必要があります。
アクション名 アクション設定場所 種別 設定箇所
申し込み登録サンクスメール【AP009】 イベント申込登録ブロック【AP009】 登録フォームブロック メールアクション
クリックログインURLの再設定
下記のメール設定にて、
{{@_url.cl._unauthorized}}
となってしまっているクリックログインURLを
再設定していただく必要があります。
アクション名 アクション設定場所 種別 設定箇所 クリックログインURL設定ページ
申し込み登録サンクスメール【AP009】 イベント申込登録ブロック【AP009】 メールアクション 登録フォーム
ブロック
イベント申込【AP009】
クリックログインURLの再設定方法
メール設定の本文から
{{@_url.cl._unauthorized}}
を選択し、「クリックログインURL」をクリックした後、
表の「クリックログインURL設定ページ」に書かれているページを設定してください。
また、クリックログインの有効期限は受付開始~イベント終了までの日数に設定してください。
期間中に有効期限が切れてしまうとQRコードが表示できなくなってしまいます。
サイトファイルへのファイルアップ
このテンプレートアプリではQRコード生成のため、logo画像の他、jquery関係のファイルを
2つサイトファイルにアップしていただく必要があります。
 ・jquery.min.js (ダウンロード先:jQuery公式サイト※ver3.7.1にて動作確認。
 ・jquery.qrcode.min.js (ダウンロード先:GitHub

上記2ファイルをダウンロードいただいたら、下記にファイル名を変更します。
 「jquery.min.js」→「jquery.js」
 「jquery.qrcode.min.js」→「jquery_qrcode_min.js」
 「logo画像」→「header_logo.png」
 ※サイトファイルは「.」が2つ以上、使用できないので、リネームが必要です。
ファイル名の変更が完了したら、上記手順でサイトファイルに3ファイルをアップロードしてください。 上記のようにファイル名が表示されたらアップロード完了です。
テンプレートアプリをダウンロードする

※ テンプレートアプリの導入手順はこちら

解決しない場合はこちら コンテンツに関しての
要望はこちら