How to Use Page Designer for Customizing Storefronts

Introduction

Salesforce B2C Commerce Cloud's Page Designer is a powerful tool that enables merchants and developers to create and customize storefront pages without extensive coding. This guide will walk you through the process of using Page Designer to create dynamic and engaging storefront pages.

Step 1: Accessing Page Designer

To get started, you need to log in to Business Manager and navigate to the Page Designer tool.

  • Login to Salesforce Business Manager
  • Go to Merchant Tools > Content > Page Designer.

    Accessing Page Designer

  • Click Create Page to start designing a new storefront page.

    Create Page

Step 2: Creating a New Page

After accessing Page Designer, follow these steps to create a new page:

  • Select a page type that best fits your needs (e.g., home page, product page, landing page).

    Creating a New Page

  • Choose a template or start from scratch.

    choose template

  • Define the page settings, including name, URL, and metadata by clicking on the gear button.

    page settings

Step 3: Adding Components to Your Page

Page Designer provides pre-built components that can be dragged and dropped onto your page.

3.1 Available Components

  • Banners: Add promotional banners.
  • Product Carousels: Showcase featured products.
  • Text Blocks: Insert descriptions and marketing content.
  • Buttons & Links: Guide user navigation.
  • Forms: Capture customer data.

    Available Components

3.2 Customizing Components

  • Click on a component to edit its properties.
  • Adjust styling options such as fonts, colors, and spacing.
  • Use dynamic content to personalize user experiences.

Step 4: Previewing and Testing Your Page

Before publishing, it's essential to preview and test your page.

  • Click Preview to see how the page looks.

    Design Preview

  • Test the responsiveness on different devices.
  • Ensure all components function correctly.

Step 5: Publishing Your Page

Once satisfied with your design, proceed to publish your page.

  • Click Save & Publish.

    Design Publish

  • Assign the page to a site hierarchy.
  • Set scheduling options for timed releases.

Step 6: Optimizing and Updating Pages

After publishing, continue optimizing your pages for better performance.

  • Use A/B testing to determine the most effective layout.
  • Analyze site analytics to track visitor engagement.
  • Make periodic updates to refresh content and promotions.

Conclusion

Page Designer in Salesforce Commerce Cloud offers a user-friendly and flexible approach to designing storefront pages. By leveraging its drag-and-drop functionality and customization options, businesses can create engaging shopping experiences that drive conversions. Start experimenting with Page Designer today to enhance your eCommerce storefront!

For additional questions on Experience please reach out to support@astreait.com