How to use ThemeForest email templates

Below is an example of how to use the excellent ThemeForest Airmail email template with this system.

  1. Look in the "templates/" folder, you will see two folders by default "blue" and "dark". These are the two default email templates that come with this system. We're going to create a new template for the Airmail theme so this system can use it.
  2. First make a new folder to contain the template, try to avoid spaces so name it "airmail" instead of "air mail".
  3. Copy the "img" folder from the Airmail theme into our new airmail folder. This will contain all the images used in this theme.
  4. Choose which Airmail variation you would like (for example: white/full-width.html) and copy that file to "airmail/template.html"
  5. You should now have this:
    "templates/airmail/img/" contains all the images in this theme
    "templates/airmail/template.html" contains the full template html file from the Airmail theme.
  6. Optionally, make a 100x100 preview jpeg and save it to "templates/airmail/preview.jpg" this preview will show up in the newsletter system. You can simply copy the blue or dark preview file if you don't want to create a new one.
  7. We now need to choose which part of the template we will edit each time we send out a newsletter.
  8. Open "templates/airmail/template.html" in your favorite html editor (eg: notepad) and cut the main content area out - then paste it into a new file called "templates/airmail/inside.html" - Important: you need to add {EMAIL_BODY} to template.html in the place that you cut the main content area from. This tells us where the main content will go each time a newsletter is sent.
    (in the Airmail theme - the main content table starts just after <!--BEGIN THE CONTENT--> and should end at the second last </table> in the file - your own theme may be different)
  9. You should now have something like this:
    "templates/airmail/img/"
    "templates/airmail/template.html"
    "templates/airmail/preview.jpg"
    "templates/airmail/inside.html"
  10. Now all the hard stuff is done :) there are some customisations that you can do:
    • To create an unsubscribe link, use this code: <a href="{UNSUBSCRIBE_URL}">Unsubscribe</a>
    • To create a view online link, use this code: <a href="{VIEW_ONLINE}">View newsletter online</a>
    • To insert the email subject automatically somewhere in the template, use this code: {EMAIL_SUBJECT}
    • To insert the date the email was sent, use this code: {SENT_DATE}
    • To insert the email address of the receiver, use this code: {TO_EMAIL}
    • To insert the email address of the sending, use this code: {FROM_EMAIL}
    • You can use the above to make a nice footer like so:
      This email was sent from <a href="mailto:{FROM_EMAIL}">{FROM_EMAIL}</a> 
      to <a href="mailto:{TO_EMAIL}">{TO_EMAIL}</a> on {SENT_DATE} |
      <a href="{UNSUBSCRIBE_URL}">Unsubscribe</a>
  11. You can always copy the default "dark" or "blue" templates and adjust them to suit your needs.