372 lines
16 KiB
HTML
372 lines
16 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<title>Ekka - Ecommerce Admin Template.</title>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<meta name="description" content="Ekka - Ecommerce Admin Template.">
|
||
|
|
<meta name="keywords"
|
||
|
|
content="admin template, html admin dashboard, dashboard, admin panel, apparel, catalog, clean, ecommerce, ecommerce HTML, electronics, fashion, html eCommerce, html store, minimal, multipurpose, multipurpose ecommerce, online store, responsive ecommerce template, shops">
|
||
|
|
<meta name="author" content="">
|
||
|
|
|
||
|
|
<link rel="shortcut icon" href="img/favicon.png">
|
||
|
|
<link href='https://fonts.googleapis.com/css?family=Lato:100,400,700' rel='stylesheet' type='text/css'>
|
||
|
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous">
|
||
|
|
|
||
|
|
<!-- Bootstrap stylesheet -->
|
||
|
|
<link rel="stylesheet" href="css/bootstrap.css">
|
||
|
|
<!-- Site Main stylesheet -->
|
||
|
|
<link rel="stylesheet" href="css/main.css">
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<main>
|
||
|
|
<div class="page-title">
|
||
|
|
<h1>Ekka - Ecommerce Admin Template.</h1>
|
||
|
|
</div>
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-3">
|
||
|
|
<nav class="navigation" id="mainNav">
|
||
|
|
<a class="navigation__link" href="#intro">Introduction</a>
|
||
|
|
<a class="navigation__link" href="#started">Getting Started</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#localinstall">Local Server Installation</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#serverinstall">Live Server Installation</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-c">Customization Settings</a>
|
||
|
|
<a class="navigation__link" href="#resource">Free Resources</a>
|
||
|
|
<a class="navigation__link" href="#thank">Thank You</a>
|
||
|
|
</nav>
|
||
|
|
</div>
|
||
|
|
<div class="col-9">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<section class="col-12 page-section" id="intro">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<div>
|
||
|
|
<h2 class="section-title">Introduction</h2>
|
||
|
|
<div class="intro">
|
||
|
|
<ul>
|
||
|
|
<li><strong>Item Name : </strong>Ekka - Ecommerce Admin Template.</li>
|
||
|
|
<li><strong>Item Version : </strong>3.6</li>
|
||
|
|
<li><strong>Author : ashishmaraviya</strong></li>
|
||
|
|
<li><strong>Copyright : </strong> 2023</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
<p>First of all, thank you so much for purchasing this <b>ekka admin</b> Template and for being my loyal customer. You are awesome! You are entitled to get free lifetime updates to this product + exceptional support from the author directly.</p>
|
||
|
|
<p>This documentation is to help you regarding each step of customization. Please go through the documentation carefully to understand how this template is made and how to edit this properly. Basic <b>HTML, CSS | SCSS & JS</b> knowledge is required to customize this item. You may learn basics <a href="https://www.w3schools.com/" target="_blank"><b> here </b></a> and <a href="https://getbootstrap.com/" target="_blank"><b> here </b></a>.</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="started">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<div>
|
||
|
|
<h2 class="section-title">Getting Started</h2>
|
||
|
|
<h4>Requirements</h4>
|
||
|
|
<p>You will need the following sofwares to customize this template.</p>
|
||
|
|
<ol>
|
||
|
|
<li>Code Editing Software (eg: Visual studio code, Dreamweaver, Sublime Text or Notepad++)</li>
|
||
|
|
<li>For SCSS build up (eg: koala, prepos, codekit etc...)</li>
|
||
|
|
<li>Web Browser for testing (eg: Google Chrome or Mozilla Firefox)</li>
|
||
|
|
</ol>
|
||
|
|
<div class="notes">Note : Be careful while editing the item. If not edited properly, the design layout may break completely. </div>
|
||
|
|
<h4>Include Files</h4>
|
||
|
|
<ul>
|
||
|
|
<li>HTML</li>
|
||
|
|
<li>CSS</li>
|
||
|
|
<li>SCSS</li>
|
||
|
|
<li>JS</li>
|
||
|
|
<li>IMAGES</li>
|
||
|
|
<li>ICON(svg)</li>
|
||
|
|
<li>FONT</li>
|
||
|
|
</ul>
|
||
|
|
<h4>Files Structure :</h4>
|
||
|
|
<ul>
|
||
|
|
<li>css</li>
|
||
|
|
<ul>
|
||
|
|
<li>ecart - ( Main stylesheets )</li>
|
||
|
|
<li>ecart.rtl - ( RTL stylesheets )</li>
|
||
|
|
</ul>
|
||
|
|
<li>img</li>
|
||
|
|
<ul>
|
||
|
|
<li>banner</li>
|
||
|
|
<li>brand</li>
|
||
|
|
<li>category</li>
|
||
|
|
<li>icons</li>
|
||
|
|
<li>logo</li>
|
||
|
|
<li>products</li>
|
||
|
|
<li>review-image</li>
|
||
|
|
<li>ui-icons</li>
|
||
|
|
<li>user</li>
|
||
|
|
<li>vendor</li>
|
||
|
|
</ul>
|
||
|
|
<li>js</li>
|
||
|
|
<ul>
|
||
|
|
<li>bootstrap.bundle.min</li>
|
||
|
|
<li>chart</li>
|
||
|
|
<li>date-range - ( Date Range Picker js files )</li>
|
||
|
|
<li>ekka - ( ekka main js files )</li>
|
||
|
|
</ul>
|
||
|
|
<li>plugins</li>
|
||
|
|
<ul>
|
||
|
|
<li>charts - ( charts plugin files )</li>
|
||
|
|
<li>data-tables - ( data-tables plugin files )</li>
|
||
|
|
<li>daterangepicker - ( daterangepicker plugin files )</li>
|
||
|
|
<li>flag-icons - ( Vflag-icons plugin files )</li>
|
||
|
|
<li>fullcalendar - ( fullcalendar plugin files )</li>
|
||
|
|
<li>jquery - ( jquery plugin files )</li>
|
||
|
|
<li>jquery-zoom</li>
|
||
|
|
<li>material - ( material plugin files )</li>
|
||
|
|
<li>options-sidebar</li>
|
||
|
|
<li>simplebar - ( simplebar plugin files )</li>
|
||
|
|
<li>slick</li>
|
||
|
|
<li>swiper</li>
|
||
|
|
<li>tags-input</li>
|
||
|
|
</ul>
|
||
|
|
<li>scss</li>
|
||
|
|
<ul>
|
||
|
|
<li>bootstrap</li>
|
||
|
|
<li>components</li>
|
||
|
|
<li>pages</li>
|
||
|
|
<li>utilities</li>
|
||
|
|
<li>ekka scss file</li>
|
||
|
|
</ul>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="localinstall">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Local Server Installation</h2>
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<p>➣ There are the Four things to setup & run the theme.</p>
|
||
|
|
|
||
|
|
<h6>1. Install & Start Xampp Server <a class="click-a" href="#step1">Click</a></h6>
|
||
|
|
<h6>2. How to Setup Theme Code Folder <a class="click-a" href="#step2">Click</a></h6>
|
||
|
|
<h6>3. Database Configuration <a class="click-a" href="#step3"> Click</a><span> (this theme have not use any database, because it's html template)</span></h6>
|
||
|
|
<h6>4. Run the theme into browser <a class="click-a" href="#step4">Click</a></h6>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<br>
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<h5 id="step1" class="step-heading"><b>Step-1 : </b> ➣ Install & Start Xampp Server</h5>
|
||
|
|
|
||
|
|
<div class="sub-sec-2">
|
||
|
|
<p>➣ Download the letest version of <span class="f-red"><b>Xampp</b></span> & Install Xampp Server <a class="click-a" href="https://www.wikihow.com/Install-XAMPP-for-Windows" target="_blank">Click</a></p>
|
||
|
|
<p>➣ Click on <span class="f-red"><b>Start</b></span> button to start Apache & MySql into Xampp Server</p>
|
||
|
|
<img class="inst-img" onclick="zoomImage('img/xampp-start-01.png')" src="img/xampp-start-01.png" alt=""/>
|
||
|
|
<p>➣ Now blow image show the running Xampp Server</p>
|
||
|
|
<img class="inst-img" onclick="zoomImage('img/xampp-start-02.png')" src="img/xampp-start-02.png" alt=""/>
|
||
|
|
|
||
|
|
<p class="notes">Now Xammp Instalation process end up here and move to the next step below..</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Setup theme Code Folder -->
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<h5 id="step2" class="step-heading"><b>Step-2 : </b> ➣ How to Setup Theme Code Folder</h5>
|
||
|
|
|
||
|
|
<div class="sub-sec-2">
|
||
|
|
|
||
|
|
<p>➣ Open unzip folder <span class="f-red"><b> ekka - Ecommerce HTML Template</b></span> and copy <span class="f-red"><b>ekka-admin</b></span> folder as show below image</p>
|
||
|
|
<img class="inst-img" src="img/path-image-1.png" alt=""/>
|
||
|
|
|
||
|
|
<p>➣ Now open <span class="f-red"><b>Xampp</b></span> folder</p>
|
||
|
|
<img class="inst-img" src="img/li-php-file-01.png" alt=""/>
|
||
|
|
|
||
|
|
|
||
|
|
<p>➣ After that open <span class="f-red"><b>htdocs</b></span> folder</p>
|
||
|
|
<img class="inst-img" src="img/li-php-file-02.png" alt=""/>
|
||
|
|
|
||
|
|
<p>➣ Now paste already copied<span class="f-red"><b> ekka-admin</b></span> folder into <span class="f-red"><b>htdocs</b></span></p>
|
||
|
|
<img class="inst-img" src="img/path-image-2.png" alt=""/>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
<h5 id="step3" class="step-heading"><b>Step-3 : </b> ➣ Database Configuration</h5>
|
||
|
|
|
||
|
|
<p class="notes">This theme have not use any database, because it's html template and not needed any type of database configuration. theme directly run in localhost or server.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
<h5 id="step4" class="step-heading"><b>Step-4 : </b> ➣ Run the theme into browser</h5>
|
||
|
|
<p>➣ Open <span class="f-red"><b> Browser</b></span> and run the Landing page to type located theme path : <span class="f-red"><b>localhost/ekka-admin/</b></span> as show below image</p>
|
||
|
|
<img class="inst-img" src="img/landing-shot.png" alt=""/>
|
||
|
|
|
||
|
|
|
||
|
|
<p>➣ Now you can take a look on any of the layout by choosing on left of the site sidebar<b> Navigation</b>.</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="serverinstall">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Live Server Installation</h2>
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
<p>➣ There are the Four things to setup & run the theme.</p>
|
||
|
|
|
||
|
|
<h6>1. Hosting Account <a class="click-a" href="#li-step1">Click</a></h6>
|
||
|
|
<h6>2. How to Setup Theme Code Folder <a class="click-a" href="#li-step2">Click</a></h6>
|
||
|
|
<h6>3. Database Configuration <a class="click-a" href="#li-step3"> Click</a><span> (this theme have not use any database, because it's html template)</span></h6>
|
||
|
|
<h6>4. Run the theme into browser <a class="click-a" href="#li-step4">Click</a></h6>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
<!-- Hosting Account -->
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<h5 id="li-step1" class="step-heading"><b>Step-1 : </b> ➣ Hosting Account</h5>
|
||
|
|
|
||
|
|
<div class="sub-sec-2">
|
||
|
|
<p>➣ You must have <span class="f-red"><b>Hosting</b></span> account. And if you don't have please purchase it before move ahed. <a class="click-a" href="https://www.hostinger.in/web-hosting" target="_blank">Click</a></p>
|
||
|
|
|
||
|
|
<p class="notes">Note: I am just giving the example of Hosting account you can purchase any of hosting account that support PHP.</p>
|
||
|
|
|
||
|
|
<p>➣ Get Login into your hostinger account and open dashboard.</p>
|
||
|
|
|
||
|
|
<img class="inst-img" src="img/si-hosting-01.png" alt=""/>
|
||
|
|
|
||
|
|
<p class="notes">Now Hosting account end up here and move to the next step below..</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<!-- Setup theme Code Folder -->
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<h5 id="li-step2" class="step-heading"><b>Step-2 : </b> ➣ How to Setup Theme Code Folder</h5>
|
||
|
|
|
||
|
|
<div class="sub-sec-2">
|
||
|
|
|
||
|
|
<p>➣ From Dashboard Click on <span class="f-red"><b>File Manager</b></span> as show below image</p>
|
||
|
|
<img class="inst-img" src="img/si-php-file-00.png" alt=""/>
|
||
|
|
|
||
|
|
<p>➣ Now upload <span class="f-red"><b>ekka-admin.zip</b></span> folder into server</p>
|
||
|
|
<img class="inst-img" src="img/si-php-file-01.png" alt=""/>
|
||
|
|
|
||
|
|
<p>➣ After upload unzip this folder as shown below image</p>
|
||
|
|
<img class="inst-img" src="img/si-php-file-02.png" alt=""/>
|
||
|
|
|
||
|
|
<p class="notes">Now the Theme Code setup is finished here move to the next step below..</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
<h5 id="li-step3" class="step-heading"><b>Step-3 : </b> ➣ Database Configuration</h5>
|
||
|
|
|
||
|
|
<p class="notes">This theme have not use any database, because it's html template and not needed any type of database configuration. theme directly run in localhost or server.</p>
|
||
|
|
</div>
|
||
|
|
<!-- Run theme into Browser -->
|
||
|
|
<div class="sub-sec-1">
|
||
|
|
|
||
|
|
<h5 id="li-step4" class="step-heading"><b>Step-4 : </b> ➣ Run the theme into browser</h5>
|
||
|
|
|
||
|
|
<div class="sub-sec-2">
|
||
|
|
|
||
|
|
<p>➣ Open <span class="f-red"><b> Browser</b></span> and run the "Landing page" to type located theme path : <span class="f-red"><b>yourdomain.com/ekka-admin/</b></span> as show below image</p>
|
||
|
|
<img class="inst-img" src="img/landing-shot-li.png" alt=""/>
|
||
|
|
|
||
|
|
|
||
|
|
<p>➣ Now you can take a look on any of the layout by choosing on top of the site<b> menu</b>.</p>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-c">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Setting Sidebar</h2>
|
||
|
|
<p>Below are the list of all features available to customize the backend panel as per you want. </p>
|
||
|
|
|
||
|
|
<p><b>➣ Header Layout </b>: If you want to set Header Layout Fixed | Static then, you can do it from setting sidebar.</p>
|
||
|
|
<p><b>➣ Sidebar Layout </b>: Change into sidebar layout with multiple option.</p>
|
||
|
|
<p><b>➣ Header Background </b>: If you want to change the Header background color.</p>
|
||
|
|
<p><b>➣ Navigation Background </b>: If you want to change the Navigation background color.</p>
|
||
|
|
<p><b>➣ Spacing Layout </b>: Spacing for whole website into all that elements.</p>
|
||
|
|
|
||
|
|
<img class="inst-img" src="img/setting_sidebar.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="resource">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<div>
|
||
|
|
<h2 class="section-title">Free Resources</h2>
|
||
|
|
<ul>
|
||
|
|
<li>Google Fonts</li>
|
||
|
|
<li>Font Awesome Icons</li>
|
||
|
|
<li>Owl Carousel</li>
|
||
|
|
<li>Slick Carousel</li>
|
||
|
|
<li>Animate</li>
|
||
|
|
<li>Date Range Picker</li>
|
||
|
|
<li>Data Tables</li>
|
||
|
|
<li>Full Calendar</li>
|
||
|
|
<li>Swiper</li>
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section height-100" id="thank">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<div class="thank">
|
||
|
|
<h2 class="section-title">Thank You</h2>
|
||
|
|
<p>Thank you again for download 'ekka', enjoy it and give us ratting.</p>
|
||
|
|
<img src="img/star.png" alt="shapes"></img>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
<!-- theme script -->
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
|
||
|
|
<script src="js/jquery.sticky-sidebar.js"></script>
|
||
|
|
<script src="js/main.js"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|