Thank you for purchasing EVOLIA HTML Email templates. If you have any questions that are beyond the scope of this help file, please feel free to email via user page contact form here(you need to login first). Thanks so much!
All flat social media icons are not included in this package do to author's copyright and distribution rights, you can download all the icon for free from User10.com at their blog page Flat Social Icons.
For easy editing, EVOLIA email template is divided into several sections which we from now we call it module, each module is wrap with square bracket like example below.
<!-- [MODULE_NAME] --> // opening module ... html tag and module content ... <!-- [/MODULE_NAME] --> // closing module
To edit module content, find content_name (image, title, sub_title, text) comment wrapped in square brackets, then edit the content between opening content_name comment and closing content_name comment.
<!-- [content_name] --> // opening content_name ... contents ... <!-- [/content_name] --> // closing content_name
Each text is wrapped with <td> tag, and because email programs is not the same as today browser all styling was made inline. To change font-family, font-size and color find style attribute at td that is wrapped the text.
If you're not using 3rd party services to send mail like Mailchimp or Campaign Monitor then you have to host the image at your server. Your images and any other files that you are referencing need to exist on your web server. All the current images are called from the local folder called "img". You will need to ensure that you change the references to your images in the html and place your images on your server before attempting to send a campaign.An example would be:
<img src="img/main.jpg" alt="" class="img_fix" style="border: 0;outline: none;text-decoration: none; -ms-interpolation-mode: bicubic;display: block;width: 100%;height: auto;">
You would need to change the img src to your specific location of the image file on your server - like this:
<img src="http://www.your_domain.com/img/main.jpg" alt="" class="img_fix" style="border: 0;outline: none;text-decoration: none; -ms-interpolation-mode: bicubic;display: block;width: 100%;height: auto;">
Modules like HEADER and NEW_COLLECTION has a background image, to change the background image find background property, then in the background properties change the default image to yours. And then in v:fill tag find src attribute change the default image to yours.
<!--[HEADER]--> <!--[if gte mso 9]> <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:386px;"> <v:fill type="tile" src="img/header.jpg" color="#DFDFDF" ></v:fill> <v:textbox style="v-text-anchor:middle" inset="0,0,0,0"> <![endif]--> <table class="ev-header" cellpadding="0" cellspacing="0" border="0" width="100%" background="img/header.jpg" height="386" style="border: 0; mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-image-width: 0;outline: 0;border-image-slice: 0;border-collapse: collapse; background-repeat: no-repeat;background-position: center;"> ... <!--/[HEADER]-->
The backgound image size for HEADER is 600px X 386px and for NEW_COLLECTION is 600px X 408px.
Currently Mailchimp, Campaign Monitor, and myMail do not support background image to change in the editor, you have to change it localy first before uploading to the server. We recommend to override the default image with yours using the same file name as the default, so you don't have to edit the html code of the background.
In order your image to be display correctly in high ppi (326ppi and above) display or usualy they call it retina display you need to create the image twice the size from the default size, if not the image would be display blurry like example below.
For example the logo image above default image size is 160px width and 25px height. You need to create it two times its size to 320px width and 50px height (remember keep it constrain proportion), but in image tag set the width to its default size do not change it and do not add height attribute, because the browser will automaticaly calculate image height.
<!-- logo --> <img src="http://www.your_domain.com/img/logo.png" width="160" // keep the width DO NOT change it alt="" style="border: 0;border-image-width: 0; outline: 0;text-decoration: none;-ms-interpolation-mode: bicubic;"> <!-- /logo -->
For easy content editing in inline css, the modules is seperated into several files. The main files is 00-main.html. Copy the all html code in each file after you edit the content then paste the code to 00-main.html file between the opening comment <!-- module_wrapper --> and closing comment <!-- /module_wrapper --> like example below.
<!-- module_wrapper --> paste the module code here <!-- /module_wrapper -->
For example if you want to add MENU module, open 01-preheader.html file, change the content after that copy all the code then paste it to 00-main.html in area between <!-- module_wrapper --> and <!-- /module_wrapper -->.
EVOLIA Email Marketing Template is support Mailchimp template language. You can easly edit text, link and change image in Mailchimp editor.
First you have to create a campaign, follow this step if you have not done so.
On the design step, select My Templates then select the theme you've uploaded.
To edit text hover your mouse to text area you want to edit, usually it is wrapped with dashed border box then click the box or Edit button that's appear.
To editing an image hover, your mouse to an image you want to edit, then click Edit button that's appear in the screen.
When editing a button label, before adding link to the label apply the style Button label first from drop down style menu in edit mode.
The first 2 modules that will appear in design mode is Header, and Footer. To add other module at the bottom section of Icon and Picture clik the plus button, another module of Icon and Picture will appear.
In dropdown menu at thebottom section of Icon and Picture that is duplicated select other module that you want to add to the email design.
EVOLIA Email Marketing Template is support Campaign Monitor template language. You can easly edit text, link and change image in Campaign Monitor editor.
Click Create a new campaign button, enter the required field in the first step. In the second step select Use one of my templates then select the template that you've upload.
To edit text and image click Edit button.
To add new module click Add New dropdown menu on right side then select module you want to add
What is MyMail anyway, it's a wordpress plugin developed by revaxarts an elite author of Envato's. For more information about MyMail you can read it here or purchase it here.
In Newsletter sub-menu click New Campaign. In Create a new Campaign page if you did not set bidadari enhanced to be the default template, you can change it in Base menu under Template section. To add module simply click the +Add Module button and choose the module you want.
To change the template colors you can change it in the Option section.