カード設定詳細

カード設定では、Web接客で表示するカードの詳細な設定を行うことができます。

カード設定とは

カード設定とは、Web接客で訪問者に表示するカードの詳細な設定を行うページです。カードの表示方法、画像、テキスト、ボタンなどの要素を設定し、訪問者に効果的なメッセージを伝えることができます。

カード設定でできること

機能	説明
表示設定	カードの種別と表示位置を設定できます
画像設定	カードに表示する画像をアップロードできます
コンテンツ設定	カードのタイトルと説明文を設定できます
ボタン設定	カードに表示するボタンの色、テキスト、リンク先またはimmedio Box埋め込みを設定できます
管理設定	カードの管理用タイトルを設定できます
プレビュー機能	設定内容をリアルタイムで確認できます

デモ動画を見る：https://app.storylane.io/share/mrfcbtfef4cv

カード設定の表示イメージ

表示設定

管理タイトル

カードを識別するための管理用タイトルを設定します。この項目は必須です。

種別

カードの表示方式を選択します：

• ポップアップ: 画面の指定位置にポップアップとして表示されます

• モーダル: モーダル形式で画面中央に表示されます

表示位置

選択した種別に応じて、カードの表示位置を設定します：

ポップアップの場合

• 左: 画面左側に表示

• 右: 画面右側に表示

モーダルの場合

• 中央: 画面中央に表示

画像設定

画像を有効化

カードに画像を表示するかどうかを設定します。有効化すると以下の設定が可能になります：

カード画像

• アップロード: 画像ファイルをアップロードできます

• 対応ファイル: jpg、gif、png、webp

• 最大サイズ: 1MB

• 推奨サイズ: 600px × 300px（比率 2:1）

コンテンツ設定

タイトル

カードに表示するタイトルを設定します：

• 推奨文字数: 15文字

• 文字数上限: 30文字

• 例: 「お問い合わせ」

文章

カードに表示する説明文を設定します：

• 推奨文字数: 18文字

• 文字数上限: 60文字

• 例: 「アンケートについてお答えください。」

ボタン設定

ボタンを有効化

カードにボタンを表示するかどうかを設定します。有効化すると以下の設定が可能になります：

ボタンカラー

ボタンの背景色を設定します。カラーピッカーから色を選択できます。

ボタンテキスト

ボタンに表示するテキストを設定します：

• 文字数上限: 12文字

• 例: 「アンケート」

ボタンタイプ

ボタンをクリックした際の動作を選択します：

• URLを開く: 指定したURLに遷移します

• immedio Box埋め込みを表示: immedio Boxのコンテンツをモーダルで表示します

ボタンのURL（ボタンタイプが「URLを開く」の場合）

ボタンをクリックした際の遷移先URLを設定します：

• 例: 「https://www.immedio.io/」

埋め込みタグ（ボタンタイプが「immedio Box埋め込みを表示」の場合）

immedio Boxから取得した埋め込みタグを貼り付けます。ボタンをクリックすると、immedio Boxのコンテンツがモーダル形式で表示されます。

埋め込みタグの例：

<script type="module"
  src="https://storage.googleapis.com/immedio-box-prod-web-components/immedio-content-viewer.js"
  data-target="#viewer"
  data-content-url="https://box.immedio.io/p/test/xxxxx?ownerEmail=example%40immedio.io"
></script>

immedio Boxの埋め込みタグは、immedio Boxの管理画面から取得できます。

保存機能

設定内容を保存するには：

1. 必要な項目をすべて入力します

2. 「保存する」ボタンをクリックします

3. 「カード設定を更新しました」というメッセージが表示されます

保存の条件

以下の条件を満たす場合のみ保存が可能です：

• 必須項目（管理タイトル、種別、表示位置）が入力されている

• 入力内容に変更がある

• 入力値が有効である

プレビュー機能

設定内容は画面下側のプレビューエリアで確認できます。プレビューでは、カードが実際にどのように表示されるかを事前に確認できます。

プレビューの使い方

1. カード設定を編集します

2. 「保存する」ボタンをクリックして設定を保存します

3. 「プレビュー更新」ボタンをクリックします

4. プレビューエリアに最新の設定が反映されます

重要な注意事項

• プレビューには保存済みの設定のみ反映されます。設定を変更した場合は、「保存する」ボタンをクリックしてから「プレビュー更新」をクリックしてご確認ください

• プレビュー内のボタンは操作できません（リンク先への遷移やimmedio Box埋め込みの表示は無効化されています）

• プレビューエリアは横幅をドラッグして調整できます。画面幅が小さい場合のプレビュー確認にも活用できます

権限について

カード設定の編集には「カード設定管理」権限が必要です。権限がない場合は、設定項目が読み取り専用で表示されます。

注意事項

• 画像ファイルは1MB以下のサイズでアップロードしてください

• ボタンのURLは有効なURLを入力してください

• 設定変更後は必ず「保存する」ボタンをクリックして保存してください

• 必須項目以外を入力しなかった場合は何も表示項目がないカードが表示されるので気をつけてください

• 画像、タイトル、文章、ボタンなどの任意項目を設定しない場合、空のカードが表示される可能性があります