Moments iQ エクスペリエンスの管理 | モーメンツiQ

要件

Moments iQ エクスペリエンスは、Tealium iQ プロファイルでのみ作成できます。プロファイルライブラリでは作成できません。
アカウントで Tag Marketplace Policy が有効になっている場合は、Moments iQ Experience タグを Show リストに追加する必要があります。そうしないと、タグは Tag Marketplace に表示されません。

動作方法

Moments iQ エクスペリエンスを作成するには、Tag Marketplace に移動し、Moments iQ を検索して + Add をクリックします。詳細については、タグについてを参照してください。

構成

プロパティ

以下の構成を構成します：

Moments iQ Experience タグの タイトル を入力します。同じタグの複数のインスタンスがある場合は、他のインスタンスと区別するために説明的なタイトルを使用してください。
タグに関する任意の ノート を入力します。

エクスペリエンスの種類と配置

以下の構成を構成します：

コードバージョン: 使用する Moments iQ エクスペリエンス生成コードのバージョンを選択します。コードバージョンを変更する場合は、テンプレートも更新する必要があります。現在利用可能なのはバージョン1のみです。
エクスペリエンスタイプ: 作成するエクスペリエンスのタイプ。
- モーダル: エクスペリエンスはポップアップウィンドウとして表示されます。
- 埋め込み: エクスペリエンスはページに埋め込まれて表示されます。
エクスペリエンス配置: モーダルウィンドウの位置。これは モーダル 配置オプションでのみ使用されます。
モーダル背景の不透明度: ページの残りの部分に適用する不透明度の強さを選択します。これによりコンテンツがより際立ちます。
配置セレクタ: エクスペリエンスを配置するページ要素を識別する CSS セレクタを入力します。これは 埋め込み 配置オプションでのみ使用されます。要素のセレクタを決定する方法についての詳細は、要素の CSS セレクタを決定する方法を参照してください。
エクスペリエンス位置: 配置セレクタ の要素に対して挿入された要素の位置。
- 開始前: ページ要素の前。
- 開始後: ページ要素内、最初の子の前。
- 終了前: ページ要素内、最後の子の後。
- 終了後: ページ要素の後。
- 置換: ページ要素を置換。
Z-index: ページ上でのエクスペリエンスのzオーダー位置を上書きする値。高い値は低い値の上に積み重なります（例: “1”, “2”, “-1”, “auto”）。

エクスペリエンスの追跡

エクスペリエンスの動作を制御するために、以下の構成を構成します：

エクスペリエンスの抑制: 条件に応じて、エクスペリエンスはリターン訪問に対して自動的に抑制されることがあります：
- 決してない
- 閉じるボタンが選択された後
- 回答が送信された後
- 回答が送信された後または閉じるボタンが選択された後
  ブラウザはこの情報を momentsiq_suppress キーとしてローカル保存に保存します。
ロードの追跡: ページ上でエクスペリエンスが初めてロードされたときに追跡コールを送信するには True を選択します。
Tealium トラックタイプ: モーダルの閉じると送信アクションを追跡する際にトリガーされる utag.track コールで使用されるイベントのタイプ。
- ビュー
- リンク

フォーム

ヘッダー

以下の構成でエクスペリエンスに表示されるテキストを構成します：

ヘッダーテキスト: エクスペリエンスの上部に表示されるテキスト。
メインテキスト: ヘッダーテキストの下に表示されるテキスト。
質問テキスト: 訪問に尋ねる質問。

回答

Moments iQ は複数の質問形式を提供し、訪問をサイトの適切なエクスペリエンスに導く質問をカスタマイズすることができます。

質問と回答を以下の構成で構成します：

回答タイプ: 回答の入力タイプ。
- ラジオ: 訪問は表示されたリストから単一の回答のみを選択できます。
- テキスト: 訪問は単行フィールドに回答を入力できます。
- チェックボックス: 訪問はラベル付きの1つ以上のチェックボックスを選択できます。
- ボタン: 訪問は表示された2つの回答のうちの1つをボタンとして選択できます。
回答: 質問への回答：
- ラジオ: ラジオボタンの横に表示する回答のパイプ (|) 区切りリスト。パイプ文字は区切り文字であるため、ボタンラベルにパイプ文字を使用することはできません。例：Red|Green|Blue|Teal
- テキスト: テキストボックスのプレースホルダーテキスト。
  例：["好きな色は何ですか？"]
- チェックボックス: 各チェックボックスの横に表示する回答のパイプ (|) 区切りリスト。パイプ文字は区切り文字であるため、ボタンラベルにパイプ文字を使用することはできません。例：Red|Green|Blue|Teal
- ボタン: 主要および副ボタンのテキストを上書きする回答のパイプ (|) 区切りリスト。Moments iQ は最初の2つの値のみを使用します。パイプ文字は区切り文字であるため、ボタンラベルにパイプ文字を使用することはできません。例：Red|Green
リダイレクト URL: 特定の回答が選択され、主要ボタンがクリックされたときに訪問をリダイレクトする URL。URLをリダイレクトしたくない場合は、このフィールドを空白のままにします。たとえば、これは特別オファーを提供する感謝のページや、フォローアップの質問を尋ねる別のエクスペリエンスを含むページにリダイレクトすることができます。
リダイレクトが新しいタブを開く: 訪問がリダイレクトされるときに新しいタブを開くかどうかを選択します。このオプションは、リダイレクト URL に値を入力した場合にのみ利用可能です。
主要ボタンのテキスト: 主要ボタンのテキストラベル。デフォルト値は Submit です。

動的テキスト

ヘッダーテキスト、メインテキスト、質問テキスト、および回答パラメーターに動的テキストを作成するために変数を使用することができます。変数は2つのカーリーブレースの間に表示されます。例えば、{{VARIABLENAME}}。

変数は次のデータを使用できます：

utag.data (例：{{utag.data.customer_name}})
Bオブジェクト (例：{{b.customer_alias}})
AudienceStream属性、Bオブジェクトを通じて (例：{{b.variable_name}})

データが利用できない場合に表示されるフォールバック値を構成することができます。フォールバック値はパイプ文字のペアの後に表示されます (例：{{VARIABLENAME || FALLBACK}})。

スタイル

サイトの外観に合わせてエクスペリエンスを構成します。エクスペリエンスの各要素に対してスタイル構成を入力または選択します：

二次ボタンの構成は、回答タイプが Button に構成されている場合にのみ使用されます。

パラメータ	説明	例
フォントファミリー	テキストのフォントファミリー。	`Arial`
フォントサイズ	テキストのフォントサイズ、`px`または`em`での測定。	`14px`
フォントスタイル	テキストのフォントスタイル。	`normal`
フォントウェイト	テキストのフォントウェイト。	`normal`
テキストカラー	テキストの色、16進コードまたは標準色名で。	`#1B1B1B`

パラメータ	説明	例
主要ボタンの背景色	主要ボタンの背景色。デフォルト値は `#1B1B1B`。	`#1B1B1B`
二次ボタンの背景色	二次ボタンの背景色、16進コードまたは標準色名で。デフォルト値は `#1B1B1B`。	`#1B1B1B`

経験の背景画像

以下の手順に従って、経験に背景画像を追加します：

画像配置の下で、画像がモーダルの左半分または右半分を背景で埋めるかを選択します。
画像位置の下で、画像が経験ウィンドウの左または右に合わせるかを選択します。
画像URLの下で、https-securedで外部ホストされた画像へのリンクを入力します。推奨画像サイズ：500px x 400px。ファイルは.png、.jpg、.gif、または.svgのファイル拡張子を持っている必要があります。

コンテナスタイル

外部コンテナ

パラメータ	説明	例
外部コンテナの背景色	経験の背景色としての16進コードまたは標準色名。デフォルト値は `#FCFCFC` です。	`#1B1B1B`
外部コンテナのマージン	最も外側のコンテナのマージンサイズ。デフォルト値は `0` です。マージン構成の詳細については、MDN Web Docs: marginを参照してください。	`1px`
外部コンテナのボーダースタイル	経験の最も外側のコンテナのボーダースタイル。デフォルト値は `none` です。	`none`
外部コンテナのボーダーカラー	経験の最も外側のコンテナの周りのボーダーの色としての16進コードまたは標準色名。ボーダースタイルを `none` 以外の値に構成する必要があります。半径は `8px` です。	Black
外部コンテナの幅	最も外側のコンテナの幅。デフォルト値は `500px` です。	`500px`

質問コンテナ

パラメータ	説明	例
質問コンテナのマージン	質問のコンテナのマージンサイズ。デフォルト値は `0` です。	`0`
質問コンテナのテキストアライン	コンテナ内の質問テキストのアラインメント方向。デフォルト値は `start` です。	`start`

回答コンテナ

パラメータ	説明	例
回答コンテナのマージン	質問のコンテナのマージンサイズ。デフォルト値は `0` です。	`0`
回答コンテナのテキストアライン	コンテナ内の回答テキストのアラインメント方向。デフォルト値は `start` です。	`start`
回答コンテナのフレックス方向	回答のアラインメント方向、縦方向の列または横方向の行として。デフォルト値は `column` です。	`column`
回答コンテナのアラインアイテムズ	コンテナ内の回答のアラインメント方向（例：`start`、`flex-start`、または `self-start`）。デフォルト値は `flex-start` です。	`flex-start`

ルールとイベント

すべてのページで経験をロードするか、経験が表示される条件を構成します。ロードルールとイベントの詳細については、Load Rules および Events を参照してください。

データの衝突を避けるため、一度に1つのMoments iQ経験のみがページに表示されるようにしてください。複数の経験がある場合は、ロードルールを構成して、一度に1つの経験のみがロードされるようにします。

データマッピング

拡張機能を使用して、構成で動的な値を取得するための以下のマッピングを使用するか、経験から経験へのスタイリングを一貫して保ちます：

基本パラメータ

変数	タイプ	説明
`type`	String	経験のタイプ
`placement`	String	経験の配置
`selector`	String	配置セレクタ
`position`	String	経験の位置
`imagePosition`	String	画像の位置
`imageUrl`	String	画像URL
`altText`	String	画像の代替テキスト
`redirect_url`	String	リダイレクトURL
`redirect_open_tab`	String	タブでリダイレクトを開く
`zindex`	String	Z-index
`headerText`	String	ヘッダーテキスト
`mainText`	String	メインテキスト
`questionText`	String	質問テキスト
`answerType`	String	回答タイプ
`answers`	Array	回答
`primaryText`	String	プライマリボタンのテキスト
`trackType`	String	Tealiumトラックタイプ
`trackOnLoad`	String	ロード時のトラック

テキストフォーマットパラメータ

変数	タイプ	説明
`headerTitle.color`	String	ヘッダーテキストの色
`headerTitle.fontFamily`	String	ヘッダーテキストのフォントファミリー
`headerTitle.fontSize`	String	ヘッダーテキストのフォントサイズ
`headerTitle.fontStyle`	String	ヘッダーテキストのフォントスタイル
`headerTitle.fontWeight`	String	ヘッダーフォントの重さ
`mainBodyText.color`	String	メインテキストの色
`mainBodyText.fontFamily`	String	メインテキストのフォントファミリー
`mainBodyText.fontSize`	String	メインテキストのフォントサイズ
`mainBodyText.fontStyle`	String	メインテキストのフォントスタイル
`mainBodyText.fontWeight`	String	メインテキストのフォントの重さ
`questionContainer.color`	String	質問テキストの色
`questionContainer.fontFamily`	String	質問テキストのフォントファミリー
`questionContainer.fontSize`	String	質問テキストのフォントサイズ
`questionContainer.fontStyle`	String	質問テキストのフォントスタイル
`questionContainer.fontWeight`	String	質問フォントの重さ
`answerContainer.color`	String	回答テキストの色
`answerContainer.fontFamily`	String	回答テキストのフォントファミリー
`answerContainer.fontSize`	String	回答テキストのフォントサイズ
`answerContainer.fontStyle`	String	回答テキストのフォントスタイル
`answerContainer.fontWeight`	String	回答フォントの重さ
`primaryButton.color`	String	プライマリボタンのテキストの色
`primaryButton.fontFamily`	String	プライマリボタンのフォントファミリー
`primaryButton.fontSize`	String	プライマリボタンのテキストのフォントサイズ
`primaryButton.fontStyle`	String	プライマリボタンのフォントスタイル
`primaryButton.fontWeight`	String	プライマリボタンのフォントの重さ
`secondaryButton.color`	String	セカンダリボタンのテキストの色
`secondaryButton.fontFamily`	String	セカンダリボタンのフォントファミリー
`secondaryButton.fontSize`	String	セカンダリボタンのテキストのフォントサイズ
`secondaryButton.fontStyle`	String	セカンダリボタンのフォントスタイル
`secondaryButton.fontWeight`	String	セカンダリボタンのフォントの重さ

