MISSIO: Professionally designed, extremely user friendly, attractive & powerful site template.
Check it outDo You Need Support?
If you have any questions that are beyond the scope of this help file, please feel free to contact us with the links below. Please don't forget to provide your website link.
Contact Form Discussions PagePlease remember...
- Requests sent during weekends or on holidays will be replied on business days.
- We only provide support for fixing bugs and respond to questions regarding the features included in the items.
Do You Need Customizations?
If you need custom modifications regarding HTML and CSS, please contact us so we can discuss. Customizations are done within 1-2 business days starting at $30 (Safe Payments through Fiverr with credit card or PayPal).
Contact FormPlease remember to...
Identify and describe in detail the modification you would like to have. Any screenshots, screencasts, URLs are appreciated.
Full & Box Layout
The default layout of the template is full-layout. To turn your pages into boxed layout, you will have to change the body class name from full-layout to box-layout on all HTML files.
Full Layout
<body class="full-layout">
Box Layout
<body class="box-layout">
Retina Images
In order to display a high resolution image on devices with retina display, you need two versions of the image. One with regular size and another with twice its size. The high resolution one should have the exact same name with @2x
at the end.
logo.png
- Default logo (e.g.: 100x100px)
[email protected]
- High resolution logo (e.g.: 200x200px)
Example
<img src="#" srcset="style/images/logo.png 1x, style/images/[email protected] 2x" alt="" />
Color Scheme
There are 9 color options: blue
, brown
, green
, lime
, navy
, orange
, pink
, purple
and red
the default being blue. To change the default color scheme, edit the color CSS file name in each HTML page.
Example
<link rel="stylesheet" type="text/css" href="style/css/color/blue.css">
Changing Fonts
To use a different font, copy the font link from its Google Fonts page and paste it before closing head tag in your HTML files.
Then add the font name to your CSS styles in style.css.
HTML
<link href='https://fonts.googleapis.com/css?family=Work+Sans:400,500,600,700,800,900,300,200,100' rel='stylesheet' type='text/css'>
CSS
.classname { font-family: 'Work Sans', sans-serif; }
Parallax Effect
The basic structure of the sections that have the parallax effect is shown on the right.
Please make sure you enter correct width and height values of the images you use in the parallax sections.
HTML
<div class="parallax" data-parallax-img="style/images/art/parallax1.jpg" data-parallax-img-width="1920" data-parallax-img-height="1123"> <div class="container inner"> Parallax Content </div> </div>
Revolution Slider
You can find detailed information about Revolution Slider elements and options here.
Contact Form
Configuration
Open contact/vanilla-form.php and specify recipient's e-mail address by filling emailRecipients
and emailSender
options. These email addresses will receive all form inquires/messages.
emailRecipients
- Recipient's e-mail. To this address, the email will be sent. You can provide multiple e-mail addresses comma separated.
emailSender
- If is not empty it sets a header From in e-mail message (sets sender e-mail). Note that some hosting servers can block sending e-mails with custom From field in header. If so, leave this field empty.
/** * Recipient's e-mail. To this e-mail email will be sent. * E.g. Single recipient * 'emailRecipients' => '[email protected]', * * E.g. Multiple recipients * 'emailRecipients' => '[email protected], [email protected]', */ 'emailRecipients' => '[email protected]', /** * If is not empty it sets a header From in e-mail message (sets sender e-mail). * Note: some hosting servers can block sending e-mails with custom From field in header. * If so, leave this field as empty. * E.g. Single recipient * 'emailSender' => '[email protected]', */ 'emailSender' => '[email protected]'
Custom messages
The example on the right shows how to change success and error messages.
style/js/script.js
/*-----------------------------------------------------------------------------------*/ /* VANILLA /*-----------------------------------------------------------------------------------*/ var myForm; myForm = new VanillaForm($("form.vanilla-form")); /* Add the lines below */ myForm.dict.sendSuccess = "Thank you for your message!"; myForm.dict.sendError = "Oh no... something went wrong. Please try again."; myForm.dict.httpRequestError = "[%s] Are you running it with enabled PHP parser?";
Translations
The example on the right shows how to translate the contact form status messages into a different language.
style/js/script.js
/*-----------------------------------------------------------------------------------*/ /* VANILLA /*-----------------------------------------------------------------------------------*/ var myForm; myForm = new VanillaForm($("form.vanilla-form")); /* Add the lines below */ myForm.dict.sendSuccess = "Dziękujemy za wysłanie wiadomości!"; myForm.dict.sendError = "Oh nie, serwer nie mógł wysłać Twojej wiadomości. Spróbuj jeszcze raz."; myForm.dict.markedAsSpamError = "Twoja wiadomość wygląda jak SPAM, proszę popraw ją."; myForm.dict.markedAsSpamServerError = "Twoja wiadomość została oznaczona jako SPAM i nie została wysłana"; myForm.dict.httpRequestError = "[%s] Wystąpił problem z otrzymaniem odpowiedzi z serwera."; myForm.dict.timeoutError = "Twoje żądanie przekroczyło czas przetwarzania. Spróbuj jeszcze raz!"; myForm.dict.parseResponseError = "Odpowiedź z serwera jest niezrozumiała.";
Troubleshooting
- "Mail server has experienced an error."
- This error reports that there is something wrong on server side. Please ask your hosting administrator to check that if
mail()
function in PHP parser is configured properly.
- "Response from mailing server was unclear. Please contact administrator."
- This means that PHP responses are unclear. To investigate this error, check the following:
- Open PHP file in web browser and check if it display OK word.
- Check that action attribute points to correct path to php file.