Skyline - Newsletter with Template Builder

With "My Template Builder" you can access the Template Builder without uploading the files to your webspace.

You don't even need a webspace!

1. Go to the "My Template Builder" website and enter your purchase code and hit the submit button

After you've submitted your valid code you can see all templates where you have entered a purchase code

You can now start using the Template Builder by pressing the "Template Builder" button of your desired template

Try it know:

mytemplatebuilder.revaxarts-themes.com

Each version comes with this file structure:

All images are in the img folder. For each layout you get 4 different html files:

• layoutname.html (is the normal file)
• layoutname_inline.html (is the normal file with inline CSS)
• layoutname_mc.html (is the mailchimp version)
• layoutname_cm.html (is the campaign monitor version)

Mailchimp and Campaign Monitor will inline your CSS before you send a campaign, so no need to have it here

I've included several psds and pngs with this theme (png_psd.zip). All pngs are fully editable fireworks png

For each version you get:

1. screendesign.psd
2. screendesign.png

The screendesign.psd and screendesign.png are layered designs of the template.

You can change the graphics that they match your needs. But don't change the size of the slices or the layout will maybe get messed up

To change a color use the boxes on the right an apply the style in the "properties"

Exporting Graphics

Export the slices into a folder and also check the html for hex color codes (#123456)

Preheaders are small phrases (up to 80 letters) which should help increasing your clickthrough rate. Many email clients display the first letters of an email in their preview area.

Preheaders are invisible in the normal email view and show up only in the preview pane of some clients

Examples

Outlook 2007 + 2010

Google Mail

iPhone

If you use Mailchimp or Campaign Monitor you can use there placeholder tags too!

Usefull resources

• A practical guide to email preheaders (Campaign Monitor)
• Fancier Pre-headers in your emails (Mailchimp)
• 5 Ways a Preheader Can Increase Response and Deliverability
• Better preheaders? Six ideas to consider

This Template comes with alot predefined colors. If you need your own color follow these steps:

1. Get the hex value of your color (I use as example the value 123456)

We have to setup the file structure:

1. Duplicate the folder 'version1' and rename it to 'version25'
2. If you would like to use only the Template Builder open all four files which start with 'all_'
3. seach for the old hex value 'F07800' and replace all with your new (e.g. 123456)

Now we have to add the new file to the Template Builder:

1. open the custom.js within the '_js' folder of the templatebuilder.
2. scroll down to colors and attach your hex value to the end position:

   colors = ['F07800','...','123456'];

3. do the same for the background color:

   bgcolors = ['F07800','...','123456'];

4. Save the custom.js

Make sure you upload all your files to your server

It's easy to make a custom Productbox *

* requires at least Photoshop CS2

1. open the productbox.psd within the 'png_psd' folder
2. double click on the 'front' layer
   
3. make your personal front layout
4. save it and go back to the productbox.psd
5. edit the 'right-side' layer with a double click
6. after saving go back to productbox.psd
7. Select the Crop Tool (C) and crop the image
   
8. click 'file' > 'Save for Web & Devices...'
9. for a 1/2 column reduce the width to 264px for a 1/3 column to 168px
   
10. save it into the img folder of your desired version

Don't forget to upload your files to your server

I've used the following images, icons or other files as listed.

• Social Icons by Picons
• Photo used: Toronto Skyline by elenathewise
• Font: Lobster by Impallari
• MacBook: MacBook Pro Retina Psd Mockup by Pixeden
• iPhone: iPhone 4s Psd Vector Mockup Template by Pixeden

Files are maybe not included because of the license

Once again, thank you so much for purchasing this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist. If you have a more general question relating to the themes on ThemeForest, you might consider visiting the forums and asking your question in the "Item Discussion" section.

Xaver Birsak – revaxarts.com