Main Styles and Scripts
css/master.css
css/theme.css
css/blog.css
css/responsive.css
css/shop.css
js/scripts.js
plugins/font-awesome
plugins/icomoon
plugins/simple
X- Sport Club HTML Template
Thank you for purchasing this item. We provide support for all of our Items at http://templines.com/, but please make sure you read this documentation first. Thank you so much!
If you are not familiar with HTML and CSS, I highly recommend that you to hire a specialist. It will save your time and you will get only positive emotions while using our product.
Landing Page
Let's look at the structure of Landing Page. It includes its own sections with content. On request you can add or remove sections of the site. Please, be careful when removing unwanted sections. All tags have to be closed properly.
Sections are divided into three types:
- simple section with white background
- parallax section
- section with new background color
Each section has its own class, which affects imaging of the content.
For some sections we use additional scripts which are located in the folder PLUGINS.
All scripts are connected in the basement of the site.
Plugins
PAGE PRELOADING EFFECT
plugins/loader/
We use this effect only on Landing Page. It makes waiting process while page loading less boring for the user. It is relevant for large pages with large amount of information just like in our case.
You can move this code to another page or delete it.
COLOR SWITCHER
plugins/switcher/
You can change the color palette of the site. To do this use this switch. You can also add or change your colors.
plugins/switcher/css/green.css
Animated
css/animate.css
To disable animations remove class animated-all in the BODY animated-all в BODY
Blazy Images
js/blazy.min/
bLazy is a lightweight lazy loading image script (less than 1.2KB minified and gzipped). It lets you lazy load and multi-serve your images so you can save bandwidth and server requests. The user will have faster load times and save data loaded if he/she doesn't browse the whole page.
Boostrap Mega Menu
plugins/yamm3/
This is Yet another megamenu for Bootstrap 3 from Twitter. Lightweight and pure CSS megamenu that uses the standard navbar markup and the fluid grid system classes from Bootstrap 3. Work for fixed and responsive layout and has the facility to include (almost) any Bootstrap elements.
SMART MENU
plugins/smart-menu/
To move fast to other pages we use Smart Menu. We also use it for mobile navigation instead of the main menu .
Boostrap vertical tabs
plugins/bootstrap-vertical-tabs-master/
Vertical tabs component for Bootstrap 3. Works with 3.0.0+ to 3.3.0.
Isotope Filter
plugins/isotope/
plugins/magnific/
Isotope can hide and show item elements via the filter option. Items that match that filter will be shown. Items that do not match will be hidden.
Sly Carousel
plugins/sly
JavaScript library for one-directional scrolling with item based navigation support.
Sly supports navigation with:
- mouse wheel scrolling
- scrollbar (dragging the handle or clicking on scrollbar)
- pages bar
- various navigation buttons
-content dragging with mouse or touch
- automated cycling by items or pages
lots of super useful methods
Events And Countdown
plugins/events/
plugins/countdown/
plugins/flexslider/
A responsive carousel showcasing selected Events, powered by CSS and jQuery.
Side Team Member Bio
plugins/bio/
plugins/sly/
Use this team member biography resource to insert extended descriptions of your team members, with no need of dedicated pages or modal windows. Let the user meet your team and trust your company!
Contact Form
js/contact_me.js
Email Settings
mail/contact_me.php
Category points
plugins/points/
Use this resource to highlight the points of interest of your products. Just a click to open a brief description of each point, allowing your user to get a deep and fast understanding of your product features.
Selectbox plugin
plugins/points/
Custom select box replacement inspired by jQuery UI source. Require jQuery 1.4.x or higher
Boostrap Elements
js/bootstrap.js
css/bootstrap.css
To create a modal window you need to:
1. Create a layout with a unique ID
2.Specify the link to the page and assign to it an ID of our template
3. Add content to the file
include/product-only-content.html
Debugging
For editing or updating use the .debugging.css
css/debugging.css
Please for your own changes use custom.css file. It will help you to avoid problems after updating.
css/сustom.css