# Jano - Creative Multipurpose Bootstrap 5 Template

# Jano - Creative Multipurpose Bootstrap 5 Template v1.0

## Thank you

First of all, thank you for purchasing the `Jano` HTML5 Template. You can find the detailed information about the template in this document. If there is anything you cannot find in this document, you can send an e-mail via the profile page.

# Jano In A Brief

Jano is a multi-purpose, powerful, beautiful and high-performance website template which is Designed for Business and Corporate websites.
In download folder you will find Three folder:

- `Documentation` (Documentation for main template)
- `Template` (Main Template)
- `Figma file` (Free Figma File Download link)

Remember, when you want to use the shortcode/element in any pages you need to adjust the section spacing by giving `margin` or `padding`. Don't get panic if you messed up anything when you edit the template. We are always available to support our customer.
You can contact our developer directly by email or in Fiverr. or in Upwork or in PPH

# 1Installation

Follow the steps below to setup your site template:

1. Unzip the downloaded package and open the `Template` folder to find all the template files. You wil get `Jano` folder in there. You need to upload this folder to your hosting web server using FTP or cPanel in order to use it on your website.
2. Below is the folder structure you will see in your website root directory:
   - `Jano/css` - Stylesheet files
   - `Jano/fonts` - Icon/fonts files
   - `Jano/images` - Image files
   - `Jano/inc` - contact from file
   - `Jano/js` - js files
   - `Jano/vendor` - plugins files
3. You need to upload all or specific HTML files as per your need.
4. And now you are ready to go to generate your webiste with this awesome template.

# 2HTML Structure

We are used Bootstrap`v5.1.3` framework in this template.
The general template structure is the same throughout the template. Here is the general structure.

The code block above is powered by SyntaxHighlighter.

# 3Favicon Settings

Favicon Will be found in `head` section.

            <link rel="icon" type="image/png" sizes="56x56" href="images/fav-icon/icon.png">

# 4Logo Settings

The Logo will be found in the `Theme Main Menu` section.

            <div class="logo order-lg-0"><a href="index.html" class="d-block"><img src="images/logo/logo_01.png" alt="" width="95"></a></div>

You can replace any `.jpg` `.png` `.svg` logo. And set the `width` according to your logo size.

# 5Fonts Settings

In `Jano` we use `gordita` and `recoleta` font.
You can change both fonts form `css/style.css` file:

                @import url('../fonts/gordita/stylesheet.css');
                @import url('../fonts/recoleta/stylesheet.css');

# 6Activeted PHP Contact Form

You can edit your form simply and quickly. Open `contact.php` from `inc` folder and add your email into `$sendTo` field

        <?php
    /*
     *  CONFIGURE EVERYTHING HERE
     */

    // an email address that will be in the From field of the email.
    $from = 'Jano <demo@domain.com>';

    // an email address that will receive the email with the output of the form
    $sendTo = 'Jano contact form <demo@domain.com>'; // Add Your emnail here

    // subject of the email
    $subject = 'New message from Jano';

    // form field names and their translations.
    // array variable name => Text to appear in the email
    $fields = array('name' => 'Name', 'email' => 'Email', 'message' => 'Message');

    // message that will be displayed when everything is OK :)
    $okMessage = 'Thank you, We will get back to you soon!';

    // If something goes wrong, we will display this message.
    $errorMessage = 'There was an error while submitting the form. Please try again later';

    ?>

# 7CSS Structure

The `style.css` file contains all of the specific stylings for the page. The file is separated into sections using:

- #### bootstrap.min.css

  This file includes core bootstrap styles

  Source

- #### bootstrap-icons.css

  This file contains bootstrap icon library

  Source

  ##### Example

  `<i class="bi bi-person"></i>`

- #### font-awesome.css

  This file contains styles about Fontawesome icon library

  Source

  ##### Example

  `<i class="fab fa-facebook-square"></i>`

- #### jquery.fancybox.min.css

  This file contains styles about `fancybox`

- #### animate.min.css

  `animate.css` is a bunch of cool, fun, and cross-browser animations for you to use in projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.

  Source

  ##### Example

  `<div class="wow fadeInUp"> ... </div>`

- #### slick.css

  This file contains styles about slick carousel plugin

  Source

- #### style.css

  All styles about template

# 8JavaScripts

- #### jQuery 3.5.0

  jQuery is a fast, small, and feature-rich JavaScript library.

  Source

- #### bootstrap.min.js

  Core bootstrap js file

  Source

- #### slick.min.js

  jQuery carousel plugin from Slick

  Source

- #### wow.min.js

  A lightweight script to animate scrolling.Reveal Animations When You Scroll.

  Source

- #### jquery.fancybox.min.js

  fancyBox is a tool that offers a nice and elegant way to add zooming functionality for images, html content and multi-media on your webpages.

  Source

- #### theme.js

  This file contains all script about site.

# 9Credits

- #### Bootstrap

- #### Stock Image Unsplash

- #### Fontawesome

- #### Animate.css

# 10Changelog:

Dates are formated in `dd/mm/yy`

                    ________________________________
                    ----- (15/08/2022) ------
                    Page Added:
                    -About Us for agency
                    -Service for agency
                    -Contact Us for agency
                    -Feature for Sass Product
                    -Pricing for Sass Product
                    -Hosting Plans + comparison
                    -Hosting Technology
                    -Contact Us for Hosting
                    -About Us for Lead Generation
                    -Contact Us for Lead Generation

                    ________________________________
                    ----- (27/07/2022) ------
                    First Published