[Beta]{class="badge informative" title="This feature is currently in a limited beta release"}

Web experiences

The web channel in Adobe Journey Optimizer B2B Edition empowers you to create personalized experiences directly on your website, helping you connect with customers in meaningful ways. This feature offers a flexible toolkit that you can use to enhance engagement with tailored content and seamlessly integrate it with other channels, such as email and SMS.

Web experiences enable you to:

  • Deliver personalized content modifications to targeted website visitors
  • Customize website elements such as banners, text, images, and buttons based on account attributes
  • Target specific pages or apply changes across multiple pages using URL matching rules
  • Track engagement and monitor the impact of your web personalization efforts
recommendation-more-help

Prerequisites

Before you can create web experiences, ensure that the following requirements are met:

  • A product administrator has configured one or more web channels to define the URLs (pages) to be included for a web experience. For more information, see Web channel configurations.

  • Your website has the Adobe Experience Platform Web SDK (alloy.js) implemented for visitor identification and content delivery. Make sure that the Adobe Experience Platform Web SDK version is 2.16 or above.

  • You have the necessary permissions to create and manage web experiences in a journey:

    • Campaigns > Manage Campaigns - Required to add or update a web personalization action node.
    • Campaigns > View Campaigns - Required to view details for a Web personalization action nodes.
    • Campaigns > Approve and Publish Campaigns - Required to publish a journey that has one or more Web personalization action nodes.
  • You have the Adobe Experience Cloud Visual Editing Helper browser extension installed for your web browser. This extension is required to open, author, and preview your web pages reliably into the Journey Optimizer B2B Edition content design space.

    note note
    NOTE
    Google Chrome and Microsoft Edge are currently the only browsers that support authoring web pages in Journey Optimizer B2B Edition.

Install the Visual Editing Helper extension

  1. Open a new tab in your browser (Google Chrome or Microsoft Edge).

  2. Go to the Google Chrome Web Store.

    If you are using Microsoft Edge, select Allow extensions from other stores on the top banner. Enabling this option allows you to add extensions from the Chrome Web Store to Microsoft Edge.

  3. Search and navigate to the Adobe Experience Cloud Visual Editing Helper browser extension.

    Adobe Experience Cloud Visual Editing Helper extension for Google Chrome {width="800" modal="regular"}

  4. Click Add to Chrome, and then click Add Extension in the confirmation dialog.

    If you are using Microsoft Edge, this action adds the extension to Edge.

  5. Make sure that the Visual Editing Helper browser extension is correctly enabled in your browser toolbar.

    Adobe Experience Cloud Visual Editing Helper extension icon in Google Chrome toolbar {width="450"}

The Adobe Experience Cloud Visual Editing Helper is now automatically enabled when a website is opened in the Journey Optimizer B2B Edition visual editor for web experiences. The extension does not have any conditional settings and handles all the settings automatically, including SameSite cookies settings.

NOTE
Some websites might not open reliably in the Journey Optimizer B2B Edition web editor due to one of the following reasons:
  • The website has strict security policies.
  • The website is in an iframe.
  • The customer QA or stage site is not available externally (the site is internal).

Create a web experience

You can set up web experiences in a journey when you add a Take an action node and do the following:

  1. For the Action on target, choose People.

  2. For the Action on people, choose Personalize web experience.

