Consult Us Support Us

Web Personalization Experiences

Web Personalization Experiences

This guide explains how to configure web personalization experiences to surface dynamic content using the Web Personalization Manager. You will learn how to inject the Web SDK, configure a homepage banner, and add product recommendations to a product detail page.

[ACTION REQUIRED: Review Note] - NOTE: Before starting the hands-on exercises in this workshop, watch the provided video to learn how to enable Web Personalization Manager and configure personalization experiences. Enter the password LearnSPtoday to play the video.

Inject the Web SDK

In this exercise, you will use Sitemap Builder to inject the SDK from the website connector.

  1. Open the demo website.
  2. Open the Sitemap Builder Chrome extension.
  3. Click the Inject tab.
  4. Ensure that the Web SDK URL field includes the script URL for your website connector.

[ACTION REQUIRED: Review Note] - TIP: Retrieve Web SDK URL. If the Web SDK URL field is empty in Sitemap Builder: click Data Cloud Setup, enter Websites in the quick find field, select Websites & Mobile Apps, click the Training Site connection, copy the Script URL at the bottom of the page, and paste it into the Web SDK URL field.

  1. Enable the Use SDK-embedded sitemap option.

[ACTION REQUIRED: Review Note] - NOTE: SDK-Embedded Sitemap. When enabled, this option instructs the injected SDK to use the sitemap and schema file stored in your org.

  1. Click Inject.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: SDK injection details in Sitemap Builder

Configure a Homepage Banner Experience

With the SDK running locally, configure a personalization experience using the Web Personalization Manager.

  1. Append the parameter ?sf_personalization_wpm to the demo website URL.
  2. When prompted, click Log in, then sign in using your SDO user credentials.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Web Personalization Manager Login

  1. Click Allow on the Allow Access window if prompted.
  2. Confirm that the Web Personalization Manager toolbar appears at the top of your browser window.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Web Personalization Manager Toolbar

  1. Click Personalization Experiences from the Web Personalization Manager toolbar, then click Add New.
  2. Select the Configure Embedded Content tile in the Configure Personalization Experience dialog, then click Next.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Configure Personalization Experience in Web Personalization Manager

[ACTION REQUIRED: Review Note] - NOTE: Web Curation Experience. This option makes it easy to apply AI-powered agents directly to your website. Agents can generate structured responses, conversational answers, and curated product information for a personalized, context-aware experience.

  1. Select the Homepage Banner personalization point, then click Next.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Personalization Points

[ACTION REQUIRED: Review Note] - NOTE: Personalization Points. The available personalization points use a real-time profile data graph and are created in the same data space as your sitemap.

  1. Select the SimpleHero template tile, and click Next.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Personalization Experience Templates in Web Personalization Manager

[ACTION REQUIRED: Review Note] - TIP: Personalization Experience Templates. The templates align with those created in the personalization application. If a template is unavailable, the Select & Modify Existing Page Elements option allows you to replace on-page elements with decision values directly.

  1. In the Homepage Banner panel, leave the Method to Display on Page option set to Replace an Element, then click Select Element.
  2. Select the existing homepage banner with the element class name DIV.slide-overlay.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Select element in Web Personalization Manager

  1. Click Select Parent twice in the Homepage Banner panel so the Page Element field changes to DIV.carousel-container. This replaces the entire carousel container with the personalization decision.

[ACTION REQUIRED: Review Note] - TIP: Add an Overlay. Choosing Add an Overlay provides trigger options like exit intent, element click, or scroll percentage to control when content appears.

  1. Select the Content tab in the Homepage Banner panel.
  2. Select Website Engagement from the Engagement Destination menu.

[ACTION REQUIRED: Review Note] - NOTE: Engagement Destinations. A configuration determining how user interactions are processed and sent to Data Cloud. You can choose a standard OOTB destination or create a custom one.

  1. Click the Preview Settings tab in the Homepage Banner panel.
  2. Select a decision from the Web Personalization Manager toolbar, then click Preview to see how the decision will appear.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Preview decisions in Web Personalization Manager

[ACTION REQUIRED: Review Note] - TIP: User Previews. Enter an Individual ID to preview the experience from the perspective of a specific website user.

  1. Click Reload when prompted. You do not need to save the experience for this exercise.

Configure a Product Recommendations Experience

In this exercise, you will configure a Product Recommendations experience using a pre-configured recommendations personalization point on a product detail page.

  1. Append the parameter ?sf_personalization_wpm to the demo website URL and login when prompted.
  2. Navigate to the Carbon Road Bike - Aero Elite product detail page.
  3. Click Personalization Experiences from the Web Personalization Manager toolbar, then click Add New.
  4. Select the Configure Embedded Content tile in the Configure Personalization Experience dialog, then click Next.
  5. Select the PDP Recs Personalization Point, then click Next.
  6. Select the SimpleRecs template tile, and click Next.
  7. From the PDP Recs panel, change the Method to Display on Page option to Add After an Element, then click Select Element.
  8. Move your cursor over the page until DIV.product-detail is highlighted, then click to select it as the target element.
  9. Select the Content tab. For Engagement Tracking, leave the Engagement Destination field set to Product Engagement.
  10. Select a decision from the Web Personalization Manager toolbar, then click Preview and scroll down the page to view the product recommendations.

[ACTION REQUIRED: Update Image Here] - Original Context/URL: Preview product recommendations in Web Personalization Manager

  1. Click Reload when prompted. You do not need to save the experience for this exercise.

Summary

By completing these steps, you have successfully injected the Web SDK using Sitemap Builder and utilized the Web Personalization Manager to configure targeted web experiences. You learned how to map personalization points to both homepage banners and product detail pages, establishing a dynamic and responsive website environment.

Previous

© 2026 SF Guide (sfguide.in) — All rights reserved.