Using Free Email Templates

With Email Marketing Pro, you can easily import almost any email template, as long as it’s saved as a web file (or .htm file, as it’s known in the tech world).

You can search the web for free email templates and you’ll find many that are ready for use under the Creative Commons License. You’ll find a lot of great designs that are free for commercial use, as long as you give props to the artist.

One of our favorites is http://freemailtemplates.com/. They offer both an HTML file to import, and a Photoshop file that you can edit if you have Adobe Photoshop (if you don’t, and you’re a ProMail customer, let us know and we can edit the text in the image for you).

Just make sure you link to the author’s website, in accordance with the Creative Commons License. FreeMailTemplates.com requires that you keep the link to their site, http://mailbakery.com/ in the footer of the email.

So, once you download a free email template from them, how do you use it?

If you’re using the free version of Email Marketing Pro, it takes just a little bit of work and a little bit of knowledge or willingness to learn a couple of things about HTML code, which is the code read by web browsers to display a web page or HTML email. The basic steps, which we’ll break down for you in detail are 1) Download the template 2) Edit the code for the images in the template 3) Upload the template to your site, and 4) Open the template in the new message window of Email Marketing Pro.

For ProMail customers, we’ll do it all for you and host the template on our site.

To use a free template in Email Marketing Pro, follow these steps:

1) Download the template. It will usually download as a .zip file
2) Extract the zip file and open the folder.
3) Look for an htm file in the folder, usually called index.htm
4) Right-click index.htm and open it in Notepad.
5) In Notepad, do a text search for the keyword “img.”  “Img” is just HTML code for an “image.” This will show you where in the file you’ll need to add a link to the images that are in the free template.
6) Here’s the crux of the process:  We’re going to replace the image code so that it links to your own website. In techie talk, we’re editing the “src” attribute of each “img” element.  In html, which is the code understood by web browsers, “img” stands for image, and “src” simply stands for the source of the image, or the web address where the image is stored.

(Later, we’ll upload the images and template to your website. Free templates don’t let you link to the images on their site because spammers might use them and suck up all their bandwidth.)

So, to reiterate, we search in Notepad for “img” and replace the code in the “src” attribute of each image.

Example: If the code says “<img src=”images/header.gif”, change this to <img src=”http://www.example.com/templates/images/header.gif.

The part that says “http://www.example.com/templates/images/header.gif”  represents the path to your website where you’re going to host the images. I recommend creating a folder called “templates.”

Are you lost yet? If so, and you’re a ProMail customer, find us a free template and we’ll edit it for you.

7) Save the file. Then, upload the whole folder to your web server, using an FTP client like Filezilla.
\8) Now, navigate to the template in your web browser, using an address like “http://www.example.com/templates/index.htm.” Note, that we’re navigating to that html file that we just edited in Notepad.
9) Copy the web address, once you’ve verified it’s pointing to the file correctly.
10) Now, here’s the cool part. In Email Marketing Pro, click the “open folder” icon in the New Message window. Simply paste in the web address of the free email marketing template you just edited and it will open in your New Message window.
11) Now, you can edit the template as needed.