User Manual Contents
Digicola - Premium Wordpress Theme

Thank you for purchasing Our Email template.

If you have any questions that are beyond the scope of this help file, please feel free to send me an email ,and a support forum will coming soon!

Thanks so much!

1. Template Usage Instructions

1.1 General introduction

Using Template builder to creat your own pages.

The Template includes many prebuild structure layouts and color schemes. please use Template Builder to get your email page.

You can get  'inline-css html version' , 'mailchimp version' and 'campaignmonitor version' of every page,

With Best Email Template Builder, Very easy to creat your own email page.

Compatibility

I have tested in Mailchimp Inbox Inspector ( using litmus ) on this template and made a list of supporter clients and services: Compatible with all major email clients and sites: • AOL Mail • Gmail • Hotmail • Yahoo! Mail • iPad Mail • Symbian • Windows Phone7 • Android 2.3 4.0 • iPhone mail • Outlook.com • Thunderbird 3.0 • Lotus Notes 8 • outlook 2003,2007,2010 • Apple Mail 4 5 6 • Windows Live Mail • Outlook 2011 on Mac OS…

Using PSD files to design your own elements for your pages.

I have done several PSD files of the templates, you can use them to edit the original elements of the template and change the colors and shaps of them, View more information here.

1.2 Html structure

Inline CSS version strcture pages :

You can find inline css prebuild layouts strcture file ( named like *-inline.html format ) in every theme folder.

Mailchimp version pages:

You can download Mailchimp version email page.

CampaignMonitor version pages:

You can download CampaignMonitor version email page.

you can see the guide of how to use template builder here.

1.3 File structure

1.3.1 In your template zip file:

file structure

1.3.2 Each theme comes with this file structure:

The template pages are in the [html] folder.

version

All images are in the images folder. For each layout you get prebuild different html layout files and diffrent structure file and one all moduls in one pages:


1.3.3 PSD/PNG Files

The PSD files and PNG files are in the [psd_png] folder.

psd-files

All PSD files and PNG files are in the folder.Click here to view more details to using the PSD files.

1.4 How to start

1.4.1 Install the Template Builder

Click here to see the installation guilde...

1.4.2 Using Template Builder to get you own pages

Click here for more details...

1.4.3 Send Campaign in Mailchimp/Campaign Monitor or using inline-css version to send your email campaign

Click here for more details...

1.4.4 Using PSD source file to Design your own theme

Click here for more details...

2. Template Builder Installation

2.1 Installation Guide

Very easy to install

Install the builder is very easy, only thing you should do is to upload the right folder into your web server, then you can use it.

2.2 Installation steps:

step1--> Find a public php server (e.g. bluehost/hostgate/linode....)

step2--> Host it on your own webspace ( Template builder need php server )


