Skip to content

Preview marketing cloud emails with AmpScript rendering in Salesforce Core

Notifications You must be signed in to change notification settings

ehsky/Marketing-Cloud-Email-Preview

Repository files navigation

Marketing Cloud Email Preview

This app solves the preview issue when you have a lot of dynamic content blocks, ampScript etc in an email and you want to view the actual sent message to the end user.

Preview of component

This requires Marketing Cloud Connect.

Deploy

You can use the quick installer here to deploy the code directly to your org.
Deploy to salesforce

Setup

Create Package In Marketing Cloud

  • Ensure you're in the Business Unit that you'd like the component to display emails from.
  • Inside Marketing Cloud, open Setup, expand Appsa and choose Installed Packages. Then click on New
  • Give the package a name, such as SFMC Email Preview, then click Save
  • Click on **Add Component**m select API Integration, and click on Next, then choose Web App, click Next, and finally in the permissions panel, you must cik the following options:
    • Offline Access
    • Email: Read
  • At the top, set the URI field to any URL you can think of - we'll change it later. E.g. google.com, and then click Save
  • Click on the tab Access, then License All Users or pick a specific integration user. If you pick a specific user this would be used in a later step.

Configure Auth Provider

  • From Setup, in the Quick Find box, enter Auth, and then select Auth. Providers.
  • Click New.
  • For the provider type, select OpenID Connect.
    • Provider name: SFMC Email Preview
    • URL suffix: SFMC_Email_Preview
    • Consumer Key: Paste the Client Id from the Marketing Cloud Package we just created.
    • Consumer Secret: Paste the Client Secret from the Marketing Cloud Package we just created.
    • Authorize Endpoint URL: Paste the Authentication Base URI from the Marketing Cloud package we just created, and add v2/authorize at the end (e.g. https://xxxxxxxxxx.auth.marketingcloudapis.com/v2/authorize)
    • Token Endpoint URL: Paste the Authentication Base URI from the Marketing Cloud package we just created, and add v2/token at the end (e.g. https://xxxxxxxxxx.auth.marketingcloudapis.com/v2/token)
  • Then click Save.
  • Now, at the bottom of there page you'll find a Callback URL, copy it.
  • Go back into the Marketing Cloud Package configuration page, click on Edit inside the API integration box, and replace the dummy URI you had entered at the top (google.com) with the one you just copied. Click Save.

Auth. Provider Setup Example

Configure External Credential

Start by creating a new permission set or find an existing where you want to grant access to this api.

  • From Setup, in the Quick Find box, enter Credential, and then select Named Credential in the menu on the left.
  • Continue by clicking on the tab External Credentials, and click on New.
  • In the form fill out the following details:
    • Label: SFMC Email Preview
    • Name: SFMC_Email_Preview
    • Authentication Protocol: OAuth 2.0
    • Authentication provider: SFMC Email Preview

Auth. Provider Setup Example

Authenticate External Credential

We are now going to use the newly created or chosen permission set.

  • In the section Permission Set Mappings, click on *New.
  • Find the permission set of your choosing.
  • Pick one of the following Identity Types:
    • Per User Principal: If you requiere that only users of this component need to have a user in marketing cloud.
    • Named Credential: All users of the component are pre-authenticated as on the Salesforce org-level.
  • Click Save

If your unsure of the Identity Type, then pick Named Credential

  • If you chose Named Credential then click on the arrow under the Actions column.
  • Then click Authorize.
  • Continue logging in to marketing with your user, or use an integration user mentioned in the package setup section previously.
  • Confirm that the Authentication Status is Configured

Auth. Provider Setup Example

Configure Named Credential

Continuing from the previews step.

  • Click on the Named Credential tab.
  • Then click on New, and complete the form with the following options:
  • Label: SFMC Email Preview
  • Name: SFMC_Email_Preview
  • URL: https://xxxxxxxxxx.rest.marketingcloudapis.com
  • External Credential: Your recently created External Credential with same name
  • Click save

Auth. Provider Setup Example

Add Lightning Web Component to Record Pages

The final step is to add the component "Marketing Cloud Email Preview" to the record page layout of the IndividualEmailResult object. In the component properties you input the Developer name of the Named Credential, in this guide it is SFMC_Email_Preview

About

Preview marketing cloud emails with AmpScript rendering in Salesforce Core

Topics

Resources

Stars

Watchers

Forks