If your idea of creating and sending an email campaign starts with using Word and then coping and pasting your content into an email client you’re doing it all wrong. I understand you’re not a web designer, coder, email marketing guru or techie, and you probably cringe when you see words like HTML, CSS and FTP. You also probably have no clue about how to create an HTML Email Template so that it will look good in all the various email clients that exist today,not to mention all the different handheld devices. That’s okay, this article will introduce you to an easy to use web application that will do all the hard work for you and leave you with a great looking HTML Email Template that you can use to copy/paste into your email client.
The folks over at Campaign Monitor have designed an HTML Email Template Builder for people who want to create great looking email templates without having to know any HTML or CSS. The Builder can be found at the following URL: http://www.campaignmonitor.com/templates/
1. Start by choosing an email template design layout.
You can choose from 4 different types of email templates. Simple announcement (1 column), Basic Newsletter (2 columns), Content Heavy Newsletter (3 Columns), and an Image or Product Gallery.
After you have selected your template you can immediately start modifying the properties of the template. On the left hand side there are menu options for changing the various elements of the template. Start with the Basics, and then you can change the Header, Content, Footer and for the more complex templates, the Sidebars.
You can upload your own background header image/logo, change font type, background color, text color, link color. All with the click of a button.
What’s also great is that your email template is designed to look great on mobile devices as well. So you don’t need to worry about recipients who prefer to read their emails on their handhelds.
You can change your own footer content such as street address, permission reminder as well as the colors associated with those.
Once you are done, you have the choice of saving your template and creating a Campaign Monitor account or you can download your template with all the images as a zip file to your local machine. You want to choose the option to download your template to your computer.
- After the file has downloaded, unzip the contents.
- If you chose to add any images to the template you will need to upload those images to the internet, such as your own website, Facebook account, or even http://www.imageshack.us which offers free online image hosting services.
- You then need to view the index.html file in the unzipped folder in your web browser, such as Firefox, Chrome, Internet Explorer, Safari, etc etc.
- Once the email template is loaded, view the source code of the document. Usually you can just right click in the white space of the page in your browser and choose View Source or View HTML Source.
- You need to copy all of the source code and paste it into a blank Notepad file, DO NOT USE WORD.
- Once the HTML and CSS code is in Notepad, you need to find any references to the image(s) you inserted into the template and replace them with the full URL of the image(s) you uploaded to the internet. If you don’t do this your image(s) will not display for your recipients. In notepad, you can choose Edit >> Find, and if you search for just .jpg or .gif if you used that file type, it should find the first reference to your image. You need to replace the <img src=”yourimagename.jpg” …. with the full URL of the image you stored on the internet…so it should look something like this… <img src=”http://www.yourdomain.com/images/yourimagename.jpg” …
- Once you have replaced all of the images in your template, you can copy the contents of the notepad file into your GoldMine Document Template Library as a new email template.
If you have questions about any of the steps involved with uploading your images to the internet or with replacing the references to the images in the HTML code in Notepad, please contact First Direct Corp. directly for assistance.
