Repair Geek - Laptop And Computer Fixing Service Center HTML5 Template

Latest Update: 26/07/2018
Template Created: 09/09/2017
by: xenioushk
http://bluewindlab.net
Email: hkhan.cse@gmail.com

If you like this template please spare a minute to rate it. If you want any support, Please feel free to contact me via my profile page http://themeforest.net/user/xenioushk

Template Overview

Repair Geek is a modern looking HTML5 template designed & developed for Laptop And Computer Fixing Service Center in mind. It works smoothly on your Computer, or on your tablet and mobile devices. It’s comes with eye catching features, such as animates boxes, contact form section, testimonial box, counter block and much more.

Features

Bootstrap 3 Framework.
2 Home Page Layout.
Modern and Very Clean looking Design
Unique & Creative design
HTML5 & CSS3
Responsive Template
Font-awesome icon font.
Free Fonts used
Contact Form
404 Page
Coming Soon Page
Multi-Pages
Latest jQuery Version
Developer Friendly Code
Well Documented.
& much more…

20+ HTML5 Templates

Home Page 1 (index.html)
Home Page 2 (home-2.html)
About Us (about-us.html)
Our Volunteer (team.html)
Volunteer Details (single-team.html)
Blog (blog.html)
Blog single(single.html)
Events (events.html)
Single Events (event-single.html)
Causes (causes.html)
Single Cause(cause-single.html)
FAQ (faq.html)
Donation (donation.html)
Coming Soon (coming-soon.html)
404 (404.html)
Contact(contact.html)
Gallery 01(gallery-1.html)
Gallery 01(gallery-2.html)
Element Highlights (element-highlights.html)
Element Counter (element-counters.html)
Element CTA (element-cta.html)
Element Sponsors (element-sponsors.html)
Element Testimonials (element-testimonial.html)
Element Team (element-team.html)
Element Newsletter (element-newsletter.html)

This template built with LESS. Inside the directory css/less you will find all less files where variables.less declares all colors and variables and layout.less mainly contain all necessary declaration for css. style.less should be compiled to css/style.css. Other two less files mixins.less and reset.less are for common CSS behaviour.

demo

Less Complier Tool:
We have used "crunch2" less compiler to generate CSS from less file. It's FREE and very easy to use. You can download it from following link- https://getcrunch.co/

How To Compile Less File Using Crunch:

Please follow the steps to compile template LESS file.

Step 01:

From Crunch 2 menu open project/template files and select "styles.less" file.

Step 02:

Next, from Crunch 2 menu click "Crunch!".

Step 03:

Compiler will compile "styles.less" to "styles.css" file and display success message bottom of Crunch 2 editor.

Step 04:

Open and edit "css/less/variables.less" file to change font family, primary color and other options.

All the directories and files are well organized as it shown on the image bellow. Same file tree has been applicable for all HTML files

demo

This template is a mobile friendly (responsive) layout which is designed based on Twitter Bootstrap v3..* See our HTML file structure which is in index.html. Your contents go inside container.

demo

We are using 7 CSS files in this template and we separated styles for improving convenience to edit this template. If you're going to use this template in production we recommend you to merge all stylesheets into one file (for decreasing HTTP queries).

demo

There are 11 jQuery files including necessary plugins, all of them be found in jsfolder of home directory. custom-scripts.js This file must go all the way down to other files and plugins for app landing page. This file contains custom codes

demo

Hedaer Logo Screenshot

We have used google font Open Sans. Font used in the top of the file less/variables.less

demo

We used WOW plugin to trigger animations on scroll. Here are some animation classes we used in this Template. To learn more about WOW please read their Documentation

    1. fadeIn
    2. fadeInLeft
    3. fadeInRight
    4. fadeInUp
    5. fadeInDown
    6. fadeInLeftBig
    7. fadeInRightBig
    8. fadeInUpBig
    9. fadeInDownBig

demo

We used several background images in our template. You'll find the code in the file css/less/layout.less. Thess code will be available after the compilation of the layout.less and written in the css/layout.css in the. Examples are given in the screenshot

In the layout.less

demo

In the index.html

demo

For contact page Google Map, open the file js/custom-scripts.js and look for the line 442/443 and change the lat, lng value according to your map location

demo

Template comes with Ajax powered functional contact form feature. You just need to set your email address in 'contact_email.php' file and user will be able to send email to your address.

demo

