Firstly, a huge thanks for purchasing this theme, your support is truly appreciated!
This document covers the installation and use of this theme and often reveals answers to common problems and issues - read this document thoroughly if you are experiencing any difficulties. If you have any questions that are beyond the scope of this document, feel free to pose them in the dedicated support section.
Go ahead to know more.
After unzip the download pack, you'll found a Template Folder with all the files.
You can view this Template in any browser, you can display or edit the Template without an internet connection.
The two sections that will not work is the Google map Section which contains external link to get the map source.
and Contact form which uses PHP, so will work only online.
Now open your FTP Client (like Filezilla) or directly through cpanel, upload the content of the Template on your server root.
Once the files are done uploading go to www.yourdomainname.com/index.html
Please follow the tutorial to have a simple installation of the theme.
This Template has a Responsive layout and is based on our own framework.
The default grid system utilizes 12 columns, making for a 1170px wide container without responsive features enabled. With the responsive CSS file added, the grid adapts to be 724px and 1170px wide depending on your viewport. Below 767px viewports, the columns become fluid and stack vertically.
The most importat class to make different grid system is the columns_ class...so if u want a 3 column boxes, in the parent div u must write this class columns_3 and then add the 3 boxes a clas of span...
For a simple two column layout, create a .columns_2 and add the following class, .span to each div.
Given this example, we have .vc_col-sm-4 .vc_col-sm-4 and anothoer ,vc_col-sm-4, making for 12 total columns and a complete row and 3 columns.
.........
............
These are the css files that are loaded into templates in Head Section.
By default, the template loads raleway font from Google Web Font Services, you can change the font with the one that suits you best.
These are the JS files that are loaded into templates in end of the Body Section and some of them like modernizr in the head of the them.
The js files are also the same in all the demos, and the Template has loaded all the js scripts in all pages, so u can use whatever u want from the template, wherever u want.
Please follow the first steps of the tutorial, to have it easier to install it on your own.
The Template has 18 different demos, but most of them has some features same but with different style
Some of our headers in demo are sticky,and some of them are not sticky...u can remove, or add a sticky header bu just addin this class "second-nav" into the div id="header" ...ehre u see this:
We have included different header styles, u have the headers into seperate html pages..so if uw ant a transparent header grab the header from this page "header-solid.html" and others as well..if u have any problem with choicing our headers..we can allways help u :D
Navmenu
You will find that this theme has 2 navigation menu's,thats because one of them is only for mobile version.Soo, everything thats sits inside this div "mobile_navigation" is only for mobile versions...
and everything inside this nav id="main_navigation"is for the desktop browsers
This is the main navigation.
Slider
We have used the slider Revolutin in our themeThe revolution slider will require the activation code that is in all pages that have this slider... in the end of page...
google Maps
Using any of our Google map style is very easy. Here is the example of google mapTo Change the google maps latitude and longtitude u need to go to contact-form.js and u will see the code below.var myMarkers = { "markers": [ { "latitude": "40.7127", // latitude "longitude":"-74.0059", // longitude "icon": "images/map_pin_1.png" // Pin icon } // Add As Plenty As u want , { "latitude": "40.712785", "longitude":"-73.969708", "icon": "images/map_pin_1.png" } , { "latitude": "40.722785", "longitude":"-73.999708", "icon": "images/map_pin_1.png" } ] }; try { $("#google_map").mapmarker({ zoom : 14, // Zoom center: "40.7127,-74.0059", // Center of map type: "ROADMAP", // Map Type controls: "HORIZONTAL_BAR", // Controls style dragging:1, // Allow dragging? mousewheel:0, // Allow zooming with mousewheel markers: myMarkers, styling: 0, // Bool - do you want to style the map? featureType:"all", visibility: "on", elementType:"geometry", hue:"#00AAFF", saturation:-100, lightness:0, gamma:1, navigation_control:0 /* To play with the map colors and styles you can try this tool right here http://gmaps-samples-v3.googlecode.com/svn/trunk/styledmaps/wizard/index.html */ }); } catch(err) { }so here we added 3 pins for the map... and then after pins is the map latitude and longtitude..
Also u will need these 2 jquery scripts to make it work
Contact Form
Open "contact.php" from the folder "PHP" in theme file.
- Find "#Your e-mail address" and replace it with the email id, where you want to receive the mail.
Icons
U can use icons from fontAwesome, here's the link of the icon map
Thats it. You are done. Now your website is ready to launch.
This is a very small tutorial for the index.html, but it will help u with other demos too, if u have any trouble setting up the theme, we will be happy to assist you.
Sources and Credits
We have used the following plugins, fonts & images. All fonts, images, icons used in this template are free for commercial use.
Fonts
- Raleway from google webfont.
jQuery Plugins
- Flexslider plugin by woothemes
- Owlscroll carousel plugin by owlgraphic
- Lightbox by Smashing
- Modernizr by Modernizr
ImagesImages in live preview are not included to the template.
- Images used from Source name
Once again, thank you so much for purchasing this theme.
If u have question u can ask us here. Thanks
As I said at the beginning, We'd be glad to help you if you have any questions relating to this theme. We I'll do our best to assist.max-themes