Documentation

An overview of the template along with usage instructions for its various components.

Introduction

Hi customer!

Thank you for choosing this template. If you have any questions please feel free to email here.

Plugins

All plugins setting is in file "assets/js/custom.js"

Appear

jQuery plugin to call a function when an element appears.

Plugin Website

Super Simple Text Rotator

A light weight jQuery plugin that will allow you to add a super simple rotating text to your website.

Plugin Website

jqBootstrapValidation

A JQuery validation plugin for bootstrap forms.

Plugin Website

Superslides

Superslides is a full screen, hardware accelerated slider for jQuery.

Plugin Website

OWL Carousel

Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider.

Plugin Website

Magnific Popup

Magnific Popup is a responsive lightbox & dialog script with focus on performance and providing best experience for user with any device.

Plugin Website

jquery.mb.YTPlayer

An open source jQuery component to easily build your custom Youtube® player or to use a Youtube® video as background for your page.

Plugin Website

jQuery-Parallax

jQuery Parallax is a script that simulates the parallax effect.

Plugin Website

Isotope

Filter & sort magical layouts.

Plugin Website

FitVids.js

A lightweight, easy-to-use jQuery plugin for fluid width video embeds.

Plugin Website

jQuery Easing Plugin

A jQuery plugin from GSGD to give advanced easing options.

Plugin Website

Wow

Reveal Animations When You Scroll.

Plugin Website

Navbar

You can use two types of navbar: dark and light.

Dark:

Light:

Logo

You can use simple text or image for logo.

Example

Logo image setting:

Check official documentation for more information.

Hero module

For hero/header you can use image, parallax image, full height slider, text rotator and Youtube video.

Image & Parallax

Use parameter "data-background" for setting a background image.

Remove class "module-parallax" for disable parallax effect.

Slider

You can use a unique overlay effect for each slide.

Youtube Video background

Image & Text rotator

Modules

You can use any effects(image, parallax image, full height slider, Youtube video, overlays) for each site modules.

Standard module

Small module

Overlays

This template support 9 variants of backgound(and overlays effects): bg-light, bg-light-30, bg-light-60, bg-light-90, bg-dark, bg-dark-30, bg-dark-60, bg-dark-90 and bg-film. Check components-5.html page for more examples.

Example

You can combine this class.

For example: If you use "bg-light bg-film" then text color will be dark, else if you use "bg-dark bg-film" text color will be white.

Portfolio

You can use dakr or light portfolio hover effects:

Example of light hover

For dark hover remove class "works-hover-w".

Portfolio image sizes

• Standard - 400x400
• Tall - 400x830
• Wide-tall - 830x830
• Wide - 830x400

Ajax Laod More

You can to load your portfolio item by AJAX.

All AJAX options in file "custom.js"

For example, we have created "ajax-load-more/ajax-load-more.php" page. From this page a js code loading the portfolio posts.

Lightbox portfolio

If you use lightbox portfolio you should edit "ajax-load-more.php" file. By default we use in this file portfolio items with a link to single portfolio item.

Change the link that leads to a page portfolio, now it should call ligntbox:

Contact

Open the file "assets/php/contact.php" and enter your data.

If Contact form form not working

You need to check is PHP mail() function working.

1. Save this code as mailtest.php

2. change [email protected] to your e-mail address

3. upload mailtest.php to your server

4. open mailtest.php in your browser (http://yourwebsite.com/mailtest.php)

5. check your inbox to see if a test message arrived.

If it works:

1. double-check your form script for errors (like e-mail address misspelling)

2. use the same e-mail address as your form recipient

3. double-check your SPAM filters and SPAM/Junk/Bulk mailboxes

If it not

Contact your host and ask them to check PHP mail() setting.

Google map

Open the file "assets/js/custom.js" and enter your data:

Example

Changelog

Version 1.0

• - Initial Release

Version 1.0.1

• - Fixed: Two validation errors
• - Fixed: Accordian border
• - Changed: Title tags
• - Update docs
• - Affected files: All *.html files

Version 1.0.2

• - Bootstrap Updated V 3.3.5
• - Font Awesome Updated Version 4.4.0
• - Update docs

Version 1.0.3

• - Bootstrap Updated V 3.3.6
• - Font Awesome Updated Version 4.5.0
• - Disable sticky navbar on small screens
• - Update docs
• - Affected files:
• --- "assets/bootstrap/",
• --- "assets/css/style.css",
• --- "assets/js/custom.js",
• --- "assets/css/font-awesome.*",
• --- "assets/fonts/font-awesome.*",