Take an action - personalize web experience {width="500"}

  1. Click Create web experience.

  2. In the Create web experience dialog, enter a useful Name and Description (optional).

    • Name - Maximum of 100 characters, must be unique, case-insensitive

    • Description - Maximum of 300 characters

    note note
    NOTE
    Name and description fields support alpha, numeric, and special characters. Reserved characters (\ / : * ? " < > |) are not allowed.

    Create web experience dialog {width="400"}

  1. In the Properties tab, enter the description for the web experience.

  2. Click the Actions tab and select the Web channel to use for the web experience.

    The web channel configuration determines where the content modifications are applied based on the configured page matching rules. See Web channel configurations for more information.

    Selected web channel configuration {width="700" modal="regular"}

  3. To define the web modifications, click Edit content.

    The editor opens in the Content tab, where you can define the modifications for your web experience. See Web experience design for detailed information about using the design tools to add the web experience content modifications.

  4. In the right panel, set the web experience properties according to how you want to define and manage it.

    Toggle properties for the visual editor and redirect URL {width="700" modal="regular"}

  5. Click Edit web page to design your web modifications.

  6. When the modifications are complete, click the left arrow above the editor to return to the content tab and personalized web experience node properties.

    You can click the left arrow at the very top to return to the journey canvas.

Edit a web experience

  1. Open the journey and select the Personalize web experience action node.

  2. To make changes to the web channel configuration or content, click Edit web experience.

  3. Select the Actions tab and change the web configuration as needed.

  4. Select the Content tab and use the visual design tools as needed.

    • Visual editor - Click Edit Content.
    • Non-visual editor - Click Add a modification.

    See Web experience design for detailed information.

  5. When the modification definitions are complete, click the left arrow above the editor to return to the content tab and web experience properties.

    You can click the left arrow at the very top to return to the journey canvas.

Redirect to URL

When creating a web experience, you can redirect visitors to another existing URL rather than authoring a new variation in the content editor. This option is useful when you want to run a content experiment comparing two different experiences instead of just changing a few elements within a page.

For example, create a web campaign with two treatments:

In Treatment A, author a web experience using the content editor for half of your targeted population.

In Treatment B, select the Redirect to URL option for the other half of the targeted population. Enter the URL of a page with an alternate design that you authored outside of Journey Optimizer B2B Edition.

Set the visitor redirection to redirect visitors to a specific URL {width="500" modal="regular"}

NOTE
With this option selected, the website preview is not displayed and the Visual editor toggle is disabled.

When your web campaign is live, you can track how the web experience that you defined in Journey Optimizer B2B Edition is performing against web experiences that used a redirection to the alternative page.

Test the web experience

After the content design is complete for the web experience, you can use the Simulate content feature to preview your web page modifications. If you inserted personalized content, you can use test profile data to check how the content is rendered. The simulation tools are available from the Content tab for the web experience, or the content visual design editor.

  1. Click Simulate content at the top right.

  2. Select a test profile.

  3. Add a test profile to check your web page using the test profile data.

Activate your web experience

Your web experience is activated and made visible to the audience when you publish the journey. Before you activate a web experience through a journey, consider the following:

  • If you publish a journey with a web experience that impacts the same pages as another journey that is already live, all the changes are applied to the web pages.

  • If multiple journeys update the same elements of your website, the most recently applied change takes precedence.

Delivery requirements

To enable web experience delivery, the following settings must be defined:

  • In the Adobe Experience Platform Data Collection, make sure that you have a datastream defined with the Adobe Journey Optimizer B2B Edition option enabled under the Adobe Experience Platform service.

    This configuration ensures that the Adobe Experience Platform Edge can handle the inbound events correctly. Learn more

  • In Adobe Experience Platform, make sure that you have one merge policy with the Active-On-Edge Merge Policy option enabled.

    Select a policy under the Customer > Profiles > Merge Policies Experience Platform menu. Learn more

    This merge policy is used by Journey Optimizer B2B Edition inbound channels to correctly activate and publish inbound web experiences on the edge. Learn more

Troubleshooting

You can use the Edge Delivery view within Adobe Experience Platform Assurance to troubleshoot the delivery of Journey Optimizer B2B Edition Web experiences. This plugin enables you to inspect request calls in detail, verify the expected edge calls, and examine profile data. This profile data includes identity maps, segment memberships, and consent settings. You can also review the qualified and unqualified activities for the request.

For more information about the Edge Delivery view in Assurance, see the Experience Platform documentation.

6ef00091-a233-4243-8773-0da8461f7ef0