RSS for MailChimp

MailChimp can pull information from an RSS feed and export it as an HTML-formatted newsletter. This case study describes how to set up this feed from Drupal, and integrate it into a MailChimp campaign.

Table of contents

• Introduction
• Installing and enabling the modules
• Set up the RSS feed
• MailChimp operations
• Setting up a MailChimp RSS campaign
• Final word

Drupal projects discussed in this chapter: Views, Views RSS, Views RSS Media Elements.

Introduction

MailChimp is a premium SaaS for bulk-distributing HTML formatted newsletters. The newsletters may contain text and “featured images” pulled from a website's RSS feed. The screenshot below shows the one such newsletter.

This case study will show how to use Views to create an RSS feed of recent blog posts with teaser text and a image in a format suitable for creating a MailChimp HTML-formatted newsletter.

RSS-tags.

There exist two main options for the “featured image” field. One is to use the core “image” field for this. The other is to use a field called “scald atom ref” that is provided by the Scald media manager. This case study will describe both options.

The case study will also go through the steps of creating an example MailChimp newsletter and how to preview and test it. However, it will not go into other aspects of MailChimp, such as creating a subscriber list and distributing the newsletter to the subscribers.

There exists a MailChimp bridge module that lets you create a MailChimp sign-up form, generate and send MailChimp email campaigns from your Drupal site. The MailChimp bridge module is not required to integrate MailChimp with Drupal, and is not used in this case study.

Installing and enabling the modules

Make sure the following modules are installed:

1. Views
2. Views UI (part of Views)
3. Views RSS
4. Views RSS: Core Elements (part of Views RSS)
5. Views RSS: Media Elements (must be patched for Scald)

To this with drush:

$ drush en views -y
$ drush en views_ui -y
$ drush en views_rss -y
$ drush en views_rss_core -y
$ drush en views_rss_media-7.x-1.x-dev -y

There are further dependencies, which will not be discussed here as they are sorted out by Drupal.

If you want to use the “scald atom ref” field for images, you must start with 7.x-1.x-dev snapshot dated 2020-10-14, reroll and then apply the following patch:

1. 2672428 #2

After patching, make sure all the required modules are enabled.

Create a newsletter content type

Add existing field_image.

Set up the RSS feed

Create a new view for the feed: navigate to Structure » Views » Add new view. Fill in the form as shown in the screen dump below.

To finish of the initial setup, click “Continue & edit”.

The next screen should have a present the display options “Page”, “Feed” and “+Add”. To make sure you're editing the feed, click on the “Feed” display option. Then in the “Format” section, click on the link to the format (“RSS Feed ”) and change this to “RSS Feed – Fields”.

Click on “Apply”.

You'll be presented with a window with the heading “Feed: Style Options” next. Just hit “Apply” again. The style options should be set after you've added the fields to include in the feed.

In the “Fields” section, add the fields to include in the feed. The field “Content: Title” is already present. To add more fields, click on “Add” above the “Fields” section. For instance, you may add the body, path and image fields you're going to use in the feed.

• “Content: Body”
• “Content: Image” (or “Content: Scald atom ref” if you use Scald for media)
• “Content: Path” (use “Path” rather than “Link” as it will allow absolute URLs)

Click “Apply (all displays)”.

For the body field, you may don't want the whole post going out in the email (i.e. the newsletter is used to make its recipient visit your site to read the whole story). For this to happen select formatter “Trimmed” and trim the body to 400 characters. We shall return to this field in a moment as well to set up the read more link, but we need to do some additional configuration first.

For all these fields uncheck “Create a label” and under “Style settings”, uncheck “Add default classes” since these are not used by RSS fields.

Configure the formatter for the image field:

• Use “RSS <media:content> element” for the core image field.
• Use “Scald RSS <media:content> element” for the scald atom ref field.

Also configure the image style to produce a scaled-down image. The screen dump shows example values you may use.

The screen dump above shows this dialog for the core image field. The dialog for the scald atom ref field is similar.

When done, click “Apply (all displays)”.

Now, go back to the “Format” section to configure the style options. Click on “Settings” and expand “Item elements: Core”. Populate the fields:

• title – Content: Title
• link – Content: Path
• description – Content: Body
• pubDate – Content: Post date

Make sure that a short date format is used. It is not strictly canon. The pubDate element should be formatted in line with RFC 2822, but it is close enough for jazz and works om Mailchimp. For background, see pubdate not showing.

Leave the rest alone.

