Carservice - Mechanic Auto Shop Template

Carservice is a responsive and retina ready HTML Template best suitable for auto mechanics, car repair shops, mechanic workshops, car repair services, auto painting, auto detailing, tire and wheel shops or handyman business. The Template comes with Appointment Form, Slider Revolution jQuery plugin, 90 premium car related font based icons, 12 page templates, sticky menu, touch friendly slider and carousels, ajax contact form and more.

PSD source files are available to all of our buyers. Please contact us to get the files. You will receive perfectly organized and layered Template plus all of the icons used within a project in full PSD vector.

Template Features

  • Responsive Layout
  • Retina Ready
  • jQuery Powered
  • Appointment Form
  • Slider Revolution Responsive jQuery Plugin (Value of $14) Included
  • Streamline Premium Icon Font with 90 Icons (Value of $69) Included
  • Premium Images (Value of $33) Included
  • Wide and Boxed Layout
  • Sticky Menu
  • Mobile Touch Friendly Sliders and Carousels
  • Ajax Contact Form
  • Isotope Gallery
  • Parallax Backgrounds
  • Google Location Map
  • Page Templates
    • Home
    • Services
    • Single Service
    • Galleries
    • Single Gallery Page
    • About Us
    • Blog With Sidebar
    • Blog 2 Columns
    • Appointment Form
    • Contact Style 1
    • Contact Style 2
    • Error 404
  • Social Icons Font with 18 Icons to Choose From
  • PSD Files Included (Please Contact Us to Receive Perfectly Organized PSD Files)
  • Documentation Included
  • Valid HTML5 Code
  • Crossbrowser Compatible
  • Clean Design

CSS Styles

The project uses the following cascade of template styles (in order):

  • animations.css - styles for animated elements,
  • jquery.qtip.css - default styles for tooltips (overwritten in style.css),
  • superfish.css - default styles for superfish menu,
  • odometer-theme-default.css - styles for Odometer smoothly transitioning numbers plugin,
  • prettyPhoto.css - default styles for prettyPhoto lightbox,
  • style.css - base styles for the entire project,
  • responsive.css - styles for responsive design (remove it from header to disable responsive),
  • reset.css - styles which resets default browsers styles.

All CSS files are located in /style directory.

Javascript Files

Plugins and library:


Other files:

  • jquery.parallax.js - script which supports parallax animations,
  • jquery.hint.js - script which supports hints/placeholders for form fields,
  • main.js - script contains all executable instructions of jquery plugins, events handlers etc.

All JS files are located in /js directory.

Plugins

Contact form

This project includes a contact form ready for use.
All you need is to configure some constants located in file contact_form/config.php:

  • _from_name - name of your e-mail eg. "My Company",
  • _from_email - sender e-mail eg. "mycompany@gmail.com",
  • _to_name - name of recipient eg. "My Company",
  • _to_email - e-mail of recipent eg. "mycompany@gmail.com",
  • _smtp_host - your SMTP host eg. "gmail.com",
  • _smtp_username - login to your e-mail account eg. "mycompany",
  • _smtp_password - password to your e-mail account,
  • _smtp_port - port number for SMTP connection (optional),
  • _smtp_secure - authorization method (optional) - ssl or tls.

PSD Files

PSD source files are available to all of our buyers. Please contact us to get the files. You will receive perfectly organized and layered Template plus all of the icons used within a project in full PSD vector.

Fonts used

Credits

Images

Premium images you can use along with this Template without asking permission (included in downloadable package):

All other images comes with this Template are licensed under Creative Commons Zero CC0 1.0 Universal (CC0 1.0). You can use it along with this Template without asking permission.

Changelog

25 March 2017, ver. 1.6

  • phpMailer script update.
  • Slider Revolution update (to version 5.4.1).
  • jQuery update (to version 1.12.4).
--- html version ---
all html files
style/responsive.css
style/style.css
phpMailer directory
rs-plugin directory
-- added files ---
js/jquery-1.12.4.min.js
js/jquery-migrate-1.4.1.min.js
--- removed files ---
js/jquery-1.11.3.min.js
js/jquery-migrate-1.2.1.min.js

--- php version ---
footer.php
header.php
home.php
index.php
style/responsive.css
style/style.css
phpMailer directory
rs-plugin directory
-- added files ---
js/jquery-1.12.4.min.js
js/jquery-migrate-1.4.1.min.js
--- removed files ---
js/jquery-1.11.3.min.js
js/jquery-migrate-1.2.1.min.js
18 July 2016, ver. 1.5.1

  • Fix for appointment form slider box component display issue under IE.
--- html version ---
style/style.css
--- php version ---
style/style.css

09 July 2016, ver. 1.5

  • Fix for Google Maps component - Google API key is now required.
  • Slider Revolution update (to version 5.2.6).
--- html version ---
all html files
js/main.js
rs-plugin directory
--- php version ---
footer.php
js/main.js
rs-plugin directory

05 April 2016, ver. 1.4

  • Slider Revolution update (to version 5.2.4).
  • Mobile menu child items as collapsible.
