Web の非ビジュアルエディターの使用 web-non-visual-editor

このページ: ブラウザー拡張機能をインストールしたり、web デザイナーを読み込んだりすることなく、Adobe Journey Optimizerの非ビジュアルエディターを使用して、CSS セレクターとページヘッドの変更をweb ページに追加する方法を説明します。

Journey Optimizer のビジュアル web designer に加えて、非ビジュアルエディター​を使用して、web ページに変更を追加することもできます。

これは、web designer でのページの読み込みに必要な Adobe Experience Cloud Visual Helper などのブラウザー拡張機能をインストールできない(許可されていない)場合に役立ちます。

また、場合によっては、web ページ上の他の要素を変更したり、ページ構造を変更したりすることなく、非ビジュアルエディターを使用して、特定の CSS セレクターに変更を適用する方が簡単な場合もあります。

非ビジュアルエディターを使用して web エクスペリエンスを作成するには、次の手順に従います。

  1. ジャーニーまたはキャンペーンの​ コンテンツを編集 ​画面で、「ビジュアルエディター」オプションの選択を解除します。

  2. 変更を追加」をクリックして、web コンテンツの編集を開始します。

  3. 非ビジュアルエディターが表示されます。 左側のパネルを使用して、最初の変更を追加できます。

  4. ドロップダウンリストで、変更タイプを選択します。

    2 つのタイプを使用できます。 様々なオプションが付属しています。 詳しくは、以下のリンクを参照してください。

  5. パーソナライゼーションを追加」ボタンをクリックします。 パーソナライゼーションエディターが開きます。

    Journey Optimizer パーソナライゼーションエディターのすべてのパーソナライズ機能およびオーサリング機能を活用できます。 詳細情報

  6. コンテンツを入力し、変更内容を​ 保存 ​します。

  7. 最初の変更が​ 変更 ​ペインの上部に表示されます。

    変更の横にある「その他のアクション」ボタンをクリックし、「情報」を選択して、詳細を表示します。 必要に応じて、変更を削除​することもできます。

    {width="50%"}

    note
    NOTE
    変更​ペインは、web designer を使用する場合と同じです。 これを使用して実行できるすべてのアクションについて詳しくは、この節を参照してください。
  8. 変更​ペインの上部にある「追加」ボタンをクリックして、別の変更を追加し、上記の手順を繰り返します。

  9. さらに、web サイトの任意の要素を選択し、その要素に対するクリック数を追跡できます。 クリックの追跡を有効にし、追跡するアクションを定義するには、以下に示すように、左側のパネルの 2 番目のアイコンをクリックします。

    {width="50%"}

    コンポーネントを追加」ボタンを使用して、追跡する新しいアクションを選択します。 クリックの追跡の使用方法について詳しくは、この節を参照してください。

  10. 画面左上の矢印をクリックして、ジャーニーまたはキャンペーンの編集画面に戻ります。 現在の変更数を確認し、さらに変更を追加できます。

    必要に応じて、web designer に切り替えることもできます。 すべての変更が保持されます。

AI Knowledge Reference

This section contains structured knowledge intended to support interpretation, retrieval, and question answering related to this topic.

For complete understanding, this information should be combined with the documentation on this page. Neither source is intended to stand alone; the page describes the feature, while this section provides additional context that helps disambiguate terminology, intent, applicability, and constraints.

  • TL;DR: This page explains how to add CSS selector and page head modifications to web pages using the Journey Optimizer non-visual editor, without installing a browser extension or loading the web designer.

Intents:

  • Edit web content without installing a browser extension or loading the web designer
  • Switch off the Visual editor option to open the non-visual editor
  • Add a CSS Selector or Page head modification
  • Apply personalization to a modification through the personalization editor
  • Enable click tracking on a selected element
  • Switch back to the web designer while preserving modifications

Glossary:

  • Non-visual editor: An editor that adds CSS selector and page head modifications to web pages without installing a browser extension or loading the web designer (product-specific)
  • CSS Selector: A modification type that applies changes on a particular CSS selector (product-specific)
  • Page <head>: A modification type that applies changes to the page head (product-specific)
  • Modifications pane: The pane listing added modifications, the same one used in the web designer (product-specific)
  • Click tracking: Selecting any element of the website to track the clicks on it, enabled from the left rail (product-specific)

Guardrails:

  • To open the non-visual editor, unselect the Visual editor option on the Edit content screen in the journey or campaign.
  • Two modification types are available: CSS Selector and Page head.
  • The non-visual editor can be used when you cannot, or are not allowed to, install browser extensions such as the Adobe Experience Cloud Visual Helper required to load pages in the web designer.
  • Switching to the web designer preserves all your modifications.

Terminology:

  • Canonical name: non-visual editor — Acronym: n/a — variants: web non-visual editor
  • Synonyms: “web designer” = “visual editor”
  • Do not confuse: “non-visual editor” (no browser extension or web designer required) ≠ “web designer” (visual editor requiring the browser extension)
  • Do not confuse: “CSS Selector” (modification on a CSS selector) ≠ “Page head” (modification to the page head)

FAQ:

  • Q: How do I open the non-visual editor? — From the Edit content screen in the journey or campaign, unselect the Visual editor option, then click Add a modification.
  • Q: What modification types can I add? — CSS Selector and Page head.
  • Q: Do I need a browser extension to use the non-visual editor? — No, it lets you edit content without installing a browser extension or loading the web designer.
  • Q: Can I track clicks on an element? — Yes, select any element of your website and enable click tracking from the second icon on the left rail, using Add Component to select an action to track.
  • Q: Will my modifications be kept if I switch to the web designer? — Yes, all your modifications will be preserved.
recommendation-more-help
journey-optimizer-help