Landing Pages
Email
Design Manager

Add smart content to your emails, website pages, landing pages, and templates

Last updated: April 7, 2020

Applies to:

Marketing Hub  Professional, Enterprise
CMS Hub  Professional, Enterprise

With smart content, a module can display different versions of your content based on certain viewer criteria. In addition to creating smart CTAs and smart forms, you can use rich text modules or global custom modules to add smart content to your website pages, landing pages, and emails.

If a contact meets more than one of your smart content rules, they'll see the content for the first rule that applies to them. You can also preview how your smart content will render for specific visitors.

Please note: smart content should not be used on thank you pages because a contact's property values and list memberships won't update immediately after a form submission, leaving no time to inform the smart content on the page. Only contacts with preexisting property values and list memberships will see the smart content set for those conditions. 

Smart rule criteria types

You can base your smart rules on the following criteria types:

  • Country: display content to your viewer based on their country. The country is determined by the IP address of the visitor.
  • Device type: specify which device this smart content is centered around (mobile, tablet, or desktop). HubSpot looks at what is called the user agent of your visitor’s browser to determine their device type. Since this can sometimes be changed on the device, HubSpot cannot always guarantee accurate segmentation.
  • Referral source: show visitors your smart content based on how they found your site.
  • Preferred language: personalize your content based on the language set within the user's web browser.
  • Contact list membership: show a contact in your HubSpot database certain content dependent on whether or not they're a member of one of your HubSpot lists.
  • Lifecycle stage: this will look at the lifecycle stage property of a contact in your HubSpot database and display the relevant content based on the value of this field.

Please note: Country, device type, referral source, and preferred language can be chosen for contacts and customers as well as anonymous visitors.

When you create smart content, keep best practices in mind. Start small and pick only one area of text to personalize to your visitors.

Add smart rules to your emails

When you create or edit an email, you can add smart rules to the subject line and the email body. In the design manager tool, you can add smart content to an email template using a rich text module.

Please note: adding smart content to emails is only available for Marketing Hub Professional and Enterprise accounts. 

Add a smart rule to a module or subject line

  • In your HubSpot account, navigate to Marketing > Email.
  • Hover over your email draft and click Edit, or create a new email.
  • To add a smart subject line:
    • If you're using the drag and drop email editor, click the Settings tab. If you're using the classic email editor, click the Edit tab, click Edit details
    • Under Subject line, click Add smart rule.
  • To add a smart rule to a module in the drag and drop email editor, hover over the module, click the More dropdown menu, then click Add smart rule.
  • Select to add smart rules based on Contact List Membership or Contact lifecycle stage. Because these emails are being sent to known contacts, you can't base your smart content criteria on anonymous information like device type or referral source.
  • Select the list(s) or lifecycle stage(s) you want to create a unique subject line for.
  • Click Create.

smart-send-email-subject

Add a smart rule to the main email body

If you're using the classic email editor, you can add smart rules to the main email body:

  • In your HubSpot account, navigate to Marketing > Email.
  • Hover over your email draft and click Edit, or create a new email.
  • In the email editor, click the Main Email Body module, then click the Make smart icon.

make-smart

  • Select a smart rule based on Contact list membership or Contact lifecycle stage. Because these emails are being sent to known contacts, you can't base your smart content criteria on anonymous information like device type or referral source.
  • Click the dropdown menu to select specific list(s) or lifecycle stage(s) to target in this smart rule.
  • Click Create.

select-smart-rule

  • In the sidebar editor, click the Content dropdown menu to switch between your default text and your smart text.

Manage your smart rules

  • To manage a smart rule for your subject line, click Manage smart rules. To add a new smart rule, click Add smart rule

edit-smart-subject-line

  • To manage a smart rule for a module in the drag and drop email editor, hover over the module, click the More dropdown menu, then click Manage smart rules.

email-dnd-manage-smart-rules

  • To manage rules for smart content in the classic email editor:
    • In the left sidebar, click the Edit modules icon integrations.
    • To add smart content rules, click Add rule. To change the order of your smart rules, click Reorder rules. To remove any smart rules, click Delete all rules.

      email-classic-manage-smart-rules
    • When you're done editing your smart text, click Save and go to module list.

Preview your email as a specific contact

  • When you're done editing your smart rules, you can preview your email to see how it will render before you send it. You can also confirm how it looks in your inbox by sending a test email.
  • When you're ready to send the email, click Send.

Add smart content to a landing page or website page

Add a smart rule to a page

make-module-smart-on-a-page

  • In the dialog box, select smart content rules based on Country, Device type, Referral source, Preferred language, Contact list membership, or Contact lifecycle stage.
  • Click Create.
  • In the dialog box, select the criteria for your smart rule.
  • In the left panel, click Edit in expanded view to edit the smart content for your module.
  • Make your edits to your smart content, then click Apply changes.

edit%20smart%20content


  • When you're done editing your smart text, click Close expanded view.

Manage your page's smart rules

To add, edit, remove, or reorder smart rules for your page module:

  • Click the module with the smart content in the page editor.
  • In the left sidebar editor, click the Smart variation dropdown menu to select the variation you want to manage.
  • To add more smart content rules, click the Smart variation dropdown menu and select Add rule.
  • To edit existing smart rules click the Smart variation dropdown menu and select Manage rules. Within the Manage smart rules panel, you can:
    • add more smart rules,
    • edit existing smart rules, or
    • change the order your smart rules are applied.
  • To delete a smart rule, click the delete trash icon directly next to that rule.
  • Click Save to apply your changes.

Preview your page's smart rules

To preview how the smart text will appear to visitors on your site:
  • In the upper right, click Preview.
  • To test how your smart content will appear, click the Preview as dropdown menu and select Smart rule.
  • Click the Select a smart rule (optional) dropdown menu to preview the page from a specific country, language, or traffic source.

    preview-smart-rule

Add smart content in the design manager

  • In your HubSpot account, navigate to Marketing > Files and Templates > Design Tools.
  • In the finder, select a template to edit.
  • In the template editor, click the rich text module you want to make smart.
  • In the inspector, click the Edit tab.
  • Click the More dropdown menu and select Make module smart.
HubSpot Help article screenshot
  • In the dialog box, select the criteria you want to base your smart content rules on.
  • Click Create.
  • In the module inspector, click the rich text content preview to expand the editor.
  • Enter your smart text in the rich text editor.
  • To switch between your default text and the text your smart rules will be based on, use the Smart based on [X] dropdown menu. edit%20smart%20text%20in%20the%20design%20manager
  • To add smart content rules, click Add rule. To change the order of your smart rules, click Reorder rules. To remove your smart rules, click Delete all rules.
HubSpot Help article screenshot
  • In the upper right, click Publish changes to take your changes live.

Add smart content to a global module

  • In your HubSpot account, navigate to Marketing > Files and Templates > Design Tools.
  • In the finder, select your module to edit.
  • In the inspector, under Global and smart content, select Edit global and smart content.

add-smart-rules-custom-module

  • In the content editor, click Make smart to add smart rules to your default module content.

make-module-smart

  • In the dialog box, select the criteria you want to base your smart content rules on, then click Create.
  • To switch between your smart content and the Default content, click the dropdown menu at the top of the editor.
  • To add smart content rules, click Add rule. To change the order of your smart rules, click Reorder rules. To remove your smart rules, click Delete all rules.
  • In the upper right, click Publish changes to take your changes live.
/cos-general/add-smart-content-to-your-website-pages-landing-pages-and-emails