Introduction

Thank you for purchasing template!

This documentation will give you an understanding of how is structured and guide you in performing common functions. If you require further assistance not covered in this documentation

If you need custom customization, please contact us from here: http://themeforest.net/user/aucreative

Thank you so much!

AU CREATIVE

Getting Started

What's Included

Once you have download the package you will see the following folder structure in " template" Folder

css- Main Stylesheet Files
fonts- Fonts file and css for fonts
images- Images Files
js- Javacripts Folder
includes- PHP Files (contact form, ... etc)
vendor- Vendor Files (jquery, bootstrap etc)

In order to use in your website, you need to upload template files ( inside the folder www) to your web server with the help of one of the FTP-clients (for example, WinSCP or Total Commander etc).

HTML Structure

template is based on Bootstrap Framework ( http://getbootstrap.com/) Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

Below is a sample coding structure:

<!DOCTYPE html>

<html lang="en-US">

<head>

</head>

<body>

    
    

        ...

    
    

    
    
            

                ...

            
    
    

    
    
        
            

                ...

            
        
    
    


</body>

</html>

Logo Settings

Default site logo is placed insideheader container.

Changing Color

template allows you to change the theme color width 4 different colors.

Each color stylesheet is in a folder in the css/color/

To change the color you want. You just need to copy and replace file color.css from css/color/color-name/ to css/

Example: To change the color to green. You just need to copy and replace file color.css from css/color/green/ to css/

The main color of the theme is blue, in addition to the colors green, yellow, orange

Sliders

includes 1 sliders that gives you all the options they need.

Revolution Slider: is an awesome animated slider that creates eye-catching sliders.

Revolution Slider

Please find the full online documentation of Revolution Slider here

Contact form

You need to modify email address and email title onincludes/config.json in includes folder,line 2 andline 3

"MAIL_HOST": "info@yourdomain.com"
"MAIL_TITLE": "[ Name ] Contact Form Message"

with your or company contact email address and the title mail you want.

Note: Your server must support php sendmail()function to make contact form work properly

Grid

Bootstrap grid includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts

Grid systems are used for creating page layouts through a series of rows and columns that house your content. Here's how the Bootstrap grid system works:

You must start withrow
There are pre-define classes of columns starting from 1 to 12, examplecol-md-1 tocol-md-12
Each of these value represent a percentage of the screen, 1 being the smallest and 12 being 100%
You can create different grid pattern that finally forms 12

For more information about Bootstrap, visit: http://getbootstrap.com/

example :


    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1
    .col-md-1



    .col-md-8
    .col-md-4



    .col-md-4
    .col-md-4
    .col-md-4



    .col-md-6
    .col-md-6

NoteBootstrap includes different grids for different screen sizes, "col-md" md stands for medium screen, the following table explains:

	Extra small devices Phones ( <768px)	Small devices Tablets (≥768px)	Medium devices Desktops (≥992px)	Large devices Desktops (≥1200px)
Grid behavior	Horizontal at all times	Collapsed to start, horizontal above breakpoints
Container width	None (auto)	750px	970px	1170px
Class prefix	`.col-xs-`	`.col-sm-`	`.col-md-`	`.col-lg-`
# of columns	12
Column width	Auto	~62px	~81px	~97px
Gutter width	30px (15px on each side of a column)
Nestable	Yes
Offsets	Yes
Column ordering	Yes

Browser Support

is built keeping mind to support a wide range of browsers and devices. We all major browers Google Chrome, Mozilla Firefox, Safari, Opera, Internet Explorer 9 and Above

	Chrome	Firefox	Internet Explorer	Opera	Safari
Android	Supported	Supported	N/A	Not Supported	N/A
iOS	Supported	N/A		Not Supported	Supported
Mac OS X	Supported	Supported		Supported	Supported
Windows	Supported	Supported	Supported	Supported	Not Supported

Source & Credits

All images are only for demonstration purpose, however you can re-download them in sites below. Almost all (not including overclothing.com, Daniel Zenda, Freepik etc...) images are released free of copyrights under Creative Commons CC0.