Back to Blog

Custom Newsletter Templates for Client Email Campaigns

Author

(Another reason to love Campaign Monitor)

This morning we discovered just how powerful and flexible the Campaign Monitor Template system is for enabling clients to craft and send their own Newsletter or Email Campaigns through the system. Using their proprietary Template Tags, you can customize virtually any section of an Email Campaign template you want while making higher level elements such as the overall structure, branding and footer elements locked through the system.

Here’s an example of a template that’s fully editable by a client in our system:

custom-newsletter-2

Everything you see from beneath the logo to the Salutation is editable, including the hyperlinked image in the right column.

Here are a few helpful tips on how we created it:

The Main Newsletter Title:

The main title is simply a Heading 1 Tag with the following inside of it:

<$title link=’true’ default=’Enter Title Here’>

Repeating Content Blocks:

In Campaign Monitor, content blocks consist of a Repeater element with other elements nested within such as headings, images and paragraphs. In this case, we have a Heading 2 tag, a Paragraph beneath it. In other templates, we’ve included the ability to float an image to the right of the paragraph. In this case, we’ve inserted a “Clearing” div above each repeated block so that every content block you add clears the right-aligned image and starts underneath it.

Here’s some sample code:

<repeater>
<h2><$title link=’true’ default=’Enter Body Content Title’$></h2>
<$description default=’Enter Body Content’$>
</repeater>

The coolest thing about these proprietary tags is that the tags that say ‘Enter Body Content Title’ or ‘Enter Body Content’ can be changed to anything you want so the more you extend the template for clients to work with, the more you can guide them by customizing the headings they see when inputting their content.

Single Images:

The most basic form of allowing a client to upload an image is simply to use this tag:

<img src=”<$imagesrc link=’true’$>”>

Now, in the event you wanted to lock the width, apply a border, align it or margin it, you can add on parameters to the image tag like so:

<img src=”<$imagesrc link=’true’$>” width=”200″ align=”right” border=”0″ style=”margin:10px;”>

Once you start playing with these tags inside of Campaign Monitor, it becomes clear that you have access to a great deal of flexibility for custom templates.

View a full list of Campaign Monitor Template Tags.

Author Alex Fedorov

Alex is a strategic thinker with a gift for information architecture, known for his ability to wireframe complex workflows and multiple states of applications at the speed of light. He is passionate about clean, data-driven design.

More posts from this author

How we work Process

Product Hero Talin Wadsworth