Loading
Salesforce now sends email only from verified domains. Read More
Marketing Cloud Next
Table of Contents
Filter by (0)Add
Select Filters

          No results
          No results
          Here are some search tips

          Check the spelling of your keywords.
          Use more general search terms.
          Select fewer filters to broaden your search.

            Search all of Salesforce Help
            Search all of Salesforce Help
            Prepare to Use Forms on an External Site

            You are here:

            1. Salesforce Help
            2. Docs
            3. Marketing Cloud Next

            Prepare to Use Forms on an External Site

            Before you embed a form on an external site, configure your Salesforce org so that the site can communicate with your Experience Cloud site.

            Required Editions

            Available in: Salesforce Enterprise and Unlimited Editions with Marketing Cloud Next Growth or Advanced Edition, and in Starter and Pro Suite Editions. Your edition determines the options that you have.
            User Permissions Needed
            To configure forms for external sites:

            Modify All Data

            OR

            Marketing Cloud Admin permission set

            OR

            Customize Application

            AND

            Manage Experiences

            Before you begin, make sure that these items are ready:

            • You have an active Experience Cloud site that's connected to your Marketing Cloud Next instance.
            • Your Marketing Cloud Next form is published and you have the generated embedding code, which consists of two <script> tags and a custom HTML fragment element.
            • You've identified the full origin URL of the external site where you plan to embed the form.
            • The external site supports JavaScript execution and iframe embedding.
            • To make sure that activities are tracked, set up your website to use first-party tracking by aligning all of your web pages and Salesforce content under your root domain. Industry standards are moving away from third-party cookie tracking and we recommend using first-party domain alignment.

            See Also

            Add the External Site to Cross-Origin Resource Sharing (CORS)

            Add the external site as an origin for cross-origin requests between the site and your Salesforce org. Cross-Origin Resource Sharing (CORS) allows web browsers to request resources from other origins.

            1. In Setup, search and select CORS Allowed Origin List.
            2. Click New.
            3. For Origin URL Pattern, enter the external site's origin. For example, https://www.example.com.
            4. Click Save.

            Configure Clickjack Protection

            Update clickjack protection on the Experience Cloud site so that external sites can embed your site's content in a Salesforce iframe. The form embedding code relies on Lightning Out, which is a feature that creates an iframe for loading content from your Experience Cloud site.

            You can set the clickjack protection to one of these levels:

            • Allow framing of site pages on external domains (good protection): Select this option if you’re hosting the form on a website where your HTML runs directly on the page. For example, a custom-built site, CMS, or static hosting provider. This protection level restricts framing to the domains that you add, maintaining clickjack protection while activating the form embedding code.
            • Allow framing by any page (no protection): Select this option if you’re hosting the form on a platform that generates multiple URLs between your site and the Salesforce iframe. Because the URLs are dynamic, you can’t add them to the Trusted Domains list in advance. For example, Google Sites uses domains like www.gstatic.com and *.atari-embeds.googleusercontent.com to embed content.
              Important
              Important This option removes all clickjack restrictions on the Experience Cloud site, which means any external page can frame it. Use it only when Allow framing of site pages on external domains (good protection) isn't compatible with your hosting platform.
            1. In Setup, search and select All Sites.
            2. Next to the Experience Cloud site connected to your Marketing Cloud forms, click Builder.
            3. In Experience Builder, select Settings | Security & Privacy.
            4. Under Clickjack Protection Level, select a clickjack protection level based on your external hosting platform.

              If you select Allow framing of site pages on external domains (good protection), add external domains where you plan to embed the form.

              1. Under Trusted Domains for Inline Framing, click + Add Trusted Domain.
              2. Enter the external site URL. For example, https://www.example.com.
              3. Repeat the steps for each external domain.

            Add the External Domain as a Trusted Site for Scripts

            Enable scripts from the external site to interact with your Experience Cloud site.

            1. In Experience Builder, select Settings | Security & Privacy.
            2. Under Trusted Sites for Scripts, click + Add Trusted Site.
            3. For Trusted Site Name, enter a descriptive name for the site.
            4. For Trusted Site URL, enter the external site URL. For example, https://www.example.com.
            5. Verify that the status is active.
            6. Click Save.

            Publish the Experience Cloud Site

            Publish the Experience Cloud site to make sure that the configuration changes in Experience Builder take effect. Always republish the site after updating security settings. Skipping publish causes your external form to show a frame-ancestors 'self' Content Security Policy error.

            1. In the Experience Builder toolbar, click Publish.
            2. Click Publish again.
            3. Wait for the publish process to complete.

            Add the Embedding Code to Your External Site

            After configuring your Salesforce org, copy the auto-generated embedding code from your published form, and then add it to your external site.

            1. From the Content tab, open your published form for editing.
            2. On the Embed tab, click Copy Code to copy the embedding code snippet to your clipboard.
            3. Paste the entire code snippet into your external site's HTML, at the location you want the form to appear.
              1. Place the two <script> tags for hosting and Lightning Out bootstrap above the form's intended location.
              2. Insert the custom HTML <fragment> element that serves as the form container exactly where the form should render.

            The embedding code is generated from the published version of the form. If you update the form content, republish the form to refresh the embedding code.

            (Optional) Configure Web Tracking

            Track visitor interactions on your external site by using an attribute on the fragment element. When set to true, the form uses the Data 360 Web SDK to track the interactions.

            • To turn on web tracking, set data-web-tracking="true" and configure the Data 360 Web SDK connector.

              When web tracking is on but the Data 360 Web SDK isn't configured, the browser console shows a message stating that the Web SDK isn't available. This message is informational and doesn't prevent the form from rendering or accepting submissions.

            • To turn off web tracking, set data-web-tracking="false".
             
            Loading
            Salesforce Help | Article