Documentation - Fruitkha
Author: Imran Hossain
Description: Responsive Bootstrap4 Shop Template, Created by Imran Hossain from https://imransdesign.com/

### About

Fruitkha is a Responsive HTML5 / CSS3 simple, clean and Professional template. It comes with ecommerce pages integrated, which can be used for any kind of shop websites. You will also get deticated news pages for blogging. Sass files are included for easy cutomization

If you need further help or more customization for this template please ping me at imransdesign@gmail.com

I provide follwinfg services:

- Custom WordPress theme from scratch. (I have my own theme at WordPress repository, so you will get latest best practiced WordPress standard coding from me.)
- WordPress theme customizations
- WordPress websites using Elementor
- WordPress websites using WP-Backery
- Custom Html5/CSS3 templates from scratch.
- Html5/CSS3 template customizations
- Knock me at imransdesign@gmail.com

### How to use

Upload everything found inside "Fruitkha" folder into your ftp server. This folder contains all files of the template.

- assets
  - bootstrap
  - css
  - img
  - js
  - webfonts
- html files

### Preloader

There is a preloader integrated, so assets (text,images,video) load first & only then the layout is visible. If you want to change the color, change following codes from main.css file or related scss file(common.scss):

###### CSS code

    .circle:before {
      border-left: 3px solid #F28123;
    }
    .circle:after {
      border-left: 3px solid #F28123;
      border-right: 2px solid #000;
    }

###### HTML code

### Logo

You can find the logo section in main menu wrapper, where it can be visible in the template. Now add/update your own logo image ( You can create logo of your choice by any editor.) that should be replaced with same name in the img folder. You can also see the included files of menu and header styles. If you would like to add any other styles, make sure that you are maintaining the code format as it is.

Here is the logo path: assets/img/logo.png

###### HTML code

### Mean menu

We have used mean menu to create the menu item. Mean menu does not have dropdown in default, but don'tt worry we created this for you. If you want dropdown, just create an unorder list between the main list item & give it a class named "submenu"

###### HTML code examples:

      News

### Slider

We have got amazing owl carousel for home page slider.

###### To change the text, find this code:

#

                  Fresh & Organic
                  Delicious Seasonal Fruits

                    Fruit Collection
                    Contact Us

###### To change the background images, find this css code:

      .homepage-bg-1 {
        background-image: url(../img/hero-bg.jpg);
      }

      .homepage-bg-2 {
        background-image: url(../img/hero-bg-2.jpg);
      }

      .homepage-bg-3 {
        background-image: url(../img/hero-bg-3.jpg);
      }

### Page Sections

We have created simple page sections with editable paddings and titles. There are 80px,100px & 150px versions to adjust the spacing.

###### html Code

You can also add the Gray background color to the sections. Find the class "gray-bg" & add it to any section you want.

###### Css Code

    .gray-bg {
      background-color: #f5f5f5;
    }

### Contact Form

We have included smart forms that has great features like validation check without any page refresh.

Include the following files in your footer section of the page. Please ensure that all of them have the correct path:

###### Smart Forms Links Required Files

###### HTML Code

For your email addresses, Open below php file and go to line number 41 and find the following code. Here you can add your email id. Use local email address, ex: support@fruitkha.com (because for some servers gmail, yahoo etc do not work properly!)

mail.php

###### PHP Code

    	$to = 'support@fruitkha.com';

### Google Maps

Direct embed google maps in your pages using iframe

### Support

Still If you have any questions, please feel free to email via my profile page contact form here.

### Credits

This scripts helped us to create this beautiful template:

- Bootstrap
- Fontawesome
- Owl Carousel
- Magnific Popup
- Animate.css
- Mean Menu
- jQuery Countdown
- Isotope
- Waypoint
- Sticker