Thank you for purchasing our theme. If you have any questions that are beyond the scope of this help file, please feel free to ask us via Themeforest Contact Form. Thanks so much!
HTML Structure
This theme is a responsive flat theme with four columns and lots of shortcodes
Theme comes with multiple layouts boxed and wide and also predefined 8 color variations and backgrouds
Wide Layout
By default its wide layout.
Boxed Layout
To change the layout to boxed just put boxed class in body tag (boxed class is mentioned in bootstrap.css file)e.g
To change pattern of the boxed layout goto to bootstrap.css file and update class
body.boxed
< body class="boxed">
To Set color in the template
you can change it to defined color of your choosing. All color css files are in css -> color -> color.css folder
The theme is build on bootstrap3 framework. and below is the main structure of the pages
The syntax is simple and it's effective cross browser, but the awesome part is that it also has the flexibility to go mobile like a champ. You can really easily customize all part of site or build new.
Homepage Slider
There are some premium sliders used in the theme, below is the list of them.
Revolution Slider
Owl Slider
Owl Carousel
Flex Slider
Revolution Slider 4.0
Slider with animated captions and images on each image. All the settings below:
Slider Delay Control
(data-start="1000") ... if you increase the data start the item will come slow and if you decrease then the item start time will come fast
Slider Speed Control
(data-speed="900") ... if you increase the data speed the item will move fast and if you decrease then the item speed will slow.
Slider Direction Controls
(lfr) right point 0 to point set (x-axis)
(lfl) left point 0 to point set (x-axis)
(lft) top point 0 to point set (y-axis)
(lfb) bottom point 0 to point set (y-axis)
(sfl) left point (x-axis) to slight move left
(sfr) right point (x-axis) to slight move right
(sft) top point (y-axis) to slight move bottom
(sfb) bottom point (y-axis) to slight move top
Setting for text
Your Text
Owl Slider
Slider with animated captions and images on each image. All the settings below:
Owl Carousel
Shortcodes
This theme includes tons of shortcodes, includes Accordion, Tabs, Buttons, Progress Bar, Counters, Alert Boxes, etc
In massa turpis ornare nec commodo non, auctor vel felis. Etiam pharetra, turpis nec sollicitudin cursus vestibulum varius hendrerit turpis quiseam cursus. Nonec bibendum vestibulum Kravida. Alentesque condimentum orci vel leo laoreet accumsan interdum eros vel sapien tincidunt dignissim, [...]
Contact form is based on jQuery. You don't have to know PHP. To change sample email adress, open "contact.php", find and edit code below:
Open contact.php file from PHP folder and Goto Line 26 and 30.
// ====== Your mail here ====== //
$to = 'Your Name ';
//Email from which you will receive email. must be on same domain to avoid spam
$from = 'Contact ';
CSS Structure
This theme includes multiple CSS files, Below is the list of them.
styles.css - Main css file with all styling
bootstrap.css - Bootstrap3 Framework
responsive.css - for Responsive and boxed style
settings.css - for Revolution Slider
owl.carousel.css - for OWL Carousel
fontello.css - for Fontello Icons
gizmo.css - for Gizmo Icons
picons.css - for Picons Icons
switcher.css - for Style Switcher.
JavaScript
You can see some help info, when Gates links which are below each regarding script:
jquery.min.js - Used for javascript library
jquery.themepunch.revolution.min.js - Used for Revolution Slider
owl.carousel.min.js - Used for Owl Carousel
classie.js.js - Used for Search panel
jquery.sticky.js - Used for Sticky header
jquery.isotope.min.js - Used for portflio isotope
jquery.fancybox.pack.js - Used for Popup image
jquery.inview.js - Used for inview
jquery.themepunch.showbizpro.min.js - Used for Portfolio & Carousel
html5shiv.js - Used for html5 tags
jquery.slickforms.js - Used for form validation
jquery.ui.tabs.min.js - Used for Tabs
us.widgets.js - Used for widgets
gizmo.js - Used for Gizmo Icons
switcher.js - Used for Style Selector on left side
scripts.js - Used for customization of scripts
Style Switcher
1. Layout Style
Current layout is Wide if you to make it boxed just open .html file and put boxed class in body tag like below
3. Main Color
You can use one of predefinied colors or build custom CSS with color which you want.
2. Background
Custom background is allowed only in "boxed" layout. If you want to use other than standard pattern or solid background, open "boxed.css" and modify on line 10 link to background's pattern. here is the code
body {
background: url(../images/backgrounds/bg_img01.jpg);
}
4. At the end
Don't forget to remove style switcher after customize your site. below is the code at the bottom of every html page
Style Selector
Layout Style
Predefined Colors
Background Image
Sources & Credits
Images and Icons Used in the theme, Many thanks for the following authors
http://wallpaperswide.com/
http://picjumbo.com/
https://www.iconfinder.com
Note: The images included in preview are for demonstration purposes and should always be replaced with your own work.
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, basic HTML/CSS/JavaScript related questions, you should contact me via themeforest contact form.