Next, expand “Item elements: Media”.

• thumbnail – Content: Image (or Scald atom ref)

Leave the rest alone.

When done, click “Apply”.

I have not figured out how to get <dc:creator>. I now (via a relation) get <author> inserted, which is accepted by Mailchimp.

To make sure that absolute URLs are used, rearrange the fields so “Content: Path” comes first. This ensures that the “”Content: Path” replacement pattern is available for all of our other fields. Click “Apply (all displays)”.

To get the “Title” to link to the absolute path, click on “Content: Title”, and uncheck “Link this field to the original piece of content”. This link is useless to MailChimp as it is a relative link. Instead, look under “Rewrite results“, and select ”Output this field as a link”. Scroll down to the “Replacement Patterns” area, and use the replacement pattern for ”Content: Path” (it is “[path]” in the screenshot below, but it may be something else). Also check “Use absolute path”.

When done, click “Apply (all displays)”.

Finally, click “Save” to save the view.

Source: Kristin Brinner.

MailChimp operations

Link to useful MailChimp operations:

• Export a Custom HTML Template
• Import a Custom HTML Template
• Delete Campaigns from Your Account
https://mailchimp.com/help/set-a-default-logo/

Setting up a MailChimp RSS campaign

When the RSS feed in place, it is time to create a MailChimp campaign to send out an automated newsletter. Log in to your MailChimp account. Select the relevant account (if you manage more than one). The icon to your account settings is in the lower left corner.

First. make sure you have an audience. xxxx

To create an automation, locate the “Automation” icon (left edge of screen). Navigate to Automation » Customer journey » Explore » Share your blog posts. This will produce a popup that says "Share blog updates". Enter a campaign name and choose an audience. Select "Begin". This will start a wizard to create campaign.

The wizard consists of six steps (RSS Feed > Recipients > Setup > Template > Design > Confirm). Progress is shown as breadcrumbs on the bottom of the screen.

The first step has the title “RSS feed and send timing”. In the field “RSS feed URL”, enter the URL of the feed you've created.

For just testing, you can leave the timing and resize settings unchanged. Click "Next" (bottom right of screen).

In this case study, the bogus URL “http://www.example.com/views-rss-feed.xml” is used as an example. However MailChimp requires a valid URL to proceed to the next step in the wizard. If you are trying this out on a staging server that is behind a firewall that disallow outside connections, MailChimp will not be able to see your RSS feed and your setup will fail. Always make sure your feed is reachable from the outside.

Set up recipents. This will be one of your audiences. Select "Entire audience".

Click "Next".

The next step has the title “Campaign info”. You need to give your campaign a name. It will appear on your “Campaigns” page. Also provide some preview text and a from-name.

The email subject is already filled in with:

Posts from *|RSSFEED:TITLE|* for *|RSSFEED:DATE|*

As for the rest of the settings, you can keep the defaults as long as this will only be used for testing. Click "Next".

The next step lets you select a HTML template for the campaign email.

For testing, the basic 1 column template is adequate. Click on it to select it .

When you select a template, you are automatically transferred to a design editor that let you set up the content of the campaign email.

The design editor is where you create the content for your campaign email. It is a powerful tool, but in this RSS case study, we're just going to populate a content area with content pulled from the RSS feed.

First get rid of the placeholder text with the heading "It's time to design your email."

Hover over the text to activate it. Then click the garbage can icon to delete it.

Now, there should be an area with the text "Drop Contents Block here". Locate the content block with the name "RSS items" in the "Blocks" library on the right and drag & drop it place. It contains a reasonable good start for content pulled from your site's RSS feed.

Content is pulled from you site's RSS with something MailChimp calls merge tags. They let you customize a campaign with strings pulled from the RSS feed. They work in the same way as tokens do in Drupal.

Two sets of merge tags are described in the MailChimp knowledge base:

1. RSS Merge Tags
2. Feedblock RSS Merge Tags

The difference is that a feedblock channel tags pull in content from your blog as a whole, while the RSS merge tags only pull a single item. In this case study we shall use a feedblock channel to pull five items.

If you use more than five feedblocks in a single campaign, you may not be able to preview your campaign in Mailchimp. We recommend you send a test email to yourself instead, or use fewer feedblocks to preview your campaign before your send.

This case study will only use a few of the merge tags that are available.

To alter the RSS item block, you first hover over the text to activate it. Then click the pencil icon to edit. The edit arrea is on the right. It comes with some presets, and a "Custom" option.

