Visual Experience Composer（VEC）

の使用に関する情報 Visual Experience Composer (VEC) Adobe Target.

VEC は、サイトコンテキストのパーソナライズされたエクスペリエンスおよびオファーを簡単に作成およびテストできる、WYSIWYG ユーザーインターフェイスです。 Web ページ（またはオファー）またはモバイル Web ページのレイアウトおよびコンテンツをドラッグ＆ドロップ、入れ替えおよび変更することで、Target アクティビティのエクスペリエンスおよびオファーを作成できます。

VEC は Adobe Target の主要機能の 1 つです。VEC を使用すると、マーケティング担当者やデザイナーが視覚的なインターフェイスを使用してコンテンツを作成および変更できます。コードを直接編集することなく、多くのデザインの選択肢を作成できます。コンポーザーで利用可能な編集オプションを使用すれば、HTML および JavaScript の編集も可能です。

ターゲット上管理 > Visual Experience Composer 」タブに入力すると、デフォルトの Visual Experience Composer URL を入力できます。

デフォルトの VEC URL 設定

この URL は、VEC を開いたときに、どこから開始するかを決定します。デフォルトを入力しないと、エディターを開いたときに空白ページが表示され、そこで URL を指定することになります。

メモ

Firefox のような特定のブラウザーでは、ページに混合コンテンツ（セキュアサイト上の非セキュアなページなど）が含まれていると、VEC でページの表示ができない場合があります。ページが表示されない場合は、ブラウザーのアドレスバーで URL の横にあるアイコンをクリックして、「このページの保護を無効にする」をクリックします。この問題は、サイト訪問者へのページ表示に影響しません。

ページ上の iframe 内のコンテンツは、VEC では変更できません。iframe 内のコンテンツを編集するには、iframe ドキュメントで Target が有効になっていることを確認して、VEC でその iframe URL を読み込みます。

ページ上部にあるドロップダウンメニューを使用して、異なるオーディエンスに表示されるページ、または異なるエクスペリエンスで表示されるページを確認できます。2 つ目のドロップダウンリストでは、各エクスペリエンスの名前を指定できます。例えば、ナビゲーションバーのホームリンクの場所をテストする場合は、ホームリンクが最初に表示されるエクスペリエンスに「ホームリンク」のような名前を付けて、リスト内でエクスペリエンスを識別しやすくすることができます。

メモ

ページの構造に加える変更が、そのページ上で作成されるアクティビティによって使用される場所に影響する場合は、エクスペリエンスの編集に問題が生じることがあります。場所の変更が VEC 外でおこなわれていると、Target は、コンテンツが変更された場所を見つけられない場合があります。

マウスポインターがページの周囲を移動すると、カーソルに従って状況依存型のボックスがページ上の要素をハイライトします。

ハイライトされた VEC

ハイライトの表示方法を変更するには、「オーバーレイ」アイコンをクリックします。例えば、画像、リンク、リージョナル mbox、変更、または JavaScript のみをハイライト表示できます。ハイライトの色を変更できます。別々の要素タイプをハイライトする際に使用する、塗りの色とタイプも指定できます。

オーバーレイ設定の変更

ハイライトされた要素をクリックして、その要素タイプで使用できるオプションのメニューを表示します。例えば、画像をクリックして「編集」／「テキスト/HTML」を選択し、テキストを変更したり、ボタンをクリックして背景色を変更したりすることができます。ページ左上のボタンを使用すると、オーバーレイのオンとオフが切り替えられます。

また、「参照」をクリックし、プライマリページから使用できる買い物ページや買い物かごなどのページに移動して、そのページの変更をテストすることもできます。さらに、フライアウトメニューやミニカートなど、マウスポインターを置いたときに使用できるページ要素にアクセスすることもできます。ページの参照が終了したら、「構成」をクリックしてエクスペリエンスを編集します。例えば、買い物かごのドロップダウンや画像のカルーセルのデザインを変更したい場合があります。

メモ

ホバーの状態が JavaScript に依存する場合は、「JavaScript を無効にする」が選択されていないことを確認します。JavaScript の要素を編集するには JavaScript が有効になっている必要があります。

VEC で利用可能なオプションについて詳しくは、Visual Experience Composer オプションを参照してください。

ページの読み込み中（またはページの読み込みに失敗した後）に、ページでいくつかの変更を実行したり、VEC でページの読み込みをキャンセルしたりできます。詳しくは、次を参照してください。

ページの読み込み中またはページの読み込みに失敗した後のページの編集
VEC 内でのページ読み込みのキャンセル

ページの読み込み中またはページの読み込みに失敗した後のページの編集

VEC でページが読み込まれる前や、ページを読み込めなかった場合（例えば、カスタムコードが動作しなくなった場合など）には、様々なアクションを実行できます。

VEC 内でページの読み込み中またはページの読み込みに失敗した後に、ページにアクセスしたり、ページを編集したりする理由：

カスタムコードを追加したり、エクスペリエンスの名前を変更したりするなど、ページに簡単な変更を行う
アクセスできなくなったページから既存のカスタムコードをコピーする
VEC 内でページが読み込まれないことはわかっているが、それでも簡単な編集を行いたい

ページの読み込み中（またはページの読み込みに失敗した後）、エクスペリエンスパネル、変更パネル、エクスペリエンス上部の設定（オーバーレイ、変更、設定など）はすべてアクセスできます。

次の図は、ページの読み込み中にカスタムコードを挿入したり、その他のアクションを実行したりできることを示しています。

VEC 内でのページ読み込みのキャンセル

ページの読み込みを待たずに VEC 内でページの読み込みをキャンセルして、アクティビティの編集のロックを解除できます。この機能によって時間を節約し、VEC 内でページの読み込みを待たずに、簡単な編集やカスタムコードの挿入をより効率的に行うことができます。

VEC 内でページの読み込みをキャンセルする理由には、次のようなものがあります。

既存の変更に軽微な編集を行う
1 つ以上の既存の変更を削除する
カスタムコードを挿入または編集する
正しくないページの URL を誤って入力した
VEC でページを読み込む前に JavaScript を有効または無効にする
ページ配信条件にテンプレートテストルールを追加する
EEC または iframe のみを介したページの読み込みがページごとに異なる可能性がある場合、「グローバル拡張 Experience Composer（EEC）」切り替えを上書きする

VECでページの読み込みをキャンセルした後、ページの読み込みを待たずに、アクティビティのエクスペリエンスを切り替えることができます。VEC 内のページを再度表示するには、「リロード」ボタンをクリックする必要があります。

重要

VEC 内での読み込みをキャンセルすることを選択してカスタムコードを作成したり、変更を行ったりする場合は、コーディングまたは変更が正しく行われていることを確認する必要があります。適切な QA を実行して、カスタムコードの作成やその他の修正が期待どおりに行われていることを確認してください。

VEC 内でページの読み込みをキャンセルするには、ページの読み込み中に「読み込みのキャンセル」ボタンをクリックします。現在の編集セッション中、このアクティビティのページは VEC に読み込まれません。