In This Article:

    HTML Sources to Create Email Templates

    In This Article:

      Overview

      To create a new email template, you can use the Salsa Email Template tool.  If you're building an email template, however, you'll need to enter HTML into the tool.  If you're highly skilled with HTML, you can write original code yourself, or you could hire a professional web designer to create write the HTML for you.  NOTE:  Creating email templates is a specialized skill and not everyone with HTML knowledge is ready for this task.

      If you're not ready to write your own HTML and don't have the budget to hire a professional web designer, there are several places where you can obtain HTML to paste into the Salsa Email Template tool.

      HTML Source Options

      Salsa's Email Template Generator
      Transferring an Email Template from Another Provider

      Training Video

      Short video with an overview of the process is here for reference. Detailed feature documentation below.

      HTML Source #1: Email Template Generator

      The email template generator is a user friendly tool to help you intuitively create your own mobile-friendly email templates.

      To create your own email template:

      Launch the Email Template Generator

      Select Template

      Select one of three standard email templates to further customize.

      1. Basic - A single-column template with a built-in alert and call to customizable call to action buttons
      2. Sidebar Hero - A two-column, image-intensive template
      3. Newsletter - A single-column newsletter template with two uniquely styled article listings

      select_template.png

      General Settings

      Customize the following elements of your email template:

      • Font Stack - Select your preferred font collection
      • Text Color - Select the color of your font
      • Accent Color - Customize the color of accent items in your design including segment lines between content fields and the background color behind alert styles
      • Text Size - Use the slider to change your font sizes

      general_settings.png

      Note:  For color selection tools, you can select a color from the color pallet or enter a enter the correct hexadecimal value from your organization's style guide.

      colors.png

      Header Settings

      • Header Image URL - Upload a 300x80 pixel image into Salsa, following our instructions.  Once you've uploaded the image, copy and past the image URL into this field.
      • Header Image Alt - The alternate tag is displayed to users in the event that the image itself cannot be displayed, or if a user hovers over the image.  It is also used by E-Readers for the visually impaired.
      • Tagline - Type a short description or tagline for your organization or your email.

      header_settings.png

      Social Links

      Copy and paste links to your organization's social media accounts here.  The social media icons will automatically be inserted into the email template and will link to your social media pages.  Any social network links which are left blank will not appear in your email template.

      social_links.png

      Footer Settings

      • Footer Background Color - Select a color from the color pallet or enter a hexadecimal value from your organization's style guide.
      • Footer Text Color - Select an appropriate color for footer text.  Increased contrast between the background color and the text color will improve readability.
      • Footer Contact Information - Type the contact information you'd like to appear in the footer.  You may use line breaks like <br> to create spaces in this text.
      • Unsubscribe URL - Paste the link to your organization's unsubscribe page.

       footer.png

      Generate Your Template

      Review your template settings to ensure accuracy and completeness and then click the Generate button to copy and paste the HTML into your Salsa Email Template Tool, or download the HTML file.

      generate.png

      HTML Source #2: Transferring an Email Template from Another Provider

      If you have had an email template developed for another provider and would like to transfer that HTML into Salsa, follow these instructions.

      Step 1 - Grab your old source code

      • Copy the old source code of your old email template
      • Paste it into Notepad, TextEdit, or another plain text editor (NOT Microsoft Word)
      • Need help getting to the source code? A lot of other providers have WYSIWYG editors similar to Salsa's editor. To access the source code for an email template in Salsa you would click the Source button in the WYSIWYG editor: 

      source_code.png

      Step 2 - Download all images from the old template

      Download all of the images used in your template and save them so you can upload them to Salsa. You should save them on your computer because you will be uploading them to Salsa in step 4. You must move these images to Salsa for hosting, as they may no longer be available once your subscription with your old provider stops.

      Step 3 - Create a new template in Salsa and insert the old source code

      Create a new template by pasting over the code which is already in the HTML Content. Just paste over the code that is already there. Keep in mind you will need to put the Salsa template tags back in to your template source code -- info on where to place those can be found here. Once your template code has been added to the source view click the Save button. You may see the images from your old template after you save, but you're not done yet: you need to move those images over to Salsa as well. 

      Step 4: Transfer template images to Salsa

      After you saved the template you should see a visual representation of your template, once you're out of Source mode. To replace the images, simply right click on an image you need to update and choose Image Properties:


       

      Enlarge 


      From here, you can upload each picture that makes up your old template to Salsa:


       
      Enlarge 

       

      Once you have uploaded an image you will find it in the list and you can select it. This will update the image URL in your template and you have successfully updated this image. You will need to perform this update for all images in the template to make sure that they will continue to be visible after your switch to Salsa. Be sure to include images like borders and banners. Be sure to send yourself test messages of any email blast before sending it out to your supporters.

      Was this article helpful?
      1 out of 1 found this helpful
      Have more questions? Submit a request

      Comments

      0 comments

      Please sign in to leave a comment.