サイネージ
アプリ設定ガイド
天気・ニュース・SNS・動画・Webページ・予約まで。画面に出せる12のアプリを、一つずつ「できること・設定手順・入力する項目・注意」の順に整理しました。
この資料は、店頭の画面に出せる12のアプリを、実際に設定するための手引きです。使いたいアプリ名をクリックすると、その設定へ移動します。各アプリには2種類あります。
アプリの入れ方(共通の流れ)
どのアプリも置き方は共通です。まずこの流れだけ覚えてください。各アプリの項では「そのアプリ特有の設定」だけを説明します。
- レイアウトを開くデザイン → レイアウト →「レイアウトを追加」。既存を直すときは行メニュー →「デザイン」。
- (分割する場合)領域を足す画面を区切って複数アプリを同時に出すときは領域を追加。全画面なら領域は1つ。
- アプリを配置する左のツールボックスから、使いたいアプリを領域へドラッグ。
- アプリを設定する右パネルで、そのアプリの項目(URL・地点・件数など)を入力。
- 表示時間を決めるそのアプリを何秒表示するか(動画は「0」で最後まで)。
- 公開する編集後は必ず「公開」。公開しないと画面は変わりません。
12アプリの設定方法
天気 標準アプリ
地域の天気予報を自動表示。毎日更新され、店頭に季節感を出せます。
設定手順
- 「天気」を配置ツールボックスから「天気(Weather)」を領域へドラッグ。
- 地点を設定都市名、または緯度・経度で場所を指定(例:大阪/東京)。
- 単位・表示を選ぶ温度の単位(℃)、表示デザイン(テンプレート)を選ぶ。
- 更新間隔・表示時間更新のタイミングと、画面に映す秒数を設定 → 公開。
- 地点(都市名 または 緯度経度)
- 単位(摂氏℃ 推奨)
- 表示テンプレート(デザイン)
- 表示時間(秒)
ニュース(RSS) 標準アプリ
ニュースサイトの見出しを、横や縦に流れる形(ティッカー)で表示します。
設定手順
- 「RSSティッカー」を配置ツールボックスから「RSS」または「ティッカー」を領域へドラッグ。
- RSSのURLを入力表示したいニュースサイトの「RSS」のアドレスを貼り付け。
- 件数・速度を決める表示する見出しの件数、1件あたりの表示時間や流れる速さ。
- 見た目を整える文字の大きさ・色などを設定 → 公開。
- RSSのURL(ニュースサイトの「RSS」リンクから取得)
- 表示件数
- 1件あたりの表示時間/流れる速度
- 文字サイズ・色
https://…/rss 等)を公開しています。それをコピーして貼り付けます。Instagram ウェブページ表示
Instagramの投稿を店頭に表示します。専用アプリがないため「ウェブページ」機能で埋め込み表示します。
設定手順
- 埋め込み用のURLを用意自社アカウントの埋め込み、または外部のSNS表示サービスで作った表示ページのURL。
- 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
- URLを入力用意した埋め込み用URLを貼り付け。
- 表示方法を選ぶ表示方法は 「Open Natively(そのまま表示)」を選ぶ → 公開。
- Instagram埋め込み用のURL
- 表示方法:Open Natively
- 表示時間(秒)
YouTube ウェブページ表示
YouTubeの動画を画面で流します。専用アプリはないため「ウェブページ」で埋め込みURLを表示します。自社にアップした動画ファイルは「画像・動画」を使います。
設定手順
- 埋め込みURLを取得対象動画の「共有 → 埋め込む」から埋め込み用URL(
https://www.youtube.com/embed/動画ID)を取得。 - 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
- URLを入力埋め込みURLを貼り付け。自動再生にするには末尾に
?autoplay=1&mute=1を付ける。 - 表示方法を選ぶ「Open Natively」を選ぶ → 公開。
- YouTube埋め込みURL(+自動再生パラメータ)
- 表示方法:Open Natively
- 表示時間(動画の長さに合わせる)
mute=1)が前提です。音を出したい場合は「画像・動画」で動画ファイルを流す方が確実です。Facebook ウェブページ表示
Facebookページの投稿を店頭に表示します。Instagramと同じく「ウェブページ」で埋め込み表示します。
設定手順
- ページの埋め込みURLを用意Facebookページ プラグイン等で作成した埋め込み用URL。
- 「ウェブページ」を配置 → URLを入力用意したURLを貼り付け。
- 「Open Natively」で表示 → 公開表示方法はOpen Nativelyを選ぶ。
- Facebook埋め込み用URL
- 表示方法:Open Natively
- 表示時間(秒)
カレンダー 標準アプリ
予定・イベント・営業案内などを一覧表示します。Googleカレンダー等と連動できます。
設定手順
- iCal(ics)のURLを用意Googleカレンダー → 設定 → 対象カレンダー →「カレンダーの統合」→「iCal形式の公開URL(.ics)」をコピー。
- 「カレンダー」を配置ツールボックスから「カレンダー」を領域へドラッグ。
- URLと表示期間を設定iCalのURLを入力。表示する期間(今日/今週など)と件数を指定。
- 見た目・表示時間を設定 → 公開表示形式・1件あたりの表示時間を設定。
- iCal(ics)のURL
- 表示期間(範囲)・表示件数
- 表示形式・タイムゾーン
- 表示時間(秒)
SNSウォール ウェブページ表示
複数のSNS投稿をまとめて「壁」のように表示し、店頭をにぎやかに演出します。外部のソーシャルウォールサービスを「ウェブページ」で埋め込みます。
設定手順
- ソーシャルウォールを作る外部サービスで表示したいSNS・ハッシュタグを設定し、表示用(埋め込み用)URLを取得。
- 「ウェブページ」を配置 → URLを入力取得したURLを貼り付け。
- 「Open Natively」で表示 → 公開
- ソーシャルウォールの表示用URL
- 表示方法:Open Natively
- 表示時間(秒)
画像・動画 標準アプリ
ポスター画像やPR動画を表示します。いちばん基本の使い方です。
設定手順
- 素材をアップロードライブラリ → メディア →「メディアを追加」で画像・動画をアップ。
- レイアウトに配置編集画面でその素材を領域へドラッグ(アップした素材はライブラリから選べます)。
- 表示時間・見せ方を設定画像は表示秒数、動画は「0」で全再生(尺より短い枠は「ループ」ON)。拡大方法(フィット/ストレッチ)も選べます。
- 公開
- 画像:jpg / png / webp など(アニメーションGIFは非対応 → 動画に)
- 動画:MP4(H.264)推奨
- 音声・PDF・PowerPointも利用可
Webページ 標準アプリ
予約ページ・自社サイト・キャンペーンページなどを、そのまま画面に表示します。更新すれば画面も自動反映。SNS・口コミ・交通情報の土台にもなる重要なアプリです。
設定手順
- 「ウェブページ」を配置ツールボックスから「ウェブページ」を領域へドラッグ。
- URLを入力表示したいページのアドレスを貼り付け。
- 表示方法を選ぶOpen Natively(そのまま表示・推奨)/Manual Position(位置指定)/Best Fit(枠に合わせる)から選ぶ。
- 更新間隔・表示時間を設定 → 公開
- Open Natively:ページをそのまま表示。多くのサイトで確実に映る(推奨)。
- Manual/Best Fit:枠内に収めて表示。ただし埋め込みを拒否するサイトでは映りません。
X-Frame-Options という設定で「枠内埋め込み」を拒否します。うまく映らないときは Open Natively に。Webページの表示にはネット接続が必要です(キャッシュされません)。口コミ ウェブページ表示
Googleの口コミや評価を店頭に表示し、来店客に安心感・信頼感を与えます。「ウェブページ」で口コミ表示用のURLを出します。
設定手順
- 口コミ表示用のURLを用意Googleの口コミ表示ウィジェット等で作成した表示用URL。
- 「ウェブページ」を配置 → URLを入力
- 「Open Natively」で表示 → 公開
- 口コミ表示用URL
- 表示方法:Open Natively
- 表示時間(秒)
交通情報 ウェブページ/RSS
最寄りの運行情報・道路情報などを表示し、来店客の利便性を高めます。「ウェブページ」または「RSS」で出します。
設定手順
- 表示元を決める交通情報のページ(URL)、またはRSSのアドレス。
- アプリを配置ページ表示なら「ウェブページ」、見出しを流すなら「RSSティッカー」。
- URLを入力 → 表示方法/件数を設定 → 公開ウェブページはOpen Natively。RSSは件数・速度を設定。
- 交通情報ページのURL(ウェブページの場合)/RSSのURL(RSSの場合)
- 表示方法・件数・表示時間
数値・ダッシュ 標準アプリ
価格表・メニュー・売上・来店数などの数値やグラフを表示します。データだけ更新すれば、画面も自動で変わります(レイアウトは触らなくてOK)。
設定手順(データセット方式)
- データセットを作るライブラリ → データセット →「追加」。表の列(例:項目名・金額)を定義。列の設計は初回のみ。管理者に相談できます。
- データを入力/更新作った表に価格やメニューなどの値を入力(以降はここを更新するだけ)。
- 「データセット」を配置編集画面で「データセット」を領域へドラッグし、作った表を選ぶ。
- 表示形式・列を選ぶ「表(Table)」か「ティッカー」を選び、表示する列・並び順を指定 → 公開。
- 使用するデータセット(表)
- 表示形式:表 / ティッカー
- 表示する列・並び順・表示時間
4つの出し方
同じアプリでも、見せ方を選べます。レイアウトの領域の切り方と、スケジュールの組み方で決まります。
| 出し方 | やること |
|---|---|
| 全画面 | 領域を1つにして、1つのアプリ/画像を画面いっぱいに。 |
| 画面分割で同時 | 領域を複数に区切り、動画+ニュース+天気などを同時に表示。分割テンプレートを使うと簡単。 |
| 時間帯で自動切替 | 朝・昼・夜などの時間帯(デイパート)を作り、スケジュールで選ぶと自動で切り替わる。 |
| 順番にローテーション | 複数のレイアウトをキャンペーンにまとめ、順番に繰り返し表示。 |
タブレットでタッチ予約
普段はサイネージを流しつつ、画面をタッチすると予約ページに切り替わる使い方です。「タブレットにタッチして予約したい」という要望は、この方法で実現します。1台でサイネージと予約を兼ねられます。
設定手順
- 端末のタッチを有効化ディスプレイ → 対象端末を編集 → 詳細(Advanced)タブ → 「タッチ機能を有効化」をON。
- 予約レイアウトを作る新規レイアウト →「ウェブページ」で予約ページのURLを入力 → 表示方法は必ず「Open Natively」。このレイアウトに「コード識別子(Code Identifier)」(例:
reserve)を付ける=移動先の目印。 - サイネージ側にタッチアクションを設定サイネージレイアウトでインタラクティブモードをON → アクション「レイアウトへ移動」→ 予約レイアウトのコード識別子 → タップさせたい要素(ボタン画像など)を選ぶ → 保存。
- 戻る導線を用意予約レイアウトにも「レイアウトへ移動(サイネージ側のコード識別子)」または「前のレイアウト」のトリガーを設定。自動で戻る機能はないので、戻るボタンは必ず作ります。
- 公開してスケジュール両レイアウトを公開し、対象タブレットにスケジュール。実機でタップ→予約→戻る、を確認して完成。
X-Frame-Optionsのあるサイトは埋め込み不可)。Androidの画面下のバーはAndroid側のもので、Xiboからは消せません(Xibo自身のメニューは「隠す」に設定可)。タッチ予約はタブレットのみ(モニター/スティック型端末はタッチ非対応で表示専用)。アプリ別 困ったとき
| 症状 | まず確認 |
|---|---|
| 変更が反映されない | ①「公開」したか ② 端末は数分ごとに受信(少し待つ)③ スケジュールで端末に割り当てたか |
| 天気が出ない | 地点の設定を確認。表示されない場合は接続キー未設定の可能性 → 管理者へ |
| ニュース/交通が出ない | RSSのURLが正しいか(ブラウザで開けるか)。ネット接続も確認 |
| Instagram/FB/YouTube/口コミが出ない | 表示方法が「Open Natively」か確認。埋め込みURLが正しいか。ネット必須 |
| Webページが真っ白/黒 | 埋め込み拒否(X-Frame-Options)→「Open Natively」に。ネット接続も確認 |
| カレンダーが空 | iCalのURLがログイン不要で開けるか。表示期間の設定を確認 |
| 動画が動かない/GIFが静止 | 動画はMP4推奨。アニメGIFは非対応(動画に変換) |
| タッチで予約に切り替わらない | 「タッチ機能を有効化」ON・インタラクティブアクション保存・移動先のコード識別子・トリガー要素を確認 |
お問い合わせ
埋め込みURLの用意、外部サービスの選定、データセットの列設計など、迷ったところは管理者(サービス提供元)がお手伝いします。
| 用意してもらえるもの | SNS/口コミ/YouTube等の埋め込みURL、天気・データ連携の初期設定、テンプレート |
|---|---|
| お問い合わせ | 株式会社ローデン(Roden Signage)/ info02@roden.co.jp |