Inbox view on the iPhone with snipped text

With a simple trick it is possible to include a special teaser text in the email that will be use for the snipped without actually being displayed in the email itself. This can be achieved by adding an invisible DIV-element with the teaser text as first element of the HTML body.

<div 
style="display:none;visibility:hidden;color:#ffffff;font-size:0px">
iPhone-applicatie Tripolis gelanceerd | Hoe bepaal je een
Twitter-strategie voor je bedrijf? | Tripolis Gold sponsor
Nationale E-mailmarketing Conferentie</div>

As Gmail ignores the inline style sheet parameters for display and visibility, it is necessary to set the font-size to zero to avoid any extra white-space. Tests have shown that other common email clients won’t display the teaser text when the email is being opened.

iPhone inbox view with teaser text

Both Gmail as well as the Apple Mail application on the iPhone are displaying about 90 characters of this teaser text. In Outlook the amount of characters depends on the width of the inbox list.

Outlook 2007 Windows with teaser text

With this simple change to your email template it is possible to add a teaser text with extra information or a call-to-action to increase the open rate of the email campaign.

This article was originally written for the August edition of the Tripolis Newsletter.

Bookmark It

Using Yahoo Pipes and Tripolis Dialogue to aggregate news in a weekly newsletter from Harald Walker on Vimeo.

Bookmark It

Managing subscribers
In order to get subscribers for the newsletter I used the new web-forms module in Tripolis Dialogue, which we just released last month. After specifying the database fields and the form details, I only had to add a bit of html with a subscribe form as widget in Wordpress.

For the confirmation mails during the registration process I used my own customized design, similar to the final newsletter design.  

In the last mail we send to confirm the successful registration I included a link to the last sent newsletter. This link appears to be very popular. 89% of the subscribers who opened the confirmation mail also clicked on this link since it was added.

Content syndication
Since the purpose of the newsletter was a weekly digest without causing too much extra work, I wanted to automate the process as much as possible and pull in the content directly from Wordpress. In Tripolis Dialogue we can create articles based on a RSS or ATOM feed or include any kind of XML feed, and process it directly in the newsletter template. As I didn’t want to duplicate our blog posts I choose the second option. The newsletter has 3 sections: an introduction area, a main area for new recipes and reviews and a sidebar for comments.

Handling the comments was the easiest. Wordpress offers comments on blog post as RSS feed, which can be imported directly in the newsletter template:

<#assign commentfeed = xmlImporter("http://www.vegalicious.org/comments/feed/")>

Next I only wanted to display a maximum of 7 comments and in case of a very long comment trim it to 100 characters using standard Freemarker (the templating language we use in Tripolis Dialogue) functions for lists and strings.

<#list commentfeed.rss.channel.item as item>
<a href="${item.link}">${item.title}</a>
<#if item.description?length &gt; 100>
   ${item.description?substring(0,100)} (...)
<#else>
   ${item.description}
</#if>
<#if (item_index+1) = 7><#break></#if>
<hr size="1" noshade="noshade" />
</#list>

Dealing with the recipe and review posts was a bit more challenging. Wordpress can supply a feed per month, but not per week. So I had to use the category feeds, which include the 10 most recent posts (this is a Wordpress setting). In order to fetch only the posts of the last week I turned the number of feed items to display into a variable parameter of an article, which I can easily change per newsletter. The header and feed URL can also be customized in the same way.

Next I had to deal with the limitations of the RSS format. Our blog posts usually use one or more photos, an introduction, a list of ingredients, cooking instructions etc. An RSS item has a description with the summary of the post excluding any styling and the content of the post with the full html. For the newsletter I only wanted the text of the introduction and a thumbnail image. The images of the blog post are not available as individual elements in the RSS feed, so I extracted the image urls from the html using a regular expression. As sometimes the blog post already uses the thumbnail version of an image, an extra check was necessary.

<#ftl ns_prefixes={"e":"http://purl.org/rss/1.0/modules/content/"}>
<#assign htmlcontent = item["e:encoded"][0]>
<#assign images = htmlcontent?matches("(<img[^>]*?src=\")(.*?)(.jpg\".*?>)")>
<a href="${item.link}">
<#assign firstImage = images[0]?groups[2]>
<#if firstImage?index_of("150x150") == -1>
   <#assign thumbnail = firstImage + "-150x150.jpg">
<#else>
   <#assign thumbnail = firstImage + ".jpg">
</#if>
<img name="" src="${thumbnail}" border="0" 
width="150" height="150" title="${item.title}" alt="${item.title}" />
</a>

For the trimming the text after the introduction I wrote a small function in Freemarker which looks for the position of certain keywords in the post (”Yield”, “Servings”, “Ingredients”).
The publishing date of a blog post can be formatted with the built-in Freemarker functions for dates: ${item.pubDate?date(”EEE, dd MMM yyyy”)}

The final version of the newsletter uses 3 RSS feeds (more can be added) and has a custom article for an introduction.

The way back
For outgoing links back from the email newsletter to our food blog I used the Google Analytics support which is integrated in Tripolis Dialogue. This way I can relate web-site visitors directly to our weekly newsletter. The newsletter has been sent 3 times now, twice Saturday night and once on Sunday. Below you can see how this resulted in additional visits on the site. Looks like I have to experiment a bit more with the best moment for sending it.

In total this has been an interesting exercise for me. Although I’ve been working on implementations with customers for many years, that is still different from actually being in the customer role yourself. It gave me some new ideas for our product and it would be great if Wordpress would have more flexible content syndication like the blog posts of the last 7 days and images as RSS enclosure element.

Bookmark It

Next, I was looking at the usage of webmail clients like Hotmail and Gmail. About 17% of the email is being read online with a webmail client. Here Windows Live Hotmail is still dominating. Since Google’s Gmail was opened to the general public on April 1, 2004, it has gained a market share of 7.4%. Good old Yahoo Mail finished as 3rd with 6.2%.

Bookmark It