2018, July, 26 - v 1.0.4
- Updated Stylesheet Code(styles.js).
- Updated JavaScript Code(custom-scripts.js).
- Update documentation.

2018, June, 16 - v 1.0.3
- Updated Stylesheet Code(styles.js).
- Updated JavaScript Code(custom-scripts.js).
- Update documentation.

2018, January, 10 - v 1.0.2
- Updated Stylesheet Code(styles.js).
- Updated JavaScript Code(custom-scripts.js).
- Update documentation.

2018, April, 04 - v 1.0.1
- Added Two More Home Pages With New Color Scheme.
- Added Functional Contact Form.
- Update Documentation.

2017, September, 09 - v 1.0.0
- Initial release

- jQuery
- Bootstrap
- Google Fonts
- Owl Carousel
- Font Awesome
- Google Maps API
- Freepik.com
- Pexels.com

Repair Geek - Laptop And Computer Fixing Service Center HTML5 Template

Template Overview

Features

20+ HTML5 Templates

Less

Step 01:

Step 02:

Step 03:

Step 04:

Structure

All the directories and files are well organized as it shown on the image bellow. Same file tree has been applicable for all HTML files

HTML File Structure

This template is a mobile friendly (responsive) layout which is designed based on Twitter Bootstrap v3..* See our HTML file structure which is in index.html. Your contents go inside container.

CSS File Structure

We are using 7 CSS files in this template and we separated styles for improving convenience to edit this template. If you're going to use this template in production we recommend you to merge all stylesheets into one file (for decreasing HTTP queries).

jQuery File Structure

There are 11 jQuery files including necessary plugins, all of them be found in jsfolder of home directory. custom-scripts.js This file must go all the way down to other files and plugins for app landing page. This file contains custom codes

Navigation Bar

Top Navigation Bar Screenshot

Footer Navigation Bar Screenshot

Logo Change

Hedaer Logo Screenshot

Template Font

We have used google font Open Sans. Font used in the top of the file less/variables.less

Animation

We used WOW plugin to trigger animations on scroll. Here are some animation classes we used in this Template. To learn more about WOW please read their Documentation

Background

We used several background images in our template. You'll find the code in the file css/less/layout.less. Thess code will be available after the compilation of the layout.less and written in the css/layout.css in the. Examples are given in the screenshot

Google Map

For contact page Google Map, open the file js/custom-scripts.js and look for the line 442/443 and change the lat, lng value according to your map location

Contact Form

Change Log

Sources and Credits

Our WordPress Themes:

Our WordPress Plugins:

Our Templates:

Repair Geek - Laptop And Computer Fixing Service Center HTML5 Template

Template Overview

Features

20+ HTML5 Templates

Less

Step 01:

Step 02:

Step 03:

Step 04:

Structure

All the directories and files are well organized as it shown on the image bellow. Same file tree has been applicable for all HTML files

HTML File Structure

This template is a mobile friendly (responsive) layout which is designed based on Twitter Bootstrap v3.*. See our HTML file structure which is in index.html. Your contents go inside container.

CSS File Structure

We are using 7 CSS files in this template and we separated styles for improving convenience to edit this template. If you're going to use this template in production we recommend you to merge all stylesheets into one file (for decreasing HTTP queries).

jQuery File Structure

There are 11 jQuery files including necessary plugins, all of them be found in jsfolder of home directory. custom-scripts.js This file must go all the way down to other files and plugins for app landing page. This file contains custom codes

Navigation Bar

Top Navigation Bar Screenshot

Footer Navigation Bar Screenshot

Logo Change

Hedaer Logo Screenshot

Template Font

We have used google font Open Sans. Font used in the top of the file less/variables.less

Animation

We used WOW plugin to trigger animations on scroll. Here are some animation classes we used in this Template. To learn more about WOW please read their Documentation

Background

We used several background images in our template. You'll find the code in the file css/less/layout.less. Thess code will be available after the compilation of the layout.less and written in the css/layout.css in the. Examples are given in the screenshot

Google Map

For contact page Google Map, open the file js/custom-scripts.js and look for the line 442/443 and change the lat, lng value according to your map location

Contact Form

Change Log

Sources and Credits

Our WordPress Themes:

Our WordPress Plugins:

Our Templates:

This template is a mobile friendly (responsive) layout which is designed based on Twitter Bootstrap v3..* See our HTML file structure which is in index.html. Your contents go inside container.