For the presets, click "Show markup" to see the markup. Below is the markup for the "Excerpts" preset. It cannot be edited.

Excerpts:
*|RSSITEMS:|*
<h2 class="mc-toc-title"><a href="*|RSSITEM:URL|*" \
  target="_blank">*|RSSITEM:TITLE|*</a></h2>
*|RSSITEM:CONTENT|*
<br />
<a href="*|RSSITEM:URL|*" target="_blank">Read on »</a><br />
<br />
*|END:RSSITEMS|*

In this case study, we want to display our news five most recent newsletter posts title, the featured image, and the trimmed body. We'll tell MailChimp we're going to do this totally custom, so we'll use the FEEDITEM merge tags. The following tags shall be used:

*|FEEDBLOCK:https://examle.com/views-rss-feed.xml|*
*|FEEDITEMS:[$count=n]|*
*|FEEDITEM:TITLE|*
*|FEEDITEM:AUTHOR|*
*|FEEDITEM:DATE|*
*|FEEDITEM:IMAGE|*
*|FEEDITEM:CONTENT|*
*|FEEDITEM:URL|*
*|FEEDITEM:TWITTER|*
*|END:FEEDITEMS|*
*|END:FEEDBLOCK|*

MailChimp expects the following pair to open an close customized formatting for individual RSS items: *|FEEDBLOCK:…|* *|FEEDITEMS:|* … *|END:FEEDITEMS|* *|END:FEEDBLOCK|**, so we place it before and after the other FEEDITEM elements. The mapping between the MailChimp Feedblock RSS merge tags and the XML generated by the views RSS feed is as follows:

• *|FEEDITEM:TITLE|* uses the contents of the RSS tag <title>.
• *|FEEDITEM:IMAGE|* uses the contents of the RSS tag <media:content>.
• *|FEEDITEM:CONTENT_TEXT|* uses the contents of the RSS tag <description>.
• *|FEEDITEM:URL|* the URL to the content, for "Read more" links. This link to your website as a whole, or node source URL. Uses the contents if the HTML tag <link>.

If you look at the XML that is output from our Views RSS Feed, you will see that the fields set set up in the first part of this case study use those exact tags.

To be able to edit the block, select "Custom" for the pulldown menu. To see source, click on "<>". For this case study, replace the default markup with the following:

*|FEEDBLOCK:http://example.com/views-rss-feed.xml|* *|FEEDITEMS:[$count=5]|*
<h2 class="mc-toc-title"><a href="*|FEEDITEM:URL|*" \
  target="_blank">*|FEEDITEM:TITLE|*</a></h2>
<em>By *|FEEDITEM:AUTHOR|* on *|FEEDITEM:DATE|*</em><br />
*|FEEDITEM:IMAGE|*
*|FEEDITEM:CONTENT|*<br />
<a href="*|FEEDITEM:URL|*" target="_blank">Read in browser »</a><br />
*|FEEDITEM:TWITTER|*<br />
<br />
*|END:FEEDITEMS|* *|END:FEEDBLOCK|*
<br />

Guidelines:

• MailChimp: About using templates
• Mailchimp: Guidelines for email campaign design

Click "Save & Close".

To preview the campaign email, click on "Preview and Test" at the top of the page, and select "Enter Preview Mode".

Hover over any links visible in the preview to make sure they are linking to the correct place. Also make sure they are absolute links.

To exit preview mode, click on the × in the upper right corner of the page.

When you think you're done, click on "Next".

This will take you to the final step where MailChip will review the template you've created. If something is wrong, you will be told, and there will be a button (Resolve) that take you back to the step where the problem can be resolved. In the screen shot below, the problem is that some placeholder text is still present in the template.

If nothing is wrong, the headline for the final step of the wizard will be “You're all set to send!” and all items in the feedback form will have checkmarks on a green or yellow background.

Now, there will be a link at the bottom right corner of the screen that lets you activate the campaign. If you don't want to activate yet, you should instead select one of the options under “Save And Exit” in the top left corner of the screen.

The preview option for MailChimp seems to be cached. If you change your feed, you may not see the changes when previewing. To make sure MailChimp isn't displaying the cached version of the feed, change the feed URL in your view, and then update the URL in the RSS feed setting for your campaign.

Source: Share your blog posts with mailchimp.

Final word

After you've created a campaign, you can then modify your feed and the MailChimp email template until you are happy with it. You can then activate it. To modify an active campaign, you first need to pause it.

---

Last update: 2020-10-15 [gh].