--- html version ---
all html files
fonts/streamline-small/style.css
js/main.js
rs-plugin directory
style/responsive.css
style/style.css
--- php version ---
menu.php
fonts/streamline-small/style.css
js/main.js
rs-plugin directory
style/responsive.css
style/style.css
style_selector/style_selector.js

04 December 2015, ver. 1.3

  • Slider Revolution update (to version 5.1.4).
  • Fix for our clients carousel loading issue.
--- html version ---
home.html
index.html
js/main.js
style/responsive.css
style/style.css
rs-plugin directory (old version available under rs-plugin-old directory)
--- php version ---
home.php
js/main.js
style/responsive.css
style/style.css
rs-plugin directory (old version available under rs-plugin-old directory)

12 November 2015, ver. 1.2

  • Minor styles and code improvements.
--- html version ---
post.html
js/main.js
style/responsive.css
style/style.css
--- php version ---
post.php
js/main.js
style/responsive.css
style/style.css

07 September 2015, ver. 1.1

  • New social icons added: houzz, yelp, github, reddit, soundcloud, vk, vine, angies-list.
  • Minor styles and code improvements.
--- html version ---
all html files
fonts/social/styles.css
fonts/social/fonts/social.eot
fonts/social/fonts/social.ttf
fonts/social/fonts/social.woff
fonts/streamline-small/styles.css
fonts/template/styles.css
js/main.js
style/responsive.css
style/style.css
--- php version ---
404.php
about.php
contact_2.php
footer.php
header.php
home.php
post.php
service_air_conditioning.php
service_belts_hoses.php
service_brake_repair.php
service_engine_diagnostics.php
service_lube_oil_filters.php
service_tire_wheel.php
fonts/social/styles.css
fonts/social/fonts/social.eot
fonts/social/fonts/social.ttf
fonts/social/fonts/social.woff
fonts/streamline-small/styles.css
fonts/template/styles.css
js/main.js
style/responsive.css
style/style.css

11 August 2015, ver. 1.0

  • First release

Support

Support for all our items is conducted through our Support Forum.
Please register an account and search the forum or create a new topic, we'll answer as soon as possible.

We're in GMT +1 and we aim to answer all questions within 24 hours (Monday – Friday). In some cases the waiting time can be extended to 48 hours.
Support requests sent during weekends or public holidays will be processed on next Monday or the next business day.


Need pure HTML files or PHP version?

Theme could work without PHP. Pure html files are located in /www/html directory.
If you would like to use PHP version just use files located under /www/php directory.

FAQ - Frequently Asked Questions


1. How to choose between HTML or PHP version?

Template contains two versions PHP and HTML. If your server supports PHP please choose PHP version as it's more flexible. For example if you'll make change in header you won't need to duplicate it for each page.
If you would like to use PHP version use files located under /www/php directory.
If you would like to use HTML version use files located under /www/html directory.



2. How to set the menu to be sticky?


PHP version

Please replace line 157 in header.php:

<div class="header-container<?php echo (isset($_COOKIE['cs_menu_type']) ? ' ' . $_COOKIE['cs_menu_type'] : '');?>">

with:

<div class="header-container sticky">

HTML version

For each page please replace:

<div class="header-container">

with:

<div class="header-container sticky">


3. How to set boxed layout?


PHP version

Please replace line 50 in header.php:

<div class="site-container<?php echo ($_COOKIE['cs_layout']=="boxed" ? ' boxed' : ''); ?>">

with:

<div class="site-container boxed">

HTML version

For each page please replace:

<div class="site-container">

with:

<div class="site-container boxed">


4. How to set a pattern or background image for boxed layout?


PHP version

Please replace line 49 in header.php:

<body class="<?php echo (isset($_COOKIE['cs_layout']) && $_COOKIE['cs_layout']=="boxed" ? (isset($_COOKIE['cs_layout_style']) && $_COOKIE['cs_layout_style']!="" ? $_COOKIE['cs_layout_style'] . ' ' . $_COOKIE['cs_image_overlay'] : 'image-1 overlay') : ''); ?>">

with for example (image 1 background):

<body class="image-1">

example with pattern:

<body class="pattern-1">

example with background and overlay on it:

<body class="image-1 overlay">

You can find all available options commented in header.php file (lines 30-49).


HTML version

For each page please replace:

<body>

with for example (image 1 background):

<body class="image-1">

example with pattern:

<body class="pattern-1">

example with background and overlay on it:

<body class="image-1 overlay">


5. I'm getting "Please define Google Maps API Key" alert. What should I do?

You need to generate the Google Maps API Key here - https://developers.google.com/maps/documentation/javascript/get-api-key. Then you'll need to set it in the source code. Please follow the instructions below:

PHP version

Please open footer.php file and set the API Key by replacing YOUR_API_KEY phrase in line 123:

<script type="text/javascript" src="//maps.google.com/maps/api/js?key=YOUR_API_KEY"></script>

HTML version

Please open contact.html, contact_2.html and appointment.html files and set the API Key by replacing YOUR_API_KEY phrase in below line before </body> closing tag:

<script type="text/javascript" src="//maps.google.com/maps/api/js?key=YOUR_API_KEY"></script>