HostWHMCS

Responsive Web Hosting and WHMCS Template

• created: 22/08/2016
• by: ThemeLooks
• www.themelooks.com
• email: support@themelooks.com

Thank you for purchasing my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

How to get help:

We will respond to buyers' questions via the contact form on our profile.

We run support 24/7. You can expect a response within 24 hours.

• Support requests are for:
• - Help using templates
• - Instructions setting up templates
• - Bug reports and fixes
• Support requests aren’t for:
• - Help with 3rd party plugins
• - Integration of 3rd party plugins
• - Free Customization Requests of our templates

HostWHMCS is a Responsive Web Hosting and WHMCS Template designed for All kinds of Domain and Hosting Business. It's an HTML5 template based on latest Bootstrap 3.3.7. Also included 10 WHMCS Template based on WHMCS 6.3.1. Anyone can easily update/edit this template to follow our Well Sorted Documentation.

Main Features of "HostWHMCS":

• - Latest Bootstrap v3.3.7 Ready
• - WHMCS 6.3.1 Ready
• - WHMCS Template Included
• - Total 10 WHMCS Templates with 10 Different Color Version
• - Retina Ready
• - 10 Default Color with Color Switcher
• - Clean Design
• - Fully Responsive
• - Working Contact Form Integrated With Validetor and PHP
• - Mailchimp Integrated With Validetor
• - Twitter API Integrated
• - Modern Cross Browser Support
• - W3C Validate Code

Other Features of "HostWHMCS":

• - Google Fonts
• - FontAwesome Icons
• - Well Documented
• - and much more features…

HTML Template:

• Open up your FTP Manager and connect to your Hosting
• Browse to required directory (Normally public_html)
• Unzip and Upload the files.

WHMCS Template:

You'll get the step by step instructions to install the whmcs template in "/whmcs-template/whmcs-6.3.1/Readme.txt" file.

• ./main_files
  • /html-template
  • ___ /index.html
  • ___ /shared-hosting.html
  • ___ /reseller-hosting.html
  • ___ /vps-hosting.html
  • ___ /dedicated-hosting.html
  • ___ /domains.html
  • ___ /about.html
  • ___ /affiliate.html
  • ___ /testimonial.html
  • ___ /blog.html
  • ___ /blog-details.html
  • ___ /blog-sidebar-left.html
  • ___ /blog-sidebar-right.html
  • ___ /faq.html
  • ___ /contact.html
  • ___ /login.html
  • ___ /signup.html
  • ___ /404.html
• ./whmcs-template
  • /HostWHMCV1
  • /HostWHMCV2
  • /HostWHMCV3
  • /HostWHMCV4
  • /HostWHMCV5
  • /HostWHMCV6
  • /HostWHMCV7
  • /HostWHMCV8
  • /HostWHMCV9
  • /HostWHMCV10
  • /orderforms

The "HostWHMCS" template is a responsive HTML template based on Bootstrap 3.3.7. The structure based on a flexible grid that lets you change HTML pages quickly and logically with a nestable system.

If you would like to edit the layout of any elements in whole template, you would do the following:

Open any '.html' or, '.css', so that is extremely easy to change any html markup and css attributes. Simply find the related and commented heading in the html or, css file and make your magic.

"HostWHMCS" using the following CSS files:

css/font-awesome.min.css
The css file for font-awesome icons. To see all the available icons and instructions on how to use them click here

css/bootstrap.min.css
The main responsive grid stylesheets, from Bootstrap 3 framework. It is recommended to make any changes/additions to style.css and keep bootsrap.css and bootsrap-theme.css as it are. In this way, you can easily upgrade the grid framework when Bootstrap releases an update.

css/jquery.bxslider.min.css 
The css file for vertical slider

css/owl.carousel.css
The css file for owl carousel.

css/animate.min.css
The css file for slider animations.

style.css 
The main css file

css/responsive-style.css 
The main css file for responsive styles.

css/theme-color-1.css
css/theme-color-2.css
css/theme-color-3.css
css/theme-color-4.css
css/theme-color-5.css
css/theme-color-6.css
css/theme-color-7.css
css/theme-color-8.css
css/theme-color-9.css
css/theme-color-10.css 
The main css file for color scheme.

js/jquery-3.1.0.min.js
The jQuery Framework

js/bootstrap.min.js
The main js file that hook the supported scripts of Bootstrap 3 framework 

js/jquery.bxslider.min.js
The main js file that using for vertical slider

js/jquery.validate.min.js
The script that using for form validation

js/owl.carousel.min.js
The script that using for slider

js/jquery.waypoints.min.js
The script that using for scroll events

js/jquery.counterup.min.js
The script that using for counter

js/retina.min.js
The script that using for hight resolution images

js/custom-color-switcher.js
The main script for color scheme

js/main.js
The main script for the template

Photos:

• All 'images' used on the demo site is for demonstration purposes only and are not included in the main download file.
• All Images Collected From 'Google Image Search'

Fonts Used:

• Google Fonts (Raleway) - http://www.google.com/webfonts
• Font Awesome - http://fontawesome.io/

Frameworks / Libraries:

• jQuery - https://jquery.com/
• Twitter Bootstrap - http://getbootstrap.com

Plugins Used:

• jQuery Validation - http://jqueryvalidation.org/
• Waypoints - https://github.com/imakewebthings/waypoints/
• jQuery CounterUP - https://github.com/bfintal/Counter-Up
• bxSlider - https://github.com/wandoledzep/bxslider-4
• Owl Carousel - https://github.com/OwlFonk/OwlCarousel
• RetinaJS Plugin - https://github.com/imulus/retinajs
• Twitter Widgets Plugin - https://platform.twitter.com/widgets.js

How can I remove the "Preloader"?

• Open Up your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comment '<!-- Preloader Start -->'
• And remove the markup

How can I change the "Logo"?

• Open Up your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comment '<!-- Logo Start -->'
• Update The logo name 'Eco Hosting' from there.

How can I change "Slider Text"?

• Open Up your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comments '<!-- Banner Content Start -->'
• Update The 'content' from there

How can I change the "Slider Background Image"?

• Open Up your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comment '<!-- Banner Area Start -->'
• Update The 'data-bg-img="img/banner-slider-img/rocket.png"' from there

For version 1 and 2 :

How can I change "Pricing Table"?

• Open Your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comment '<!-- Pricing Item Start -->'
• Update The 'Price, Features and Link' from there

How can I change "Testimonial Text and Image"?

• Open Up your Desired '.html' file. (For Example, 'index.html')
• Then Search For the Comment '<!-- Feedback Area Start -->'
• Update The Image Link 'Text and Image' from there

How can I change "Name, Image, and Social Links" (Team Section)?

Make sure first you put your 'images' in the '/img/team-img' folder.

• Open Your 'about.html' file.
• Then Search For the Comment '<!-- Team Item Start -->'
• Update The 'Name, Image and Social Links' from there

How can I change "FAQ Questions and Answers"?

• Open Your Desired '.html' file. (For Example, 'faq.html')
• Then Search For the Comment '<!-- Accordion Item Start -->'
• Update The 'Title and Content' from there

How can I change the "Contact Address" (Contact Page)?

• Open Your 'contact.html' file.
• Then Search For '<!-- Contact Address Content Start -->'
• Update The Address: 'ShewraPara Bus Stand, Begum Rokeya Ave, Dhaka 1216, Bangladesh', Phone Number: '+1-212-9876543' and Email Address: 'support@example.com'

How can I change "Counter Value"?

• Open Up your Desired '.html' file. (For Example, 'about.html')
• Then Search For the Comment '<!-- Counter Item Start -->'
• Change The 'Title' and 'Numbers' from there

How can I change "Clients Logo"?

Make sure first you put your 'images' in the '/img/clients-img/' folder.

• Open Up your Desired '.html' file. (For Example, 'about.html')
• Then Search For the Comment '<!-- Clients Area Start -->'
• Update The Image Link 'img/clients-img/01.png' from there

How can I change the "Goolge Map Position"?

• Open Your 'contact.html' file.
• Then Search For the Comment '<!-- MAP Area Start -->'
• Update latitude/longitude data-latitude="23.790546", data-longitude="90.375583" and data-zoom="16" from there

How can I change the "Mailchimp Subscription Link" in HTML and WHMCS Template both?

We added a speacial feature 'mailchimp interrogation support' on this theme and will be add it to our future themes also.

• For HTML Template: Open Your Desired '.html' file. (For Example, 'index.html')
• For WHMCS Template: Open 'footer.tpl' file.
• Then Search For the Comment '<!-- Subscribe Form Start -->'
• Update The 'action="..."' attribute value from there

How can I change the "About Us Text" (Footer Area) in HTML and WHMCS Template both?

• For HTML Template: Open Your Desired '.html' file. (For Example, 'index.html')
• For WHMCS Template: Open 'footer.tpl' file.
• Then Search For '<!-- Footer About Widget Start -->'
• Update The 'Text' and 'Link'

How can I change "Social Links" (Footer) in HTML and WHMCS Template both?

• For HTML Template: Open Your Desired '.html' file. (For Example, 'index.html')
• For WHMCS Template: Open 'footer.tpl' file.
• Then Search For the Comment '<!-- Footer About Widget Start -->'
• Change The 'Text' and anchor link 'href="#"' from there

How can I change "Copyright Text" in HTML and WHMCS Template both?

• For HTML Template: Open Your Desired '.html' file. (For Example, 'index.html')
• For WHMCS Template: Open 'footer.tpl' file.
• Then Search For the Comment '<!-- Footer Copyright Start -->'
• Update The 'Text and Link' from there

How can I add my "Email Address" (Sendmail.php)?

• Open Up your 'sendmail.php' file.
• Then Search For the Comment '// Replace this with your own email address'
• Update The Email Address'example@example.com' and Owner Name 'Example' from there

How can I change the "YouTube Video Link" (Blog Page)?

• Open Up your 'blog.html' file.
• Then Search For the Comment '<!-- Blog Post YouTube Video Start -->'
• Update The 'YouTube Vido Link' from there

How can I change the "Vimeo Video Link" (Blog Page)?

• Open Up your 'blog.html' file.
• Then Search For the Comment '<!-- Blog Post Vimeo Video Start -->'
• Update The 'Vimeo Vido Link' from there

How can I change the "Local Video Link" (Blog Page)?

• Open Up your 'blog.html' file.
• Then Search For the Comment '<!-- Blog Post Local Video Start -->'
• Update The 'Vimeo Vido Link' from there

How can I change the "Local Audio Link" (Blog Page)?

• Open Up your 'blog.html' file.
• Then Search For the Comment '<!-- Blog Post Local Audio Start -->'
• Update The 'Vimeo Vido Link' from there

How can I change the "Soundcloud Audio Link" (Blog Page)?

• Open Up 'blog.html' file.
• Then Search For the Comment '<!-- Blog Post Soundcloud Audio Start -->'
• Update The 'Vimeo Vido Link' from there

How can I remove "Color Switcher"?

• Open 'main.js' file.
• Then Search For the Comment '* COLOR SWITCHER'
• Remove the code block.