Fruitkha

Responsive Bootstrap4 Shop Template

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:

How to use

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

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: