カスタム埋め込みフィードバック

カスタム埋め込みフィードバックのクリエイティブについて

カスタム埋め込みフィードバックを使用すると、ページの一部として表示されるカスタムコンテンツを作成できます。このカスタムコンテンツは、広告から埋め込みアンケートまで、あらゆるものにできます。

カスタム埋め込みフィードバックは、フィードバックボタンのような受動的なクリエイティブよりも目立つ一方、ウェブサイトの訪問者が何を中断しても圧倒されることもありません。顧客がやり取りの後でフィードバックを迅速に提供するトレーニングを受けている世界では、カスタムフィードバックを直接ページに埋め込むことで、回答者はエクスペリエンス中にフィードバックを提供できます。

埋め込みカスタムフィードバッククリエイティブはコンテンツ管理にも役立ち、特定のタイプのウェブサイトの訪問者に表示するアンケートを選択できます。

カスタムの埋め込みフィードバックの実装

1. カスタム埋め込みフィードバックのクリエイティブを生成します。
   注意：クリエイティブの名前は100文字以下で入力してください。
2. ウェブチームに、カスタムの埋め込みフィードバックを挿入する「コンテナ」をウェブサイトで指定してもらいます。このスペースには、ID 属性を持つ HTML 要素を含める必要があります。引用符の間の HTML ID を識別してコピーします。
   
   多くの場合、ID の HTML タグが適切な場所にすでに存在するため、サイトの変更は必要ありません。
   ヒント：ブラウザーの［要素を確認］機能を使用して、要素の HTML IDを特定します。ほとんどのブラウザでは、検査するページの部分を右クリックし、[Inspect] または [Inspect Element] を選択するだけです。
3. インターセプトを作成します。
4. インターセプトのアクションの［オプション］メニューで、［詳細オプション］を選択します。
   
5. ターゲットコンテナの HTML ID をクリエイティブの挿入ポイントフィールドに貼り付けます。
   
6. ［保存］をクリックします。
7. ウェブサイトのこのページにアクセス者が来ると、クアルトリクスは指定したIDのHTML要素を検索し、そのdivコンテナにクリエイティブを挿入します。

カスタムの埋め込みフィードバックオプション

クリエイティブの［オプション］セクションには、カスタムの埋め込みフィードバッククリエイティブに固有の設定があります。

サイズ調整

デフォルトでは、カスタム埋め込みフィードバッククリエイティブは特定のサイズを持っています。このサイズは、画面の大きさに関係なく、クリエイティブが表示されるサイズです。

クリエイティブをさまざまな画面サイズやタイプに合わせて動的にリサイズするには、挿入コンテナのサイズに合わせてターゲットをリサイズするにチェックを入れます。は、カスタム埋め込みフィードバックの実装時に設定したコンテナのサイズ（縦横）に合わせて、クリエイティブのサイズを自動的に変更します。

挿入コンテナのサイズに合わせてターゲットをリサイズする」が選択されている場合、さらに2つのオプションが選択できる：

• アンケートの高さに合わせてターゲットのサイズを変更します：選択すると、アンケートの高さがすべて表示され、高さはコンテナサイズによって決定されません。
• リサイズ時にターゲットアスペクト比をロックします：選択すると、クリエイティブの元の比率が維持されます。
  Qtip:このオプションを選択すると、クリエイティブのサイズがコンテナに合わせて変更されても、テキスト、画像、ボタンのサイズが変更されなくなります。

カスタムポジショニング

カスタム埋め込みフィードバックが、ウェブサイトに挿入されるターゲットコンテナよりも小さい場合があります。この場合、カスタム位置設定を使用して、ターゲットコンテナに関して HTML が表示される場所を指定することができます。

位置をさらに制御するには、クリエイティブのX位置またはY位置を最初の位置からオフセットするか、［ページに固定］を選択すると、カスタム埋め込みフィードバックがスクロールしながら訪問者に続きます。

ターゲットコンテナーの中身を置き換える

デフォルトでは、カスタム埋め込みフィードバックのクリエイティブがページに挿入されると、ターゲット HTML 要素の既存のコンテンツが置き換えられます。このオプションはターゲットコンテナの内容を置換として選択されています。

ターゲットコンテナーに追加

ターゲットコンテナの内容を置き換える代わりに、ターゲットコンテナに追加を選択して、既存のコンテンツの後にクリエイティブを配置することができます。

ターゲットコンテナーの前に挿入

このオプションを使用すると、ターゲットコンテナの前にカスタム埋め込みフィードバックを挿入できます。

ターゲットコンテナーの後に挿入

このオプションを使用すると、ターゲットコンテナの後にカスタム埋め込みフィードバックを挿入できます。

Z インデックスに関する注記

Z インデックスは、エレメントが重なる場合に Web ページのどのエレメントをトップにするかを指定する CSS プロパティです。デフォルトでは、クリエイティブは、常に最上部に表示されるように、ページの他の要素よりも z インデックスが高くなります。

通常、これが最適ですが、望ましくない場合もあります。たとえば、ドロップダウンメニューはカスタムの埋め込みフィードバックによってカバーされます。

カスタム埋め込みフィードバックの z インデックスを調整するには、以下の手順に従います。

1. クリエイティブを表示する Web ページに移動し、［開発者ツール］または［要素の検査］ツールを開きます。
   
2. “QSI” で始まる div クラスを特定し、引用符の間の値をコピーします。次に、”QSIUserDefinedHTML” と “SI_” で始まる文字列をピリオド (.) で置き換えます。以下の例では、以下をコピーします。

   QSIUserDefinedHTML SI_4PEs8K4EkCbmSdT_UserDefinedHTMLContainer

   スペースをピリオドで置き換えた後、以下を実現しました。

   QSIUserDefinedHTML.SI_4PEs8K4EkCbmSdT_UserDefinedHTMLContainer

   

3. Qualtricsアカウントで、 編集 クリエイティブのセクションを参照してください。
   
4. 任意の要素をダブルクリックして変更するか、新しい空白要素を作成します。
   警告: 埋め込まれたターゲットに Z インデックス CSS エレメントを追加しないことをお奨めします。これは、ページの他の部分が誤ってカバーされる可能性があるためです。ただし、他のエレメントタイプに Z インデックスを追加しても問題ありません。
5. リッチコンテンツエディタの上部にあるソースをクリックして、HTML ビューに入ります。
6. 以下のコード (style タグを含む) をソースに貼り付けます。

   <style type="text/css"> .QSIUserDefinedHTML{z-index:1;} </style>

7. “QSIUserDefinedHTML” をステップ 2 で取得した ID に置き換え、z インデックスの値を Web ページに適したものに置き換えます。

   <style type="text/css"> .QSIUserDefinedHTML.SI_4PEs8K4EkCbmSdT_UserDefinedHTMLContainer{z-index:1;} </style>

   

8. プロジェクトコードが既にウェブサイトのソースコードにある場合は、［公開］ボタンをクリックしてサイトに変更をプッシュします。
9. コードがウェブサイトのソースコードにない場合は、［インターセプトをテスト］を使用してウェブサイトでクリエイティブをテストし、すべてが正しくレイヤーされていることを確認できます。
10. それでも階層化が正しくない場合は、Z インデックス値を大きな数に変更してクリエイティブをページ上に積み上げるか、より小さい (さらに負の数の) 数値に変更してスタックを低くすることを検討してください。

FAQ