We are pleased that you have chosen MULTIKART theme for your site and we will not disappoint you with your choice. MultiKart is an excellent theme develop with a concise approach. The code written is a clean and well structured.
MultiKart is the most powerful & responsive theme with all the modules and functions involved with an attractive design.
MultiKart theme template is build focusing on HTML and CSS3 and works perfectly fine in all the browsers and it is powered by jQuery.
Multikart theme include total 50+ pre-built home page layouts, 32 inner pages, 17 product pages, and 12 shop pages and backe-end admin.
We request to have a look at our MultiKart Doc to know brief about the theme! We have included each and every detail for you in this doc 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.
Read the doc before jumping to start!
When you unpack downloaded archive from ThemeForest.net you'll get folder containing 2 folders.
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"
If you want RTl theme, changes is below:
<!-- Add class rtl in body tag -->
<body class="rtl">
Multikart include 12 color option, You need to change style css.
<link rel="stylesheet" type="text/css" href="../assets/css/color1.css"
>
<link rel="stylesheet" type="text/css" href="../assets/css/color2.css"
>
... as on
If you want to use another color, change --theme-deafult variable in style scss
--theme-deafult: #ec8951;
<!--Google font-->
<link href="https://fonts.googleapis.com/css?family=Lato:300,400,700,900" rel="stylesheet">
Skeleton screen is a low fidelity UI into which information is gradually loaded. It gives users a visual cue that the content is being loaded into each UI element.
Skeleton Screen when used as the feature in the product make people perceive that app/website is loading fast. Improved perceived performance not only provide good UX but also helps in increasing conversion ratio.
there is a loader section in starting of every front end html pages. you can remove it by just delete that section.
<!-- loader start -->
<div class="loader_skeleton">
...
</div>
<!-- loader end -->
Skeleton screen is a low fidelity UI into which information is gradually loaded. It gives users a visual cue that the content is being loaded into each UI element.
Skeleton Screen when used as the feature in the product make people perceive that app/website is loading fast. Improved perceived performance not only provide good UX but also helps in increasing conversion ratio.
there is a loader section in starting of every front end html pages. you can remove it by just delete that section.
<!-- Brand Logo -->
<div class="brand-logo">
<a href="index.html"> <img src="../assets/images/icon/logo.png" class="img-fluid" alt=""></a>
</div>
<!-- footer logo -->
<div class="footer-logo">
<img src="../assets/images/icon/logo.png" alt="">
</div>
Vertical & Horizontal menu
<!-- Vertical Menu -->
<ul id="sub-menu" class="sm pixelstrap sm-vertical ">
...
</ul>
<!-- Horizontal menu -->
<ul id="main-menu" class="sm pixelstrap sm-horizontal">
..
</ul>
Dropdown and Mega menu
<!-- dropdown menu -->
<li><a href="#">pages</a>
<ul>
..
</ul>
</li>
<!-- mega menu -->
<li class="mega"><a href="#">Home</a>
<ul class="mega-menu">
<li>
..
</li>
</ul>
</li>
<div class="footer-end">
<p><i class="fa fa-copyright" aria-hidden="true"></i> 2017-18 theme forest powered by pixelstrap</p>
</div>