コンテナフォーマットパラメータ

変数	説明
`outerContainer.background`	String
`outerContainer.margin`	String
`outerContainer.borderStyle`	String
`outerContainer.borderColor`	String
`outerContainer.borderRadius`	String
`outerContainer.width`	String
`questionContainer.margin`	String
`questionContainer.textAlign`	String
`answerContainer.margin`	String
`answerContainer.textAlign`	String
`primaryButton.background`	String
`primaryButton.borderRadius`	String
`secondaryButton.background`	String
`secondaryButton.borderRadius`	String
`radioContainer.alignItems`	String
`radioContainer.flexDirection`	String
`checkboxContainer.alignItems`	String
`checkboxContainer.flexDirection`	String
`textFieldContainer.alignItems`	String
`textFieldContainer.flexDirection`	String
`textFieldContainer.alignItems`	String

コンテナとテキストオブジェクト

変数	タイプ	説明
`headerTitle`	[Object]	ヘッダーテキスト
`mainBodyText`	[Object]	メインテキスト
`questionContainer`	[Object]	質問
`answerContainer`	[Object]	回答
`primaryButton`	[Object]	プライマリボタン
`secondaryButton`	[Object]	セカンダリボタン
`outerContainer`	[Object]	外部コンテナ
`radioContainer`	[Object]	ラジオ回答コンテナ
`checkboxContainer`	[Object]	チェックボックス回答コンテナ
`textFieldContainer`	[Object]	テキストフィールド回答コンテナ
`footerContainer`	[Object]	フッターコンテナ
`imageNode`	[Object]	画像要素

データレイヤー変数

以下の変数が自動的にデータレイヤーに追加されます：

momentsiq_id, UDO Variable
momentsiq_question1, UDO Variable
momentsiq_question1_type, UDO Variable
momentsiq_questions_answered, UDO Variable
momentsiq_answer1, UDO Variable
momentsiq_suppress, Local Storage Variable

クライアントサイドデータ永続化

Moments iQの体験に対する訪問の反応をクライアントサイドツールのみでパーソナライズしたい場合、訪問の反応をPersist data values拡張クッキーで保存する必要があります。

以下の画像は、そのような拡張の例を示しています：

詳細については、Persist data value extensionを参照してください。

サーバーサイド統合

Moments iQをAudienceStreamやEventStreamなどのサーバーサイド製品と統合する予定がある場合、Tealium Collectタグを通じてデータを収集し、Tealium iQをAudienceStreamプロファイルにリンクする必要があります。

サーバーサイド属性をエンリッチするためには、momentsiq_answer1が回答を含み、momentsiq_idが作成した体験のUIDと一致することを確認するルールを作成します。

例：

また、Moments iQのルールでAudienceStream変数を活用する予定がある場合、データレイヤーのエンリッチされた化を有効にする必要があります。

詳細については、About data layer enrichmentおよびTealium Collect tagを参照してください。

保存して公開

体験をテストしてリリースするには、他のタグと同じワークフローに従ってください。詳細については、About tagsを参照してください。