Upload both   [ digith_template_builderand  [ html ]   folders  into your webspace.

You can do this via a FTP software, for example, creat a folder named [ newsletter ] in your server, and then upload the 2 folders(  [ digith_template_builder ] and [ html ]   ) into the [ newsletter ], like bellow:

step3-->Visit your template builder to creat your own page

Now you can visit the template builder to creat your own page, the path will be [ http://youruploadpath/newsletter/digith_template_builder/index.html ], make sure your web server support php file.

Ok, you get it works, so easy, please enjoy it!

If template builder can not work , please click  FAQ to see the help file.

3. Template Builder Using Guide

3.1 All function menu buttons

Click Left sidebar Menu to show the function areas.

Click to Show Prebuild layouts, you can click tab: Theme Switcher to read more!
Click to Show Modules, you can click tab: Choose Modules to read more!
Click to Show Color Setting area, you can click tab: Color Seeing to read more!
Click to Show BG&Redius Setting area, you can click tab: Choose Modules to read more!
Click to Show Download area, you can click tab: Choose Modules to read more!
Click to Show Copyright area, you can click tab: Choose Modules to read more!
Click to Show Guide Menu area, you can click tab: Choose Modules to read more!




Top Bar function Menu.

You can view all my email templates by click the drop menu area.

Click the small device icons to see the responsive effect.

You can choose the lable to change the builder theme.

3.2 Prebuild Themes and Layouts

See the Prebuild Layouts

Click the number lable to see the prebuild layouts, then you can change modules, colors, and bg textures and urls to creat your own layouts , note: do not use the prebuild layouts html page to send your email, because the prebuild layouts page do not use absolute url for the images.

See the Prebuild Themes

Click the theme color lable to see the prebuild color schemes, then you can change modules, colors, and bg textures and urls to creat your own layouts , note: do not use the prebuild layouts html page to send your email, because the prebuild layouts page do not use absolute url for the images.

3.3 Choose Modules to Creat your Own Layout

You can Add Modules by Click the Module Imgs

Click the itmes can add the Modules to the page window, and if you clear all the modules , please use click to add modules, do not use drag, this is because click can put the module into the proper position of the email page.

You can Add Modules by Drag the Module imgs

Drag the module imgs into the page window will add the modules, and you can sort and duplicate and delete ,even you can clear all modules in the page window, pls click the Operate the Moduls directly tab to see the guide.

if you Clear all the modules, please using click the module items to add modules, , this is because click can put the module into the proper position of the email page.

3.4 Edit the Color Scheme of your layout

Bg and Border colors / Title Fonts color / Fonts color

Top bar / Header / Modules / Page BG / Page FG / Border, you can change every editable color to match your need. Title Color and Fonts Color can edit too!

Color change

Click the color/title will show the color drag circle, You can drag the focus lable or input color value to change the color, do not forget the '#'.

3.5 Edit the Background Textures/Imgs and Border Radius

Background Textures

Digith Tempate builder integrated 400 textures to match your need, you can click the small thumbnail img to add texture to your email, and sure you can choose none to cancel the bg.

Background Url

You can input url for the background, note: please input the right url for the img.

Divider Height Value

You can drag the Slider to change the value to change the divider height.

Border Radius Value

You can drag the Slider to change the value to add or change the radius effect for the button or other prebuild elements.

3.6 Change Google fonts API in realtime

Copy your google fonts API above and setting your favorate font family and font weight

3.7 Top Bar - Please try the responsive effect on Mobile devices

Click to see the responsive effect.

3.8 Edit Layout

Click [ Edit Layout ] button to edit layout

You can Sort / Drag / Delete / Duplicate Modules.

3.9 Edit Content

Click [ Edit Content ] button to edit content

CKeditor has been Integrated in the Template Builder

3.10 Page Window - Move mouse on the modules will show the lables

Delete the modules / Duplicate the modules / Clear all Modules

3.11 Project Manage

You can [ save ] project and [ Load ] it to edit it any time.

Note: Please do not using project file to send email, please click the download button in the left sidebar of builder, choose the page version and click the red download button to get your final email page.


3.12 Download the Page Which you Created

Preheader can increase your click through

Preheader texts can increase your click through rate from your target clients. Only display as summary in the email clients, sure you can leave it blank.

Click the download button in the left sidebar and Choose which version you want

Inline-css version / Mailchimp tag integrated version / CampaignMonitor tag integrated version

Click the red download button to get the page

Click download will export the page.

3.13 See All the templates of Digith Studio

4. Send Campaign in Mailchimp or Campaign Monitor

4.1 Using 3rd party service

I recommend using one of the following 3rd party services to send campaigns - they are professionals, they know what they are doing, they guide you, they give clients access to live statistics and they are affordable.

1. MailChimp: http://www.mailchimp.com/
2. Campaign Monitor: http://www.campaignmonitor.com

These options above are not the only companies offering sending services, and strickly speaking you do not need to use them - but they are recommended and I do not earn money from you using these services, and I am not affiliated with any of them in any way.

5. Design your own theme

5.1 Elements

» Using elements.psd to modify the icons and other elements.

» Using banner.psd and header-banner.psd to modify the banner effect.

» Using light.psd and light-full.psd and dark.psd and dark-full.psd to modify the modules

5.2 Add a custom color

Modify the color value:

- If you need your own color follow these steps: Get the hex value of your color , Created your layout , then download the page, and you can edit the color value by using some editor ( e.g dreamweaver, notepad++...)

- Using Template builder to set the color in realtime.

6. Sources and Credits

I used many images and free icons in this email template.

6.1 Images

Images by flickr.com,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30 ,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48, many thanks to the photo authors!

6.2 Textures

Textures by subtlepatterns.com

6.3 Icons

Free icons by:Free Vector Web Icons,Entypo Glyph Set

6.4 Google Web Fonts

Free Google Web Fonts : Open Sans

7. FAQ

7.1 Project File can not Upload into the page window or can not download the email page?

About the folder permission

Please see the bellow screenshots of the folder digith_template_builder, and find the [file] folder under the server/php, then use some FTP software to connect your webspace, give that folder a permission like bellow, please do not worry about the security of your webspace, only .html file can be upload into your server, and the file will be delete Immediately after the page loaded into the main window.

folde

About the Php Server ( page can not download)


Setting the php.ini file

Open the php.ini, and find "file_uploads", make sure the value is " on ", and can setting other value like bellow:

max_execution_time = 600
max_input_time = 600
memory_limit = 32m
file_uploads = on
upload_max_filesize = 2m
post_max_size = 32m

7.2 Content Can not edit or CKeditor toolbar display wrong of some module?

Content can not edit

just Click the edit content button above the page window again before you refresh the page.

CKeditor toolbar display wrong of some module

just click the [ edit layout ] button above the page window and drag/click/duplicate the module to creat a new one, then click the [ edit content ] button, you will find now the CKeditor toolbar will works ok for this module, and now you can delet the module which toolbar not work.

7.3 Why i copyed and pasted some text into the page, the text display wrong?

Please use paste as plain text for copy and paste

This is because the text you paste to the page may has its own style, so , i suggest use the [ paste as plain text ] tool of the CKeditor , you will find every thing will ok.

Ok,enjoy it!

8. Some Import Things Need to Remember

8.1 Useful Links for you

HTML emails are not the same as HTML pages, sure you can view them in the browser and they appear fine, email clients are basically all different, some remove things, some don't show things etc It is a great idea to read up on some guidelines, and good practices before you jump in - here are some useful links for you:

NetTuts Article on HTML Email Tips
HTML Mail resources and guides at Campaign Monitor
MailChimp Articles and Resources
Email CLIENT TIPS & TRICKS

Inline CSS Tools

Premailer
Mailchimp


8.2 Tips for Your Email Campaign

8.3 About the Email Layout Width

The width of an email campaign is very important. You will see that they are "thinner" in width than webpages for a real reason - email clients have a preview window that is generally not as wide as a browser window - guidelines differ wildly, however anywhere between 500 - 650 is acceptable - these templates are all 620px.

8.4 About the media file

Do not attempt to place flash media or video in your emails - most email clients will not display this information at all. Also javascript will be disabled no doubt so no fancy drop downs, menus or galleries.

▲ Top