Walkthrough: Customizing the Preference Center

Current version: 10.4

The Preference Center enables users to specify which marketing campaigns they want to participate in and allows them to opt-out of all future email campaigns if they so desire. You can modify the default Sitecore branding of the Preference Center and specify the preferences that are important to you. In the example below, the default branding is shown on the left and the custom branding on the right.

Example of a customized Preference Center.

You can customize:

  • 1 - The Preference Center title and colors

  • 2 - The header logo and introduction

  • 3 - The marketing categories, titles, and descriptive text

  • 4 - The Unsubscribe text

  • 5 - The Update Subscriptions button

This topic describes how to:

Define marketing campaign categories and descriptive text

Using the default layout, each category you define displays as a separate section in the Preference Center. Marketing campaign categories are added to the Preference Center by marketing category group.

Marketing Control Panel Campaigns folder in the sitecore tree structure.

To define marketing campaign categories:

  1. In the Content Editor, navigate to the Marketing Control Panel (sitecore/System/Marketing Control Panel).

  2. Expand the Taxonomies folder, right-click Marketing categories and click Insert, Folder to add a marketing category group.

  3. Right-click the newly created folder and click Insert, Insert From Template.

  4. In the Insert from Template dialog box, navigate to Templates/System/Analytics/Marketing Taxonomy/Marketing category and select Marketing category.

    Insert from Template dialog box showing the marketing category.
  5. In the Item Name field, type the name of the subscription category (for example, Newsletter) and click Insert.

    sitecore tree showing the Campaigns structure.
  6. To define additional subscription sections, repeat Steps 3 to 5.

  7. In the content tree, click one of the subscription categories that you just defined and, on the Content tab, in the General section, in the Description field, click the Show editor hyperlink.

  8. In the Rich Text Editor dialog box, type a description of the campaign category, and click Accept.

  9. When you have defined all the marketing categories, in the content tree, navigate to sitecore/System/Marketing Control Panel, expand the Taxonomies folder and then click Campaign group.

  10. On the ribbon, click the Taxonomy tab, and then click Deploy.

    Taxonomy tab showing the Deploy button.

Upload a new logo to the Media Library

For the logo to display in the Email Preference Center, you must first upload it to the Media Library and then re-publish the site.

To upload a logo:

  1. In the Content Editor, in the content tree, navigate to sitecore/Media Library/Images.

  2. On the Folder tab, click Upload File.

  3. In the Upload File dialog box, click Choose File, and browse to where the logo image file is saved.

  4. Select the logo file and click Open and then click Upload.

  5. On the ribbon, click Save.

Apply brand styles

For your logo and images to appear in the Preference Center, you must configure them first.

To configure the logo and images:

  1. In the Content Editor, in the content tree, navigate to the manager root for which you want to define Preference Center options.

  2. Click the Content tab.

  3. In the Message Generation section, in the Base URL field, specify the website address for links in email messages and for images that are hosted on the website (for example, http://your.host).

  4. Select the Embed Images check box.

  5. In the Default Message Header section, in the From Address field, type the email address of the sender (for example, [email protected]).

  6. In the Branding section, specify the brand name and logo. Using the default settings for the Preference Center, the brand name is used in the unsubscribe message and the logo is inserted at the top of the Preference Center.

  7. In the Marketing Categories section, double-click the marketing category group you defined in Step 2 of the first procedure to move it to the Selected list.

  8. Save your changes.

Change the look and feel of the Preference Center

You can customize the Preference Center to mirror company branding. By default, the Preference Center Marketing Group HTML displays subscription options for the marketing group and categories you defined for the marketing root.

To change the look and feel of the Preference Center:

  1. In the Content Editor, with the manager root for which you want to define Preference Center options selected, click the Content tab.

  2. Scroll down to the Preference Center section.

  3. In the Preference Center Title field, specify the title of the Preference Center dialog box.

  4. In the Preference Center Intro, click the Show editor hyperlink and introduce the Preference Center to users.

  5. In the Preference Center Layout HTML section, click the Edit HTML hyperlink.

  6. To change the colors of the header and submit button, change the following:

    • Replace the header section with:

      RequestResponse
      
      header {
                  height: 90px;
                  border-top: 4px solid #9D008D;
                  background-color: rgba(0,0,0,.8);
                  padding: 0 15px;
                  color: #fff;
                }
      
    • Replace the header.before section with:

      RequestResponse
      
       header:before {
          position: absolute;
          right: 0;
          top: 0px;
          display: block;
          background-repeat: no-repeat;
          width: 113px;
          height: 90px;
          content: "";
          border-top: 4px #9D008D;
          }header:before {
                  position: absolute;
                  right: 0;
                  top: 0px;
                  display: block;
                  background-repeat: no-repeat;
                  width: 113px;
                  height: 90px;
                  content: "";
                  border-top: 4px #9D008D; and background-color: rgba(0,0,0,.8);
                }
      
    • In the .exmPreferenceCenter form button section, change the background-color and the border-color attribute.

    • In the .exmPreferenceCenter label .description .title section, add the line color: #9D008D;.

  7. Click Accept and save your changes.

Publish your changes

To see modifications to the Preference Center, you must publish site changes.

To publish site changes:

  1. On the ribbon, click the Publish tab.

  2. Click Publish, Publish Site.

  3. Accept the defaults (Smart publish) and click Publish.

  4. Once the site has been published, click Close.

To see your changes, in the Email Experience Manager, create an email campaign using the Left Image Block template and send it.

Do you have some feedback for us?

If you have suggestions for improving this article,