Welcome to Fastkart!

• We are pleased that you have chosen Fastkart template for your site and we will not disappoint you with your choice. Fastkart is an excellent template develop with a concise approach. The code written is a clean and well structured.
• Fastkart is the most powerful & responsive template with all the modules and functions involved with an attractive design.
• Fastkart template is build focusing on HTML and CSS3 and works perfectly fine in all the browsers and it is powered by jQuery.
• Fastkart template has more than 39 html pages which include 5 demo page, 5 product pages, 7 shop pages, 3 blog pages and 20 other pages.
• We request to have a look at our Fastkart document to know brief about the template! We have compromised each and every detail for you in this manual that you will need.
• If we are unable to answer your queries beyond our documentation, you are free to contact us through the themeforest support page with your site. We will be happy to cater you and will get back to you in no time.

• Responsive Design : Looks great on desktops, laptop, tables and mobiles. Give it a try on your iPhone or iPad now.
• RTL Supported : All Demos and inner pages of Fastkart are RTL supported.
• Dark : Useful feature of Night Owls or people who work during the night. The dark background will put less strain on the eyes.
• 30+ Html pages : Fastkart has 30+ html pages.
• Made with Sass : Fastkart is made with sass.
• W3 Validator : This template coded with beautiful and clean code! Some powerful HTML files 100% valid W3 web standards.
• Cookie bar : Fastkart have 1 cookie bar popup design.
• Product Zooming : Product four image page has zooming feature.
• Quick-view : Every product has Quick view modal popup.
• Multi-Browser Support : Fastkart has multi broswer support.
• Fully Customizable : You can fully customize.
• Bootstrap 5 : Fastkart made by bootstrap 5 lates version.
• Google Font : You can use unlimited Google Fonts.
• Amazing Mega-menu : A Completely different mega-menu with poswerfully functionality and flexible layout.
• Product Hover Veration : This template has 4 product hover variations.
• Multiple Header : Fastkart template hase 3 header ooptions.

When you unpack downloaded archive from ThemeForest.net you'll get folder containing 2 folders.

1. Documentation - Documentation for Fastkart HTML site template
2. Template - Fastkart Main Folder

First, you must download and install node.js. NPM stands for node packaged modules and is a way to manage development dependencies through Node.js.

Download the Node.js source code or a pre-built installer for your platform, and start developing, you can download it from nodejs.org

You can check it in your terminal window using these commands node --version and npm --version.

GulpJS is a toolkit for automating painful or time-consuming tasks in your development workflow, so you can stop messing around and build something.

• Navigate to the root main/directory,default

• Then use $ npm i command (install node js)

• $ gulp command (for run project)

NPM use the package.json file and automatically install the required local dependencies listed in it.

dependencies are : gulp, browser-sync, gulp-autoprefixer, gulp-livereload, gulp-pug, gulp-sass, livereload

We have added all necessary gulp task in gulpfile.js, for more details about plugin refer this link https://gulpjs.com/plugins/

Go to Gulpfile.js

proxy: "localhost/Your project name"

In Fastkart template, google fonts have been used. google fonts are open source and easy to use. Fastkart have used following fonts:

• Public Sans, sans-serif

you can use different google fonts. following are the steps

1. Go to Google Fonts.
2. Use the filters on the left-hand side to display the kinds of fonts you want to choose and choose a couple of fonts you like.
3. To select a font family, press the ⊕ button alongside it.
4. When you've chosen the font families, press the [Number] Families Selected bar at the bottom of the page.
5. In the resulting screen, you first need to copy the line of HTML code shown and paste it into the head of your HTML file. Put it above the existing element, so that the font is imported before you try to use it in your CSS
6. You then need to copy the CSS declarations listed into your CSS as appropriate, to apply the custom fonts to your HTML.

In Fastkart template, we have used 4 colors or 4 styles. following are the colors:

• theme-color-1: #0da487
• theme-color-2: #d99f46
• theme-color-3: #0baf9a
• theme-color-4: #0a7e1d

If you want to change demo color you have to add class in body tag theme-color{2,3,4} by default it take demo 1 color

<!-- Add class to body tag -->
<body class="theme-color-1">

Fastkart have mainly used FontAwesome Icons. FontAwesome icons available in FontAwesome.com/icons, other icons are available in assets/images/icon

how to use FontAwesome font

• You can place Font Awesome icons just about anywhere using a style prefix and the icon's name.
• To reference an icon, you need to know two bits of information. 1) its name, prefixed with fa- (meaning “font awesome” naturally!) and 2) the style you want to use's corresponding prefix**.

for example:

how to use Feather Icon

• To use an icon on your page, add a data-feather attribute with the icon name to an element:
• See the complete list of icons at feathericons.com.

for example:

If you want RTl template, changes are below:

<!-- Add direction rtl in html tag -->
<html lang="en" dir="rtl"
<link id="rtl-link" rel="stylesheet" type="text/css" href="../assets/css/vendors/bootstrap.rtl.css">

If you want Dark template, changes are below:

<!-- Replace style.css with dark.css -->
<link id="color-link" rel="stylesheet" type="text/css" href="../assets/css/dark.css">

<!-- add class dark in html tag -->
<body class="dark">

If you use image as background than add class ".bg-img" in image and add below class in parent.

• .ratio_30 - 30%
• .ratio_35 - 35%
• .ratio_50 - 50%
• .ratio_60 - 60%
• .ratio_65 - 65%
• .ratio_87 - 87%
• .ratio_125 - 125%
• .ratio_148 - 148%
• .ratio_156 - 156%
• .ratio_medium - 134%
• .ratio_180 - 180%
• .ratio_209 - 209%

RTL button is for demo purpose only, following is the steps to remove that buttons:

1. Remove code from HTML file, you can find it on the bottom of the page and above the script.
2. Remove theme-setting.js from bottom of the page.
3. Remove _theme-setting.scss(assets/scss/themes/_theme-setting.scss) from style.scss(assets/scss/style.scss)
   and compile using gulp or any other compiler software.

without this plugins and products, our template will be incomplete.

• Bootstrap: https://getbootstrap.com/
• Feather Icon: https://feathericons.com/
• Font Awesome: https://fontawesome.com/
• Slick slider: https://kenwheeler.github.io/slick/

Once again thank you for purchasing one of our Templates , if you like our Templates please rate us

Best Regards, Pixelstrap