Plano
Flat Design Responsive HTML5 Template
- Created: 04/26/2013
- latest Update: 04/26/2013
- By: ThunderBuddies
- www.themeforest.net/user/thunderbuddies
- Email: info@thunderbuddies4life.com
ThunderBuddies 4 Life!
Quick Setup
What files do I need to upload to my server?
Please unzip the downloaded file (you probably already did). Select your prefered style and upload the corresponding folder of HTML source or and upload all folders to your server. In the single folder you will find the home file index.html to begin with, all example styles and the following subfolders containing all of the items content:
- css
- js
- images
- forms
and all the HTML files you basically find in each single source folder.
The main style CSS file (style.css) and the CSS files for the jQuery Plugins are to find in the css folder. All pictures used including the assets are to be found in the images folder. The forms folder contains the mail modules and a phpinfo file to check the server.
The HTML files are named and commented so you should have no problem adapting to it.
If you find an issue or need some clarification do not hesitate to contact our support staff at
jQuery
The js/rs-plugin folder holds the CC item Slider Revolution http://codecanyon.net/item/slider-revolution-responsive-jquery-plugin/2580848 which also has its own documentation in the documentation folder.
The js/showbizpro folder holds the CC item Showbiz Pro http://codecanyon.net/item/showbiz-pro-responsive-teaser-jquery-plugin/4188435 which also has its own documentation in the documentation folder.
The js folder contains all other jQuery Plugins and Scripts needed in the templates pages:
- bootstrap.min.js (the bootstrap engine)
- FitVids.js (Helper to get the Videos in the correct size)
- forms.js (Helper to set up the forms)
- jquery.dcflickr.1.0.js (plugin to catch flickr streams)
- jquery.gmap.js (displays the google map)
- jquery.jribbble-0.11.0.ugly.js (plugin to catch dribbble stuff)
- jquery.isotope.min.js (Isotope to power the portfolio grid)
- jquery.scrollto.js (plugin to use to scroll to navigation anchors in the one pager)
- jquery.sticky.js (plugin that creates the sticky navigation on the one pager)
- jquery.themepunch.plugins.min.js (some needed helper plugins combined)
- jquery.themepunch.showbizpro.js (Script for the Display of for example "Latest Posts" in a Carousel )
- mediaelement-and-player.min.js (Mediaplayer for HTML5 audio and video, flashmediaelement.swf and silverlightmediaelement.xap are parts of this too)
- less.js , retiana.js (scripts to generate a retina output of certain images)
- simpleslider.js (the small slider used inside posts)
- twitter.min.js (fetches the twitter stream)
Most important script is the screen.js in the js folder. It is the main script where a lot of things happen like initializing and starting certain modules, please read the comments to see what happens. You find the functions inside this screen.js:
CSS
The main style CSS file (style.css) and the CSS files for the jQuery Plugins are to find in the css folder.
- bootstrap.css (The basic, standard bootstrap CSS framework)
- mediaelementplayer.min.css (Used for HTML5 playback of Videos and Audio)
- caption.css (needed for the Slider captions in the js folder)
Contact Forms
The Contact Forms are in the Contact template page. The JS that handles the AJAXified form validation and starts the php mail sending is js/forms.js. Inside is an AJAX call for the mail php files
- forms/contact.php
Inside this forms you can define to whom ($to) the mail should be send and what it should look like. If you add/change formfields in the html forms please make sure to add/change these things here too. We put a php file here too for a possible quick contact form.
Support
Contact our Support at
for every question you might have!
Make sure to check out: