946 lines
107 KiB
HTML
946 lines
107 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<title>Ekka - Ecommerce HTML 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 HTML Template.">
|
||
|
|
<meta name="keywords"
|
||
|
|
content="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>oBanana B2B - Elevate Your Business</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">Colors Customization</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-b">Background Customization</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-d">Darkmode Customization</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-rtl">RTL Customization</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-w">Whatsapp plugin</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#cust-el">Elements</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#customization">Customization & Source Files</a>
|
||
|
|
<a class="navigation__link dark_bg" href="#d-customization">Demo Home Page Customize</a>
|
||
|
|
<a class="navigation__link dark_bg_red" href="#r-msg">Remove Popup</a>
|
||
|
|
<a class="navigation__link dark_bg_red" href="#c-hf">Custom Header & Footer</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>oBanana B2B - Elevate Your Business</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</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(Demo images only)</li>
|
||
|
|
<li>ICON(svg)</li>
|
||
|
|
<li>FONT</li>
|
||
|
|
</ul>
|
||
|
|
<h4>Files Structure :</h4>
|
||
|
|
<ul>
|
||
|
|
<li>css</li>
|
||
|
|
<ul>
|
||
|
|
<li>Backgrounds - ( Background stylesheets )</li>
|
||
|
|
<li>Plugins - ( Plugin stylesheets )</li>
|
||
|
|
<li>Vendor - ( Vendor stylesheets )</li>
|
||
|
|
</ul>
|
||
|
|
<li>fonts</li>
|
||
|
|
<ul>
|
||
|
|
<li>ecicons - ( All svg icons )</li>
|
||
|
|
<li>fjalla - ( fjalla fonts )</li>
|
||
|
|
<li>montserrat - ( montserrat fonts )</li>
|
||
|
|
<li>poppins - ( poppins fonts )</li>
|
||
|
|
<li>oswald - ( oswald fonts )</li>
|
||
|
|
</ul>
|
||
|
|
<li>images</li>
|
||
|
|
<ul>
|
||
|
|
<li>banner</li>
|
||
|
|
<li>bg</li>
|
||
|
|
<li>blog-image</li>
|
||
|
|
<li>brand-image</li>
|
||
|
|
<li>cat-banner</li>
|
||
|
|
<li>category-image</li>
|
||
|
|
<li>common</li>
|
||
|
|
<li>email-template</li>
|
||
|
|
<li>favicon</li>
|
||
|
|
<li>icons</li>
|
||
|
|
<li>instragram-image</li>
|
||
|
|
<li>logo</li>
|
||
|
|
<li>main-slider-banner</li>
|
||
|
|
<li>menu-banner</li>
|
||
|
|
<li>offer-image</li>
|
||
|
|
<li>product-360</li>
|
||
|
|
<li>product-image</li>
|
||
|
|
<li>review-image</li>
|
||
|
|
<li>testimonial</li>
|
||
|
|
<li>user</li>
|
||
|
|
<li>vendor</li>
|
||
|
|
<li>whatsapp</li>
|
||
|
|
</ul>
|
||
|
|
<li>js</li>
|
||
|
|
<ul>
|
||
|
|
<li>plugins - ( Plugins js files )</li>
|
||
|
|
<li>vendor - ( Vendors js files )</li>
|
||
|
|
</ul>
|
||
|
|
<li>scss</li>
|
||
|
|
<ul>
|
||
|
|
<li>base - ( typography, font familys )</li>
|
||
|
|
<li>bootstrap - ( Bootstrap folder )</li>
|
||
|
|
<li>components - ( Component stylesheets )</li>
|
||
|
|
<li>layout - ( Layout stylesheets )</li>
|
||
|
|
<li>pages - ( Sub Pages stylesheets )</li>
|
||
|
|
<li>utilities - ( Mixins & variable stylesheets )</li>
|
||
|
|
</ul>
|
||
|
|
<li>video</li>
|
||
|
|
</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-html</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-html</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-html/</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 top of the site<b> menu</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-html.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-html/</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">Colors Customization</h2>
|
||
|
|
<p>If you want to apply skin color 4 (skin-04.css) then, you can add path like bellow image on every html files in head tag. </p>
|
||
|
|
<img class="inst-img" src="img/skin.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-b">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Background Customization</h2>
|
||
|
|
<p>If you want to apply Background 2 (bg-2.css) then, you can replace path like bellow image on every html files in head tag. </p>
|
||
|
|
<img class="inst-img" src="img/bg.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-d">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Dark mode Customization</h2>
|
||
|
|
<p>If you want to apply Dark mode (dark.css) then, you can add path like bellow image on every html files in head tag. </p>
|
||
|
|
<div style="margin-bottom:30px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/dark.css"</span><span style="color: #333333"><span> class</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"dark"</span>></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<img class="inst-img" src="img/dark.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-rtl">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">RTL mode Customization</h2>
|
||
|
|
<p>If you want to apply RTL mode (rtl.css) then, you can add path like bellow image on every html files in head tag. </p>
|
||
|
|
<div style="margin-bottom:30px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/rtl.css"</span><span style="color: #333333"><span> class</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"rtl"</span>></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<img class="inst-img" src="img/rtl.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-w">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Whatsapp plugin Customization (Add custom number)</h2>
|
||
|
|
<p>Customers can directly contact with you via whatsapp. You can replace whatsapp number and messages like bellow image.</p>
|
||
|
|
<img class="inst-img" src="img/whatsapp.png" alt="skin">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="cust-el">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Elements Customization (Add custom element)</h2>
|
||
|
|
<h5>Elemets Products ( elemets-products.html )</h5>
|
||
|
|
<p>If you want use other product card design then copy code which you want design and paste it.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> START single card <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-product-ds"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-product-image"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span> class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"image"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>img class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"pic-1"</span> src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/product-image/pro_1/1_1.jpg"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">""</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>span class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-product-discount-label"</span><span style="color: #333333">>-</span><span style="color: #0000DD; font-weight: bold">33</span><span style="color: #333333">%</</span>span<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"links"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span> data<span style="color: #333333">-</span>tip<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Add to Wishlist"</span><span style="color: #333333">><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/icons/wishlist.svg"</span>
|
||
|
|
class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"svg_img header_svg pro_svg"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"wishlist"</span> <span style="color: #333333">/></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span> data<span style="color: #333333">-</span>tip<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Compare"</span><span style="color: #333333">><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/icons/compare.svg"</span>
|
||
|
|
class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"svg_img pro_svg"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"compare"</span> <span style="color: #333333">/></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span> data<span style="color: #333333">-</span>tip<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Quick View"</span><span style="color: #333333">><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/icons/quickview.svg"</span>
|
||
|
|
class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"svg_img pro_svg"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"quick view"</span> <span style="color: #333333">/></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-product-body"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-rating"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-star fill"</span><span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-star fill"</span><span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-star fill"</span><span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-star fill"</span><span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-star"</span><span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h3 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-title"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>Men<span style="background-color: #fff0f0">'s Blazer</a></h3></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-price"</span><span style="color: #333333">><</span>span<span style="color: #333333">></span><span style="color: #FF0000; background-color: #FFAAAA">$</span><span style="color: #6600EE; font-weight: bold">90.00</span><span style="color: #333333"></</span>span<span style="color: #333333">></span> <span style="color: #FF0000; background-color: #FFAAAA">$</span><span style="color: #6600EE; font-weight: bold">66.00</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">" ec-add-to-cart"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>add to cart<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--/</span>END single card <span style="color: #333333">--></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h5>Elemets Typography ( elemets-typography.html )</h5>
|
||
|
|
<p>If you want use other title style then copy code which you want style and paste it.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>h1 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-fw-bold ec-fc"</span><span style="color: #333333">></span>HEADING H1<span style="color: #333333"></</span>h1<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
<p>If you want use other list style then copy code which you want style and paste it.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-lg-2 col-md-4 col-sm-6 col-6"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-disc"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">></span>Friday<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">></span>Monday<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">></span>Saturday<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">></span>Wednesday<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Elemets Title ( elemets-title.html )</h5>
|
||
|
|
<p>If you want use other Title style then copy code which you want style and paste it.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>h2 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-title-ds"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>span<span style="color: #333333">></span>Title Style <span style="color: #0000DD; font-weight: bold">1</span><span style="color: #333333"></</span>span<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>h2<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Elemets Categories ( elemets-categories.html )</h5>
|
||
|
|
<p>If you want use other Category style then copy code which you want style and paste it.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec_cat_content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec_cat_inner"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-cat-image"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/category-image/1.jpg"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"slider category img"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-cat-desc"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>span class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-section-btn"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span> class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn-primary"</span><span style="color: #333333">></span>Sofa chair<span style="color: #333333"></</span>a<span style="color: #333333">></</span>span<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h5>Elemets Buttons ( elemets-buttons.html )</h5>
|
||
|
|
<p>If you want use other Buttons style then copy code which you want style and paste it.</p>
|
||
|
|
<div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-btn-ds"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn"</span><span style="color: #333333">></span>Default<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary"</span><span style="color: #333333">></span>Primary<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-secondary"</span><span style="color: #333333">></span>Secondary<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-success"</span><span style="color: #333333">></span>Success<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-info"</span><span style="color: #333333">></span>Info<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-warning"</span><span style="color: #333333">></span><span style="color: #FF0000; font-weight: bold">Warning</span><span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-danger"</span><span style="color: #333333">></span>Danger<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary disabled"</span><span style="color: #333333">></span>Disabled<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary btn-link"</span><span style="color: #333333">></span>Link<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary btn-jittery"</span><span style="color: #333333">></span>Click Me<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary btn-jelly"</span><span style="color: #333333">></span>Jelly<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>button class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"btn btn-primary btn-pulse"</span><span style="color: #333333">></span>Pulse<span style="color: #333333"></</span>button<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Elemets Tabs ( elemets-tabs.html )</h5>
|
||
|
|
<p>If you want use other Tabs style then copy code which you want style and paste it.</p>
|
||
|
|
<div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tab-wrapper ec-tab-wrapper-1"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-single-pro-tab-wrapper"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-single-pro-tab-nav"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav nav-tabs"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-item"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-link active"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>toggle<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>target<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#ec-spt-nav-details"</span>
|
||
|
|
role<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tablist"</span><span style="color: #333333">></span>Detail<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-item"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-link"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>toggle<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>target<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#ec-spt-nav-info"</span>
|
||
|
|
role<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tablist"</span><span style="color: #333333">></span>More Information<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-item"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"nav-link"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>toggle<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab"</span> data<span style="color: #333333">-</span>bs<span style="color: #333333">-</span>target<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#ec-spt-nav-review"</span>
|
||
|
|
role<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tablist"</span><span style="color: #333333">></span>Reviews<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab-content ec-single-pro-tab-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div <span style="color: #007020">id</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-spt-nav-details"</span> class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab-pane fade show active"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-single-pro-tab-desc"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span>
|
||
|
|
<span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div <span style="color: #007020">id</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-spt-nav-info"</span> class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab-pane fade"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-single-pro-tab-moreinfo"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>It <span style="color: #000000; font-weight: bold">is</span> a <span style="color: #007020">long</span> established fact that a reader will be distracted by the readable
|
||
|
|
content of a page when looking at its layout<span style="color: #333333">.</span> The point of using Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span>
|
||
|
|
that it has a more<span style="color: #333333">-</span><span style="color: #000000; font-weight: bold">or</span><span style="color: #333333">-</span>less normal distribution of letters, <span style="color: #008800; font-weight: bold">as</span> opposed to using
|
||
|
|
<span style="background-color: #fff0f0">'Content here.</p></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div <span style="color: #007020">id</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-spt-nav-review"</span> class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tab-pane fade"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>There are many variations of passages of Lorem Ipsum available, but the majority have
|
||
|
|
suffered alteration <span style="color: #000000; font-weight: bold">in</span> some form, by injected humour, <span style="color: #000000; font-weight: bold">or</span> randomised words which
|
||
|
|
don<span style="background-color: #fff0f0">'t look even slightly believable. If you are going to use a passage of Lorem</span>
|
||
|
|
Ipsum<span style="color: #333333">.</</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h5>Elemets Accordions ( elemets-accordions.html )</h5>
|
||
|
|
<p>If you want use other Accordions style then copy code which you want style and paste it.</p>
|
||
|
|
<div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div <span style="color: #007020">id</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 ec-faq-block"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-title"</span><span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span> <span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 ec-faq-block"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-title"</span><span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span> <span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 ec-faq-block"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-title"</span><span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span> <span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 ec-faq-block"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-title"</span><span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span> <span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 ec-faq-block"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-title"</span><span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-faq-content"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>Lorem Ipsum <span style="color: #000000; font-weight: bold">is</span> simply dummy text of the printing <span style="color: #000000; font-weight: bold">and</span> typesetting industry<span style="color: #333333">.</span> Lorem
|
||
|
|
Ipsum has been the industry<span style="background-color: #fff0f0">'s standard dummy text ever since the 1500s, when an</span>
|
||
|
|
unknown printer took a galley of <span style="color: #007020">type</span> <span style="color: #000000; font-weight: bold">and</span> scrambled it to make a <span style="color: #007020">type</span> specimen
|
||
|
|
book<span style="color: #333333">.</span> It has survived <span style="color: #000000; font-weight: bold">not</span> only five centuries, but also the leap into electronic
|
||
|
|
typesetting, remaining essentially unchanged<span style="color: #333333">.</span> <span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h5>Elemets Blog ( elemets-blog.html )</h5>
|
||
|
|
<p>If you want use other Blog style then copy code which you want style and paste it.</p>
|
||
|
|
<div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"row margin-minus-t-15"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-lg-4 col-md-6 col-sm-6 col-xs-12"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card-grid-space"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card media-1"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-num"</span><span style="color: #333333">></span><span style="color: #4400EE; font-weight: bold">01</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h1<span style="color: #333333">></span>What <span style="color: #000000; font-weight: bold">is</span> the lorem<span style="color: #333333">.</</span>h1<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>The syntax of a language <span style="color: #000000; font-weight: bold">is</span> how it works<span style="color: #333333">.</span> How to actually write it<span style="color: #333333">.</span> Learn HTML syntax<span style="color: #FF0000; background-color: #FFAAAA">…</span>
|
||
|
|
<span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-date"</span><span style="color: #333333">></span><span style="color: #0000DD; font-weight: bold">7</span> jul <span style="color: #0000DD; font-weight: bold">2021-2022</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tags"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tag"</span><span style="color: #333333">></span>READ MORE<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-lg-4 col-md-6 col-sm-6 col-xs-12"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card-grid-space"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card media-2"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-num"</span><span style="color: #333333">></span><span style="color: #4400EE; font-weight: bold">02</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h1<span style="color: #333333">></span>What <span style="color: #000000; font-weight: bold">is</span> the lorem<span style="color: #333333">.</</span>h1<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>The syntax of a language <span style="color: #000000; font-weight: bold">is</span> how it works<span style="color: #333333">.</span> How to actually write it<span style="color: #333333">.</span> Learn HTML syntax<span style="color: #FF0000; background-color: #FFAAAA">…</span>
|
||
|
|
<span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-date"</span><span style="color: #333333">></span><span style="color: #0000DD; font-weight: bold">6</span> jul <span style="color: #0000DD; font-weight: bold">2021-2022</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tags"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tag"</span><span style="color: #333333">></span>READ MORE<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-lg-4 col-md-6 col-sm-6 col-xs-12 m-auto"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card-grid-space"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-card media-3"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-num"</span><span style="color: #333333">></span><span style="color: #4400EE; font-weight: bold">03</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h1<span style="color: #333333">></span>What <span style="color: #000000; font-weight: bold">is</span> the lorem<span style="color: #333333">.</</span>h1<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>p<span style="color: #333333">></span>The syntax of a language <span style="color: #000000; font-weight: bold">is</span> how it works<span style="color: #333333">.</span> How to actually write it<span style="color: #333333">.</span> Learn HTML syntax<span style="color: #FF0000; background-color: #FFAAAA">…</span>
|
||
|
|
<span style="color: #333333"></</span>p<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-date"</span><span style="color: #333333">></span><span style="color: #0000DD; font-weight: bold">5</span> jul <span style="color: #0000DD; font-weight: bold">2021-2022</span><span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tags"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-tag"</span><span style="color: #333333">></span>READ MORE<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<section class="col-12 page-section" id="customization">
|
||
|
|
<div class="container">
|
||
|
|
<div class="row">
|
||
|
|
<div class="col-12">
|
||
|
|
<h2 class="section-title">Customization & Source Files</h2>
|
||
|
|
|
||
|
|
<h4>Fonts</h4>
|
||
|
|
<p>First download fonts which you want. and then paste fonts file in font folder.<br>
|
||
|
|
and Goto "scss > base > _typography", and change. after compile your code and run thml file.</p>
|
||
|
|
<img class="inst-img" src="img/typo.png" alt="typo">
|
||
|
|
<h4>Logo</h4>
|
||
|
|
<p>If you want to change logo. Goto "assets/image/logo" folder and change logo png image.</p>
|
||
|
|
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"index.php"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/logo/logo.png"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Site Logo"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>img class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"dark-logo"</span> src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/logo/dark-logo.png"</span> alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Site Logo"</span> style<span style="color: #333333">=</span><span style="background-color: #fff0f0">"display: none;"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Menus</h4>
|
||
|
|
<p>If you want to add menu and change menu name.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"dropdown"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"javascript:void(0)"</span><span style="color: #333333">></span>Home<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"sub-menu"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"index.php"</span><span style="color: #333333">></span>Fashion 1<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"demo-2.html"</span><span style="color: #333333">></span>Fashion 2<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"demo-3.html"</span><span style="color: #333333">></span>Furniture<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"demo-4.html"</span><span style="color: #333333">></span>Mix products<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"demo-5.html"</span><span style="color: #333333">></span>Electronic<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h4>Brand icons</h4>
|
||
|
|
<p>If you want to change brand icon.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-brand-item"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-brand-img"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>img alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"brand"</span> title<span style="color: #333333">=</span><span style="background-color: #fff0f0">"brand"</span> src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/brand-image/1.png"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Footer Other Link URL.</h4>
|
||
|
|
<p>If you want to change footer other link url.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-widget"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-heading"</span><span style="color: #333333">></span>Information<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-links"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"align-items-center"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"about-us.html"</span><span style="color: #333333">></span>About us<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"faq.html"</span><span style="color: #333333">></span>FAQ<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"track-order.html"</span><span style="color: #333333">></span>Delivery Information<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"contact-us.html"</span><span style="color: #333333">></span>Contact us<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
<h4>Footer Contact us info.</h4>
|
||
|
|
<p>If you want to change footer Contact us info.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col-sm-12 col-lg-3 ec-footer-contact"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-widget"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-logo"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">><</span>img src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/logo/footer-logo.png"</span>
|
||
|
|
alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">""</span><span style="color: #333333">><</span>img class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"dark-footer-logo"</span> src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/images/logo/dark-logo.png"</span>
|
||
|
|
alt<span style="color: #333333">=</span><span style="background-color: #fff0f0">"Site Logo"</span> style<span style="color: #333333">=</span><span style="background-color: #fff0f0">"display: none;"</span> <span style="color: #333333">/></</span>a<span style="color: #333333">></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>h4 class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-heading"</span><span style="color: #333333">></span>Contact us<span style="color: #333333"></</span>h4<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-links"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"align-items-center"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">></span><span>71</span> Pilgrim Avenue Chevy Chase,<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>span<span style="color: #333333">></span>Call Us:<span style="color: #333333"></</span>span<span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"tel:+440123456789"</span><span style="color: #333333">>+</span><span style="color: #0000DD; font-weight: bold">44</span>
|
||
|
|
<span>0123</span> <span>456</span> <span>789</span><span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ec-footer-link"</span><span style="color: #333333">><</span>span<span style="color: #333333">></span>Email:<span style="color: #333333"></</span>span<span style="color: #333333">><</span>a
|
||
|
|
href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"mailto:example@ec-email.com"</span><span style="color: #333333">>+</span>example<span style="color: #555555; font-weight: bold">@ec</span><span style="color: #333333">-</span>email<span style="color: #333333">.</span>com<span style="color: #333333"></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Footer Social icon Link</h4>
|
||
|
|
<p>If you want to change footer social icon link.</p>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span><span style="">!</span><span style="color: #333333">--</span> Footer social Start <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"col text-left footer-bottom-left"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>div class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"footer-bottom-social"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>span class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"social-text text-upper"</span><span style="color: #333333">></span>Follow us on:<span style="color: #333333"></</span>span<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>ul class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"mb-0"</span><span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"list-inline-item"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">><</span>i class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-facebook"</span><span style="color: #333333">></</span>i<span style="color: #333333">></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"list-inline-item"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">><</span>i class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-twitter"</span><span style="color: #333333">></</span>i<span style="color: #333333">></</span>a<span style="color: #333333">></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"list-inline-item"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">><</span>i class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-instagram"</span><span style="color: #333333">></</span>i<span style="color: #333333">></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>li class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"list-inline-item"</span><span style="color: #333333">><</span>a href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"#"</span><span style="color: #333333">><</span>i class<span style="color: #333333">=</span><span style="background-color: #fff0f0">"ecicon eci-linkedin"</span><span style="color: #333333">></</span>i<span style="color: #333333">></</span>a<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>li<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>ul<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"></</span>div<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Source File (CSS)</h4><!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"> <span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> css Icon Font <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/vendor/ecicons.min.css"</span> <span style="color: #333333">/></span>
|
||
|
|
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> css All Plugins Files <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/animate.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/swiper-bundle.min.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/jquery-ui.min.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/countdownTimer.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/slick.min.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/plugins/bootstrap.css"</span> <span style="color: #333333">/></span>
|
||
|
|
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> Main Style <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/style.css"</span> <span style="color: #333333">/></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/responsive.css"</span> <span style="color: #333333">/></span>
|
||
|
|
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> Background css <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> <span style="color: #007020">id</span><span style="color: #333333">=</span><span style="background-color: #fff0f0">"bg-swhicher-css"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/backgrounds/bg-4.css"</span><span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h4>Source File (JS)</h4>
|
||
|
|
<!-- HTML generated using hilite.me --><div style="margin-bottom:20px; background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"> <span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> Vendor JS <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/jquery-3.5.1.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/popper.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/bootstrap.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/jquery-migrate-3.3.0.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/modernizr-3.11.2.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span>Plugins JS<span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/swiper-bundle.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/countdownTimer.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/scrollup.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/jquery.zoom.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/slick.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/infiniteslidev2.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/jquery.magnific-popup.min.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/plugins/jquery.sticky-sidebar.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> Google translate Js <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/google-translate.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script<span style="color: #333333">></span>
|
||
|
|
function googleTranslateElementInit() {
|
||
|
|
new google<span style="color: #333333">.</span>translate<span style="color: #333333">.</span>TranslateElement({ pageLanguage: <span style="background-color: #fff0f0">'en'</span> }, <span style="background-color: #fff0f0">'google_translate_element'</span>);
|
||
|
|
}
|
||
|
|
<span style="color: #333333"></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span><span style="color: #FF0000; background-color: #FFAAAA">!</span><span style="color: #333333">--</span> Main Js <span style="color: #333333">--></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/vendor/index.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
<span style="color: #333333"><</span>script src<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/js/main.js"</span><span style="color: #333333">></</span>script<span style="color: #333333">></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="d-customization">
|
||
|
|
<h2 class="section-title">Other Home Pages Customization</h2>
|
||
|
|
<p>If you want to use home page 2 (demo-2.html) </p>
|
||
|
|
<p><b>HTML file name : demo-2.html</b></p>
|
||
|
|
<p><b>SCSS file name : demo2.scss</b> ( in scss folder )</p>
|
||
|
|
|
||
|
|
<p>demo2.scss file includes :</p>
|
||
|
|
<p>1) _helper.scss file in components folder</p>
|
||
|
|
<p>2) _chatboat.scss file in components folder</p>
|
||
|
|
<p>3) _header_demo_2.scss file in layout folder</p>
|
||
|
|
<p>4) _footer_demo_2.scss file in layout folder</p>
|
||
|
|
<p>5) _demo2.scss file in pages folder (includes responsive css)</p>
|
||
|
|
<img class="inst-img" src="img/home2.png" alt="">
|
||
|
|
|
||
|
|
<p><b>CSS file name : demo2.css</b> ( in css folder ) (includes responsive css)</p>
|
||
|
|
<p><b>JS file name : demo-2.js</b> ( in js folder )</p>
|
||
|
|
|
||
|
|
<p class="notes">Other demo (home) pages not include dark mode, full scree mode, color options, backgrounds option, Language translate plugin and rtl options.</p>
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="r-msg">
|
||
|
|
<h2 class="section-title">Remove Popup ( Template Running Directlly )</h2>
|
||
|
|
<p>It is only shows you are notified that you do not run the project directly. Because Here, we are using SVG icons, multiple colors, dark mode & other features to change into the theme without loading & it will affect missed or lost content. So here, Please try to run the theme using WAMP or XAMPP Server.</p>
|
||
|
|
<p>Here is the link for How to install & Run Project On Wamp server : <a href="https://www.youtube.com/watch?v=TynOxl7DQ4Y" target="_blank"> Video Guide Link</a></p>
|
||
|
|
<img class="inst-img" src="img/rem.png" alt="">
|
||
|
|
|
||
|
|
<h5><b>If you want to remove the popup</b></h5>
|
||
|
|
<p><b>Step-1 : </b> Go to the JS folder and open main.js file</p>
|
||
|
|
<p><b>Step-2 : </b> Find "ec-direct-run" id and Comment OR remove (setTimeout) function block and run it.</p>
|
||
|
|
<img class="inst-img" src="img/rem-2.png" alt="">
|
||
|
|
</section>
|
||
|
|
<section class="col-12 page-section" id="c-hf">
|
||
|
|
<h2 class="section-title"><b>How To Do a Change Header And Footer with Any <span>Home Page to Home Page</span>.</b></h2>
|
||
|
|
|
||
|
|
<h4>Use of one home page Header with any of HomePage.</h4>
|
||
|
|
<p>For example if you want to use home page 2 (demo-2.html), But you wanted to use other home page Header EX : home page 1(index.php) Header.</p>
|
||
|
|
<h5>Below are the steps that you need to follow & do the required change into HTML files</h5>
|
||
|
|
<p><b>Step 1 :</b> Open HomePage file that you want to set & Copy the full Header Tag code & replace it, into the Page that you want to replace.</p><p> ( EX : Copy html header(header tag) code from index.php and replace it into demo-2.html )</p>
|
||
|
|
<!-- <p><b>Step 2 :</b> Add this "responsive.css" CSS file path into your "head Tag" of demo-2.html. Make sure you have been given the complate located path of that file.</p> -->
|
||
|
|
<!-- <div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/responsive.css"</span> <span style="color: #333333">/></span> -->
|
||
|
|
<!-- </pre></div> -->
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Do the required change into SCSS file</h5>
|
||
|
|
<p><b>Step 2 :</b> Open demo2.scss file from "assets/scss" directory into editor.</p>
|
||
|
|
<p><b>Step 3 :</b> Replace the code [ @import "layout/_header_demo_2"; ] with [ @import "layout/_header"; ] & Save it.</p>
|
||
|
|
<p><b>Step 4 :</b> Do the compile SCSS file and generate the css file in css directory (demo2.css). Using the software ex: prepros(https://prepros.io/)</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h4><b>Use of one home page Footer with any of HomePage.</b></h4>
|
||
|
|
<p>For example if you want to use home page 2 (demo-2.html), But you wanted to use other home page Footer EX : home page 1(index.php) Footer.</p>
|
||
|
|
<h5>Below are the steps that you need to follow & do the required change into HTML files</h5>
|
||
|
|
<p><b>Step 1 :</b> Open HomePage file that you want to set & Copy the full Footer Tag code & replace it, into the Page that you want to replace.</p><p> ( EX : Copy html Footer(Footer tag) code from index.php and replace it into demo-2.html )</p>
|
||
|
|
<!-- <p><b>Step 2 :</b> Add this "responsive.css" CSS file path into your "head Tag" of demo-2.html. Make sure you have been given the complate located path of that file.</p> -->
|
||
|
|
<!-- <div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/responsive.css"</span> <span style="color: #333333">/></span> -->
|
||
|
|
<!-- </pre></div> -->
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Do the required change into SCSS file</h5>
|
||
|
|
<p><b>Step 2 :</b> Open demo2.scss file from "assets/scss" directory into editor.</p>
|
||
|
|
<p><b>Step 3 :</b> Replace the code [ @import "layout/_footer_demo_2"; ] with [ @import "layout/_footer"; ] & Save it.</p>
|
||
|
|
<p><b>Step 4 :</b> Do the compile SCSS file and generate the css file in css directory (demo2.css). Using the software ex: prepros(https://prepros.io/)</p>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h2 class="section-title">How To Do a Change Header And Footer with Any <span>Home Page to Inner Page</span>.</h2>
|
||
|
|
<h4>Use of home page 2 Header with any of inner pages.</h4>
|
||
|
|
<p>For example if you want to use home page 2 (demo-2.html), And you can use home page 2 header in inner pages (ex about.html).</p>
|
||
|
|
<h5>Below are the steps that you need to follow & do the required change into HTML files</h5>
|
||
|
|
<p><b>Step 1 :</b> Open HomePage 2 file that you want to set & Copy the full Header Tag code & replace it, into the Page that you want to replace.</p><p> ( EX : Copy html header(header tag) code from demo-2.html and replace it into about.html )</p>
|
||
|
|
<p><b>Step 2 :</b> Add this "demo2.css" CSS file path into "head Tag" of about.html(all inner page). Make sure you have been given the complate located path of that file.</p>
|
||
|
|
<div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/demo2.css"</span> <span style="color: #333333">/></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Do the required change into SCSS file</h5>
|
||
|
|
<p><b>Step 3 :</b> Open style.scss file from "assets/scss" directory into editor.</p>
|
||
|
|
<p><b>Step 4 :</b> Replace the code [ @import "layout/_header"; ] with [ @import "layout/_header_demo_2"; ] & Save it.</p>
|
||
|
|
<p><b>Step 5 :</b> Do the compile SCSS file and generate the css file in css directory (style.css). Using the software ex: prepros(https://prepros.io/)</p>
|
||
|
|
|
||
|
|
<h4><b>Use of home page 2 Footer with any of inner pages.</b></h4>
|
||
|
|
<p>For example if you want to use home page 2 (demo-2.html), And you can use home page 2 Footer in inner pages (ex about.html).</p>
|
||
|
|
<h5>Below are the steps that you need to follow & do the required change into HTML files</h5>
|
||
|
|
<p><b>Step 1 :</b> Open HomePage 2 file that you want to set & Copy the full Footer Tag code & replace it, into the Page that you want to replace.</p><p> ( EX : Copy html Footer(Footer tag) code from demo-2.html and replace it into about.html )</p>
|
||
|
|
<p><b>Step 2 :</b> Add this "demo2.css" CSS file path into "head Tag" of about.html(all inner page). Make sure you have been given the complate located path of that file.</p>
|
||
|
|
<div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre style="margin: 0; line-height: 125%"><span style="color: #333333"><</span>link rel<span style="color: #333333">=</span><span style="background-color: #fff0f0">"stylesheet"</span> href<span style="color: #333333">=</span><span style="background-color: #fff0f0">"assets/css/demo2.css"</span> <span style="color: #333333">/></span>
|
||
|
|
</pre></div>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h5>Do the required change into SCSS file</h5>
|
||
|
|
<p><b>Step 3 :</b> Open style.scss file from "assets/scss" directory into editor.</p>
|
||
|
|
<p><b>Step 4 :</b> Replace the code [ @import "layout/_footer"; ] with [ @import "layout/_footer_demo_2"; ] & Save it.</p>
|
||
|
|
<p><b>Step 5 :</b> Do the compile SCSS file and generate the css file in css directory (style.css). Using the software ex: prepros(https://prepros.io/)</p>
|
||
|
|
|
||
|
|
|
||
|
|
</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>Magnific-popup</li>
|
||
|
|
<li>Swiper-bundle</li>
|
||
|
|
<li>Infiniteslidev2 (Instagram infinite slide)</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 your valuable <a targe="_blank" href="https://themeforest.net/item/ekka-ecommerce-html-template/reviews/34126217"> Review & Rating Here</a>.</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>
|