How can I use an html template (that I downloaded) in Gmail and/or in Mail?

In this tutorial you will learn the way to use Newsletter and Email templates in Gmail.

Newsletter and Email templates are HTML templates primarily created for MailChimp and Campaingmonitor email services. However, you can use them in Gmail as well.

To integrate a HTML template into Gmail, you should perform the following steps:

1. Open the downloaded template package on your computer and navigate to "newsletter/responsive" directory. Here you can see a index.html file and the "images" folder with sample images.

2. Open the index.html file with any code editor and select all the content of this file by using CTRL+A hotkeys on Windows (Control+A or Command+A on Mac).

   Then copy the selected content to the clipboard (by using CTRL+C hotkeys on Windows or Control+C/Command+C on a Mac).

3. Sign in your Gmail account and click the Compose button to create a new message.

4. In the text area of the appeared window type some sample text, like "**************". Click your sample text with the right mouse button and select Inspect Element or Inspect Element with Firebug option from the contextual menu. Then in the appeared inspector window find your typed text and replace it with your copied HTML code (delete the sample text and paste copied HTML code). See the screenshots below:

   

5. Close the inspector window and in the new message section your will see your HTML template with all the styles. Now you can specify your message subject and recipient and send your message.

   NOTE: To see images of your HTML template in Gmail, you should firstly upload all the images to some live server and then in the index.html file replace all the relative images links (f.e., images/pattern01.jpg) with absolute links (f.e., http://templatetesting.com/images/pattern01.jpg), that include the direct path to the needed image on your server.

You can also save your HTML message as an email template in Gmail and then use it anytime.

This is the end of the tutorial. Now you know how to use Newsletter and Email templates in Gmail.

Feel free to check the detailed video tutorial below: