Customization

1.Introduction

So you’ve just purchased an HTML template and now you have to customize it before you can put it online, but you’re not experienced with code so you’re not sure how to go about it. Well, rest easy, because in this tutorial we’re going to step you through the entire process. We’re going to be working off the assumption you’ve never seen a line of HTML before, let alone edited one, so no matter how new you are to working with code you’ll be shown exactly what to do every step of the way. Let’s start at the very beginning. You may learn basics here, here and here.

• How to Customize an HTML Template
• How to Customize Bootstrap
• How to change color scheme

2.Getting Started

If you are able to read this documentation locally, which means you have successfully downloaded the package and extracted the zip.
The file structure as follows :

    
  Multipurpose  HTML
  ├── Documentation/   
  ├── HTML/
  │   ├── css/
  │   ├── fonts/
  │   ├── images/  
  │   ├── js/  
  │                               

The folder you have to customize is the HTML folder. Copy HTML folder from the package and paste it in your Project Folder.
(This helps you to prevent overwriting in original files. so if you messed up something, you will get the original here.)

3.Requirements

You will need the following sofwares to customize this template.

1. Code Editing Software (eg: Brackets,Dreamweaver, Sublime Text or Notepad)
2. Web Browser for testing (eg: Google Chrome or Mozilla Firefox)
3. FTP Tool to upload files to Server (eg: FileZilla)

4.Enable/Disable Back to top button

You can Enable or Disable Back to top button (scroll top) by adding "true" of "false" keywords to the function

1. Open main.js file from ProjectName > js > main.js
2. Find Back to top button function (Check below image )
3. By default, Back to top button is enabled and set as "true"
4. To disable Back to top button, change keyword "true" into "false"
5. To enable Back to top button, change keyword "false" into "true"

5.Enable/Disable Animations

You can Enable or Disable animations

1. To Disable animations, Remove "scrollreveal.min.js" javascript from html (check below image)
2. To Enable Add "scrollreveal.min.js" javascript to html

6.Enable/Disable Animations in mobile screens

You can Enable or Disable animations only in mobile phones also.

1. To Disable animations, make default attribute in javascript to "false" custom javascript (check below image)
2. To Enable set the deafault value "true" (By default it will be set to true)