Our brands

Guide Ves Azshop Magento2

 

Getting Started

Mesa comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for Magento 2? Mesa is designed for Magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Mesa is one of our responsive Magento 2 themes. This Magento 2 theme created with new Magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from Magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Mesa is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://server1.demo4coder.com/mesa/landing

Purchase It Now

Alert

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml:-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme:- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml:- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in thedefault.xml file.This file is also used to override default theme’s settings.media/preview.png:- The preview of the current theme.web:- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php:- This file is required to register our theme to Magento2 system.theme.xml:- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.composer.json:- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install/update for the user to ensure the theme installs correctly.Creating theme files, Let us now create our files one by one.Creating theme files, Let us now create our files one by one.theme.xml ( app/design/frontend/Venustheme/mesa_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Mesa Child</title> <!-- your theme's name -->
   <parent>Magento/blank</parent> <!-- the parent theme -->
   <media>
        <preview_image>media/preview.jpg</preview_image> <!-- theme's preview image -->
   </media>
</theme>

registration.php ( app/design/frontend/Venustheme/mesa_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/mesa_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/mesa_child/composer.json )

{
 "name": "magento/theme-frontend-mesa_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-blank": "100.0.*",
 "magento/framework": "100.0.*"
 },
 "type": "magento2-theme",
 "version": "100.0.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose Mesa child


* Important: After you choose a new theme or new theme child, you need reindex data and run the command below via SSH:

php bin/magento setup:static-content:deploy

Core Magento Blocks

Blockquote

Blog Extension

1. How To Change URL link:

Go to Admin Panel > Stores -> Configuration > Venus Theme Extension > Ves Blog

2. Config show/hidden elements in post page (detail post)

Show on frontend:

 

3. Config show/hidden elements in Category page

Show on frontend

 

4. How To Change page layout for each blog category

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category

On Design tab : you can choose page layout for category

 

5. How To Custom Category Blog Page: Show grid, list or Masonry View Mode

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category > Design tab:

 

Megamenu

Eveprest includes the fantastic Megamenu in an additional module called Ves MegaMenu. The Megamenu module comes with a custom admin interface through which you can create powerfull Menu. No coding is required. Follow these steps to create a module:

 

Front-end:

 

Back-end:

– Create new Menu item:

– General Information:

– Header:

– Left Block:

– Main content:

– Right block:

– Bottom block:

– Custom design for menu item:

– Dynamic Content Tab:

Front-end showing:

Back-end config:


Config menu item dynamic:

Megamenu

TechOne includes the fantastic Megamenu in an additional module called Ves MegaMenu. The Megamenu module comes with a custom admin interface through which you can create powerfull Menu. No coding is required. Follow these steps to create a module:

 

Front-end:

Vertical menu:
 

Back-end:

– Create new Menu item:

– General Information:

– Header:

– Left Block:

– Main content:

– Right block:

– Bottom block:

– Custom design for menu item:

Button

Homepage Configuration

Mesa has 8 extensions with 6 homepages built by Ves Page Builder module.

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save the configuration.

Go to back-end > VenusTheme > Ves Page Builder > Edit profile name “Mesa Homepage Default

In the back-end, we used the widget, namely “Content Carousel” on page builder profile. To change image slider, please Go to back-end > VenusTheme > Ves Page Builder > choose “Manager Elements” > Edit block profile “Mesa Slider 1”.

  1. Mesa Slider 1
  2. Mesa Slider 2
  3. Mesa Slider 3
  4. Mesa Slider 4




ex: content for “Mesa Slider 1“:

<p><a href="{{store url="women.html"}}"><img src="{{media url="wysiwyg/ves_mesa/slider/slider1.jpg"}}" alt="Slider 1" /></a></p>
<div class="slider-content v1">
<h3 style="color:#31bac2">Explore</h3>
<h2 style="color:#a05e81">School <br>
Books</h2>
<p class="hidden-md hidden-sm hidden-xs">Available for All Classes</p>
<a class="action primary white" href="#">SHOP NOW</a></div>

 

 

Back-end Setting:

 

Mesa Image V2:

Back-end Setting:

Mesa Image V3:

Back-end Setting:

Mesa Image V4:

Back-end Setting:

Mesa Image V5:

Back-end Setting:

Mesa Image V6:

Back-end Setting:

Mesa Image V7:

Back-end Setting:

Config in admin in Pages Builder Elements profile “Mesa Blog”.



 

Back-end Setting:

please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product List”.

 

Mesa Product V1:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product”.

 

Mesa Product V2:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V2”.

Mesa Product V3:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V3”.

Mesa Product V4:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V4”.

Mesa Product V5:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V5”.

Mesa Product V6:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V6”.

 

Mesa Product V7:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mesa Product V7”.

Content Carousel

Install Sample Data

The Ves Pages Builder extension we included a sample pages and block profile in the module package. You should download latest version of Ves Pages Builder extension in our site: http://landofcoder.com/magento-2-page-builder.html/ or in our site http://www.venustheme.com/venus-magento-page-builder/

Demo Sample Pages Profile:

http://demo4coder.com/m2/demo-homepage-01/
http://demo4coder.com/m2/demo-homepage-02/
http://demo4coder.com/m2/demo-homepage-03/
http://demo4coder.com/m2/demo-homepage-04

Follow there steps to setup the sample pages builder profile:

Step 1: Decompress the module package, then decompress the file “Ves_Pagesbuilder_Sample_Magento2.zip“. We will get the sample file and folders:

Step 2: Go to admin > Venustheme > Setup > Import, then browse the sample JSON profile and click on button Import configuration

Step 3: Upload folders: app/ and pub/ of sample profile into webroot folder of your site to override 2 folders in your site. (This will add sample css files and sample media images which we used in our sample data)

Step 4: Clean cache of your site.

View the page: http://your domain/demo-homepage-01/

*Note: If the page not show the pages builder profile, you should edit page profiles in admin > Ves Pages Builder > Manage Page Profiles. Then check there CMS Static Block widgets were loaded correctly cms block items or not? (Because our sample profiles are using cms static blocks with name prefix “venus”)

List Categories

In Fashion Theme

In Fashion Theme

1. Home Slider
Fashion Homeslider 1

<div class="ves-wapper">
<div class="block block-slider">
<div class="block-content">
<div id="fashion-homeslider-1" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_01.jpg'}}" alt="" />
</a> 
<div class="item-content a-center">
<p class="d-none d-sm-block">SAVE ON RENTALS!</p>
<h2>20% Discount</h2> 
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">Shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-dark d-inline">Learn more</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_02.jpg'}}" alt="" />
</a> 
<div class="item-content a-center">
<p class="d-none d-sm-block">SAVE ON RENTALS!</p>
<h2>20% Discount</h2> 
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">Shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-dark d-inline">Learn more</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-1");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Fashion Homeslider 2

<div class="ves-wapper">
<div class="container">
<div class="block block-slider slider-v2">
<div class="block-content">
<div id="fashion-homeslider-2" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_03.jpg'}}" alt="" />
</a> 
<div class="item-content">
<p class="text-white" style="letter-spacing: 4px;">READY-TO-WEAR</p>
<h2 class="text-white">Fall/Winter '18</h2> 
<p class="d-none d-sm-block text-white" style="font-size:20px;margin-bottom:40px;font-weight: 300">Take a look at the Collections Fall Winter <br>
20188 shows and watch the designers'<br>
collections, runaways, photos, backstage and<br>
much more...
</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">Shop now</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_04.jpg'}}" alt="" />
</a> 
<div class="item-content" style="left: 8%;">
<p class="text-white" style="letter-spacing: 4px;">READY-TO-WEAR</p>
<h2 class="text-white">Fall/Winter '18</h2> 
<p class="d-none d-sm-block text-white" style="font-size:20px;margin-bottom:40px;font-weight: 300">Take a look at the Collections Fall Winter <br>
20188 shows and watch the designers'<br>
collections, runaways, photos, backstage and<br>
much more...
</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">Shop now</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-2");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>
</div>

Fashion Homeslider 3

<div class="ves-wapper">
<div class="block block-slider slider-v3 no-margin">
<div class="block-content">
<div id="fashion-homeslider-3" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_05.jpg'}}" alt="" />
</a> 
<div class="item-content a-center">
<p style="color:#000;font-size:30px;letter-spacing: 4px;margin-bottom:0px;">READY-TO-WEAR</p>
<h2 style="margin-top:0;">100% cashmere</h2> 
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-dark d-inline">Shop now</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_06.jpg'}}" alt="" />
</a> 
<div class="item-content a-center" style="right: -25%">
<p style="color:#fff;font-size:30px;letter-spacing: 4px;margin-bottom:0px;">READY-TO-WEAR</p>
<h2 style="color: #fff;margin-top:0;">100% cashmere</h2> 
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-dark d-inline">Shop now</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-3");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Fashion Homeslider 4

<div class="ves-wapper">
<div class="block block-slider slider-v4 no-margin">
<div class="block-content">
<div id="fashion-homeslider-4" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_07.jpg'}}" alt="" />
</a> 
<div class="item-content a-center">
<h2 class="text-white">WOMENS<br>STREETWEAR</h2> 
<p style="margin-bottom: 30px" class="text-white">BLACK MINIMALIST</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-light d-inline">Shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-light d-inline">Learn more</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_07_01.jpg'}}" alt="" />
</a> 
<div class="item-content a-center">
<h2 class="text-white">WOMENS<br>STREETWEAR</h2> 
<p style="margin-bottom: 30px" class="text-white">BLACK MINIMALIST</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-light d-inline">Shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-light d-inline">Learn more</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-4");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div> 
</div>

Fashion Homeslider 5

<div class="ves-wapper">
<div class="block block-slider slider-v7 no-margin">
<div class="block-content">
<div id="fashion-homeslider-7" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_08.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Current<br>Styling Trends</h2> 
<p class="d-none d-sm-block">We'll pick up from your venue, or ship it back to us!<br>Chair Decor – Smart and Gorgeous.</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default">Shop Now</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_09.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Current<br>Styling Trends</h2> 
<p class="d-none d-sm-block">We'll pick up from your venue, or ship it back to us!<br>Chair Decor – Smart and Gorgeous.</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default">Shop Now</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-7");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Fashion Homeslider 6

<div class="ves-wapper">
<div class="block block-slider slider-v8 no-margin">
<div class="block-content">
<div id="fashion-homeslider-8" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow" style="z-index: 0;">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_10.jpg'}}" alt="" />
</a> 
<div class="item-content">
<p style="font-style: italic;color: #ff8181">Babylove Store Online</p>
<h2 style="font-size:48px; line-height: 48px;color: #363b46;margin-bottom: 0px;margin-top: 0;">Get 25% off your<br>order,Pretty sweet,<br>we know.</h2> 
<p class="d-none d-sm-block" style="font-size:18px; color: #434a54; font-weight: 300; margin-bottom: 0;">Our black friday favourites!</p>
<p class="d-none d-sm-block" style="font-weight: 600;font-size: 36px; color: #ff8181">$56</p>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/fashion/slide_10.jpg'}}" alt="" />
</a> 
<div class="item-content">
<p style="font-style: italic;color: #ff8181">Babylove Store Online</p>
<h2 style="font-size:48px; line-height: 48px;color: #363b46;margin-bottom: 0px;margin-top: 0;">Get 25% off your<br>order,Pretty sweet,<br>we know.</h2> 
<p class="d-none d-sm-block" style="font-size:18px; color: #434a54; font-weight: 300; margin-bottom: 0;">Our black friday favourites!</p>
<p class="d-none d-sm-block" style="font-weight: 600;font-size: 36px; color: #ff8181">$56</p>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#fashion-homeslider-8");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

2. Product
Fashion Block Product V1

Fashion Block Product V3

Fashion Block Product V4

Fashion Block Product V5

Fashion Block Product V6

Fashion Block Product V7

Fashion Block Product V8

Fashion Block Product V9

Fashion Block Product V10

Fashion Block Product V11

Fashion Block Product V12

3. Banner
Fashion Block Images V1

<div class="ves-wapper" style="padding:2% 0;">
<div class="container">
<div class="block">
<div class="block-title"><strong>POPULAR CATEGORIES</strong></div>
<div class="pretext-html a-center">
<p style="font-size:18px; color:#a3a5a7; margin-bottom: 30px">
Showcasing what the world's most stylish women are buying right now. Lorem 
<br>Ipsum has been the industry's standard dummy text
</p>
</div>
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-6 col-md-6">
<div class="card" style="margin-bottom: 20px;">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_01.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding:30px;">
<h5 class="card-title">
<a title="Living room" href="#" style="color:#fff; font-size: 18px;">WOMAN</a>
</h5>
<a href="#" style="color:#fff; font-size: 16px;">Shop now <i class="fa fa-arrow-right" style="font-size: 12px; margin-left: 5px;"></i></a>
</div>
</div>
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_02.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding:30px;">
<h5 class="card-title">
<a title="Living room" href="#" style="color:#fff; font-size: 18px;">MEN</a>
</h5>
<a href="#" style="color:#fff; font-size: 16px;">Shop now <i class="fa fa-arrow-right" style="font-size: 12px; margin-left: 5px;"></i></a>
</div>
</div>
</div>
<div class="col-12 col-sm-6 col-md-6">
<div class="card" style="margin-bottom: 20px;">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_03.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding:30px;">
<h5 class="card-title">
<a title="Living room" href="#" style="color:#000; font-size: 18px;">BAGS AND SHOES</a>
</h5>
<a href="#" style="color:#000; font-size: 16px;">Shop now <i class="fa fa-arrow-right" style="font-size: 12px; margin-left: 5px;"></i></a>
</div>
</div>
<div class="card">
<img class="card-img-top" src="{{media url='wysiwyg/ves_boost/fashion/category_04.jpg'}}" alt="" />
<div class="card-img-overlay" style="padding:30px;">
<h5 class="card-title">
<a title="Living room" href="#" style="color:#fff; font-size: 18px;">BACK IN STOCK</a>
</h5>
<a href="#" style="color:#fff; font-size: 16px;">Shop now <i class="fa fa-arrow-right" style="font-size: 12px; margin-left: 5px;"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V2

<div class="ves-wapper" style="padding: 3% 0 2%;">
<div class="container">
<div class="block block-images">
<div class="block-title">JUST FOR YOU</div>
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-6 col-md-6">
<div class="card" style="margin-bottom: 20px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_01.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding: 30px 15px; top: auto; bottom: 0;"><span style="font-size: 16px; font-weight: 600; color: black;">$195.00</span></div>
</div>
</div>
<div class="col-12 col-sm-6 col-md-6">
<div class="row">
<div class="col">
<div class="card" style="margin-bottom: 20px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_02.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding: 30px 15px; top: auto; bottom: 0;"><span style="font-size: 16px; font-weight: 600; color: black;">$239.90</span></div>
</div>
</div>
<div class="col">
<div class="card" style="margin-bottom: 20px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_03.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding: 30px 15px; top: auto; bottom: 0;"><span style="font-size: 16px; font-weight: 600; color: black;">$239.90</span></div>
</div>
</div>
<div class="w-100"></div>
<div class="col">
<div class="card" style="margin-bottom: 20px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_05.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding: 30px 15px; top: auto; bottom: 0;"><span style="font-size: 16px; font-weight: 600; color: black;">$198.70</span></div>
</div>
</div>
<div class="col">
<div class="card" style="margin-bottom: 20px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_04.jpg"}}" alt="" />
<div class="card-img-overlay" style="padding: 30px 15px; top: auto; bottom: 0;"><span style="font-size: 16px; font-weight: 600; color: black;">$298.90</span></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V3

<div class="ves-wapper" style="padding: 1% 0;">
<div class="container">
<div class="block block-images v3">
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-4 col-md-4">
<div class="content-html">
<h3 style="font-size: 24px; color: black; margin-bottom: 35px; margin-top: 0;font-weight: 500">Packed With Love</h3>
<p style="font-size: 16px;color: #999">Beautiful bags and boxes, in stores and<br /> online (and they’re recyclable, too).</p>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4"><img src="{{media url="wysiwyg/ves_boost/fashion/banner_07.jpg"}}" alt="" /></div>
<div class="col-12 col-sm-4 col-md-4"><img src="{{media url="wysiwyg/ves_boost/fashion/banner_08.jpg"}}" alt="" /></div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V4

<div class="ves-wapper">
<div class="block block-images v4">
<div class="block-content">
<div class="row no-gutters">
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_05.jpg"}}" alt="" />
<div class="card-img-overlay a-center">
<a href="#" style="color:#fff; font-size: 20px;">Sweaters and cardigans</a>
</div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_06.jpg"}}" alt="" />
<div class="card-img-overlay a-center">
<a href="#" style="color:#fff; font-size: 20px;">Accessories</a>
</div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_07.jpg"}}" alt="" />
<div class="card-img-overlay a-center">
<a href="#" style="color:#fff; font-size: 20px;">Scarves and foulards</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V5

<div class="ves-wapper">
<div class="block block-images">
<div class="block-content">
<img src="{{media url="wysiwyg/ves_boost/fashion/banner_09.jpg"}}" alt="" />
</div>
</div>
</div>

Fashion Block Images V6

<div class="ves-wapper" style="padding: 30px 0;">
<div class="container">
<div class="block no-margin block-images v6">
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-4 col-md-4">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_08.jpg"}}" alt="" />
<div class="card-img-overlay a-center" style="bottom: 30px; top: auto; padding: 0 30px"><a style="background: #fff; color: #363b46; font-size: 16px;font-weight: 600;padding: 14px 20px; min-width: 180px; display: inline-block;" href="#">Bags &amp; Satchels</a></div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_09.jpg"}}" alt="" />
<div class="card-img-overlay a-center" style="bottom: 30px; top: auto;padding: 0 30px"><a style="background: #fff; color: #363b46; font-size: 16px; font-weight: 600;padding: 14px 20px; min-width: 180px; display: inline-block;" href="#">Footwear</a></div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_10.jpg"}}" alt="" />
<div class="card-img-overlay a-center" style="bottom: 30px; top: auto;padding: 0 30px"><a style="background: #fff; color: #363b46; font-size: 16px;font-weight: 600; padding: 14px 20px; min-width: 180px; display: inline-block;" href="#">Sunglasses</a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V7

<div class="ves-wapper">
<div class="container">
<div class="block block-images">
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-12 col-md-7 col-lg-7">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_10.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column text-center justify-content-center" style="padding: 30px; left:auto">
<p style=" margin-bottom:0"><span style="font-size: 24px; color: #363b46; font-weight: 600;">Shoes Collection</span></p>
<h3 style="font-size: 36px;line-height: 42px;text-align: right;margin-top: 0;font-weight: 600;margin-bottom: 25px;">Up to 50% Off</h3>
<a href="#" style="color:black">SHOP NOW</a>
</div>
</div>
</div>
<div class="col-12 col-sm-12 col-md-5 col-lg-5">
<div class="card" style="margin-bottom: 20px;" >
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_11.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column text-center justify-content-center" style="padding: 30px; left:auto">
<p style=" margin-bottom:0"><span style="font-size: 24px; color: #363b46; font-weight: 600">Designer</span></p>
<h3 style="font-size: 36px;line-height: 42px;text-align: right;margin-top: 0;font-weight: 600;margin-bottom: 25px;">Sunglasses</h3>
<a href="#" style="color:black">SHOP NOW</a>
</div>
</div>
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_12.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column text-center justify-content-center" style="padding: 30px; right:auto">
<p style=" margin-bottom:0"><span style="font-size: 24px; color: #363b46; font-weight: 600">Best of Bags</span></p>
<h3 style="font-size: 36px;line-height: 42px;margin-top: 0;font-weight: 600;margin-bottom: 25px;">Up to 70% Off</h3>
<a href="#" style="color:black">SHOP NOW</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V8

<div class="ves-wapper block-absolute" style="margin-top: -130px; z-index: 1; background: #f0f3f7;">
<div class="container">
<div class="block no-margin block-images v8">
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_11.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column justify-content-end" style="padding:30px">
<h2 style="font-size: 14px; font-weight: bold; margin-bottom: 10px;">For Boy</h2>
<div class="subtitle"> 
3 <span>products</span>
</div>
</div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_12.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column justify-content-end">
<h2 style="font-size: 14px; font-weight: bold; margin-bottom: 10px;">Accessories</h2>
<div class="subtitle">
3 <span>products</span>
</div>
</div>
</div>
</div>
<div class="col-12 col-sm-4 col-md-4">
<div class="card">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/category_13.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column justify-content-end">
<h2 style="font-size: 14px; font-weight: bold;">Denim Kids</h2>
<div class="subtitle">
3 <span>products</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Images V9

<div class="ves-wapper" style="padding-bottom: 2%; background: #f0f3f7;">
<div class="container">
<div class="block">
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_13.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column text-left justify-content-start" style="padding: 30px;">
<h3 style="font-size: 24px; line-height: 30px; text-align: left; font-weight: 600;">Reversible Printed<br />T - shirt Baby Boy</h3>
<a style="color: black;" href="#">Shop now <i class="fa fa-long-arrow-right"></i></a></div>
</div>
</div>
<div class="col-12 col-sm-12 col-md-6 col-lg-6">
<div class="card" style="margin-bottom: 26px;"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/fashion/banner_14.jpg"}}" alt="" />
<div class="card-img-overlay d-flex flex-column text-left justify-content-end" style="padding: 30px;">
<h3 style="font-size: 24px; line-height: 30px; text-align: left; font-weight: 600;">Zara Mid-Heel<br />Denim Shoes</h3>
<a style="color: black;" href="#">Shop now <i class="fa fa-long-arrow-right"></i></a></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Html V1

<div class="ves-wapper" style="padding: 0 0 2%;">
<div class="container">
<div class="block block-html html-v1">
<div class="block-title"><strong>WE'VE THOUGHT OF EVERYTHING</strong></div>
<div class="block-content">
<div class="row">
<div class="col-12 col-sm-6 col-md-6 col-lg-6"><img src="{{media url="wysiwyg/ves_boost/fashion/banner_06.jpg"}}" alt="" /></div>
<div class="col-12 col-sm-6 col-md-6 offset-lg-1 col-lg-5">
<div class="content-html" style="padding-top: 20%;">
<h2 style="font-size: 24px; font-weight: 500;">Free worldwide shipping</h2>
<p style="font-size: 16px; color: #999; font-weight: 500; padding: 10px 0">All orders placed before 13:00GMT Monday – Thursday<br /> will be dispatched the same working day!</p>
<a style="font-size: 16px; color: #000; font-weight: 500;" href="#"><i class="vc_btn3-icon fa fa-angle-right"></i> SEE MORE</a></div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Html V2

<div class="ves-wapper block-theme" style="padding: 45px 0 5px;">
<div class="container">
<div class="block block-html v2">
<div class="block-content">
<div class="row">
<div class="col-sm-6 col-md-4 col-lg-4 d-flex align-self-center justify-content-center"><span style="font-size: 12px;font-weight: 600; color: #fff; letter-spacing: 1px;"><i class="fa fa-map-marker"></i> 351 NATALIE EXTENSIONS APT. 810</span></div>
<div class="col-sm-6 col-md-4 col-lg-4 a-center">
<div style="font-size: 30px; color: #ffffff; text-align: center; font-weight: 600; font-style: normal;">(+01) 23 456 789</div>
</div>
<div class="col-12 col-md-4 col-lg-4 d-flex align-self-center justify-content-center"><span style="font-size: 12px;font-weight: 600; color: #fff; letter-spacing: 2px;"><i class="fa fa-envelope-o"></i>CONTACT@BOOST.COM</span></div>
</div>
</div>
</div>
</div>
</div>

4. Our Service
Fashion Block Ourservice V1

<div class="ves-wapper" style="background: #1a1a1a; padding: 60px 0 20px;">
<div class="container">
<div class="block block-ourservice">
<div class="block-content">
<div class="row no-gutters">
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice a-center" style="color: #fff;"><i class="icon icon-026"></i>
<div class="content-text">
<h4 class="title">CUSTOMER CARE 24/7</h4>
<div class="information" style="font-size: 16px; color: #a3a5a7;"><span class="d-block">Our customer care team is available </span> <span>24 hours a day, seven days a week.</span></div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice a-center" style="color: #fff;"><i class="icon icon-1037"></i>
<div class="content-text">
<h4 class="title">BOXED AND VIRTUAL</h4>
<div class="information" style="font-size: 16px; color: #a3a5a7;"><span class="d-block">Sent directly to your recipient’s </span> <span>inbox or to you to be printed</span></div>
</div>
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="widget-ourservice a-center" style="color: #fff;"><i class="icon icon-911"></i>
<div class="content-text">
<h4 class="title">STYLE &amp; FIT ADVICE</h4>
<div class="information" style="font-size: 16px; color: #a3a5a7;"><span class="d-block">Tell us what works for you and we</span> <span>will give you some stylish solutions</span></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Ourservice V2

<div class="ves-wapper">
<div class="container">
<div class="block block-ourservice ourservice-v2">
<div class="block-content">
<div class="border-bottom border-top service-wapper" style=" padding: 50px 0">
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice">
<i class="icon icon-1081"></i>
<div class="content-text">
<h3 class="title" style="font-size: 24px;font-weight: 500;">Personal Shopping</h3>
<div class="information" style="font-size: 16px; color: #666">
<span class="d-block">Book a one-on-one session with a Style Advisor.</span> 
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice">
<i class="icon icon-706"></i>
<div class="content-text">
<h3 class="title" style="font-size: 24px;font-weight: 500;">At Your Service</h3>
<div class="information" style="font-size: 16px; color: #666">
<span class="d-block">We’re here to help via Live Chat, phone or email</span> 
</div>
</div>
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="widget-ourservice">
<i class="icon icon-653"></i>
<div class="content-text">
<h3 class="title" style="font-size: 24px;font-weight: 500;">Extended December Hours</h3>
<div class="information" style="font-size: 16px; color: #666">
<span class="d-block">Understanding Colors</span> 
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Ourservice V3

<div class="ves-wapper" style="padding: 3% 0; background: url('{{media url='wysiwyg/ves_boost/fashion/bg-service.jpg'}}') center center no-repeat;background-size:cover;">
<div class="container">
<div class="block no-margin">
<div class="block-content">
<div class="row">
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice a-center ourservice-v3" style="background: #fff; padding: 60px 0;">
<i class="icon icon-023"></i>
<div class="content-text">
<h4 class="title">FREE SHIPING & RETURNS</h4>
<div class="information" style="font-size: 18px; color: #a3a5a7">
<span class="d-block" style="font-size: 14px;color: #999999">On all orders over $200 within the 10-15 days </span> <span style="font-size: 14px;color: #999999">in all over the World</span>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="widget-ourservice a-center ourservice-v3" style="background: #fff; padding: 60px 0;">
<i class="icon icon-065"></i>
<div class="content-text">
<h4 class="title">100% MONEY REFUND</h4>
<div class="information" style="font-size: 18px; color: #a3a5a7">
<span class="d-block" style="font-size: 14px;color: #999999">We’re always commited to the perfect fit, </span> 
<span class="d-block" style="font-size: 14px;color: #999999">always.</span>
</div>
</div>
</div>
</div>
<div class="col-sm-12 col-md-4">
<div class="widget-ourservice a-center ourservice-v3" style="background: #fff; padding: 60px 0;">
<i class="icon icon-026"></i>
<div class="content-text">
<h4 class="title">24 x 7 FREE SUPPORT</h4>
<div class="information" style="font-size: 18px; color: #a3a5a7">
<span class="d-block" style="font-size: 14px;color: #999999">Ready to help you with any questions related to </span>
<span class="d-block" style="font-size: 14px;color: #999999">our Global Trade</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Fashion Block Ourservice V4

<div class="ves-wapper" style="background: url('{{media url='wysiwyg/ves_boost/fashion/bg-service-02.jpg'}}') center center no-repeat; background-size: cover;">
<div class="container">
<div class="block block-ourservice no-margin">
<div class="block-content">
<div class="row">
<div class="col-sm-6 col-md-3">
<div class="widget-ourservice a-center" style="padding: 60px 0;"><img style="padding: 20px; background: #fff; border-radius: 50%;" src="{{media url='wysiwyg/ves_boost/fashion/icon-07.png'}}" alt="" />
<div class="content-text"><span class="d-block" style="font-size: 14px; color: #ffffff; font-weight: 600; margin: 30px 0 10px; letter-spacing: 0.5px;">FREE SHIPING &amp; RETURNS</span> <span style="font-size: 12px; color: #ffffff;">Need we say more?</span></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="widget-ourservice a-center" style="padding: 60px 0;"><img style="padding: 20px; background: #fff; border-radius: 50%;" src="{{media url='wysiwyg/ves_boost/fashion/icon-08.png'}}" alt="" />
<div class="content-text"><span class="d-block" style="font-size: 14px; color: #ffffff; font-weight: 600; margin: 30px 0 10px; letter-spacing: 0.5px;">SUPPORT ONLINE 24/7</span> <span style="font-size: 12px; color: #ffffff;">Free Exchanges</span></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="widget-ourservice a-center" style="padding: 60px 0;"><img style="padding: 20px; background: #fff; border-radius: 50%;" src="{{media url='wysiwyg/ves_boost/fashion/icon-09.png'}}" alt="" />
<div class="content-text"><span class="d-block" style="font-size: 14px; color: #ffffff; font-weight: 600; margin: 30px 0 10px; letter-spacing: 0.5px;">SECURE PAYMENTS</span> <span style="font-size: 12px; color: #ffffff;">60-Day Returns</span></div>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="widget-ourservice a-center" style="padding: 60px 0;"><img style="padding: 20px; background: #fff; border-radius: 50%;" src="{{media url='wysiwyg/ves_boost/fashion/icon-10.png'}}" alt="" />
<div class="content-text"><span class="d-block" style="font-size: 14px; color: #ffffff; font-weight: 600; margin: 30px 0 10px; letter-spacing: 0.5px;">100% SAFE &amp; SECURE</span> <span style="font-size: 12px; color: #ffffff;">Proin condimentum sagittis</span></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

5. Blog
Fashion Block Blog V1

Fashion Block Blog V2

Fashion Block Blog V3

6. Testimonial
Fashion Testimonials V1

<div class="ves-wapper" style="background:url({{media url='wysiwyg/ves_boost/fashion/bg-testimonial.jpg'}}) center center no-repeat;background-size:cover; padding: 6% 0 5%;">
<div class="container">
<div class="block block-testimonials testimonials-v1 text-white">
<div class="block-title"><strong>TESTIMONIALS</strong></div>
<div class="block-content">
<div id="testimonials-demo-1" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<div class="content-tes a-center">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars!</div>
<div class="info-customer d-flex justify-content-center align-items-center">
<img class="img-customer" src="{{media url="wysiwyg/ves_boost/fashion/img-testimonial-1.jpg"}}" alt="" />
</div>
<div class="meta a-center">
<span class="name">Stephen Holland</span>
<span class="carrer">Customer</span>
</div>
</div> 
<div class="item">
<div class="content-tes a-center">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars 2!</div>
<div class="info-customer d-flex justify-content-center align-items-center">
<img class="img-customer" src="{{media url="wysiwyg/ves_boost/fashion/img-testimonial-1.jpg"}}" alt="" />
</div>
<div class="meta a-center">
<span class="name">Stephen Holland 2</span>
<span class="carrer">Customer 2</span>
</div>
</div> 
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#testimonials-demo-1");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script> 
</div>
</div> 
</div>
</div>

Fashion Testimonials V2

<div class="ves-wapper" style="background:url({{media url='wysiwyg/ves_boost/fashion/bg-testimonial-02.jpg'}}) center center no-repeat;background-size:cover; padding: 5% 0;">
<div class="container">
<div class="block block-testimonials testimonials-v1 no-margin">
<div class="block-title"><strong>What Our Clients Say ?</strong></div>
<div class="block-content">
<div id="testimonials-demo-1" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<div class="content-tes a-center">They never said winning was easy. Some people can’t handle success, I can. The key to more success is to get a massage..</div>
<div class="meta a-center">
<span class="name">Anna</span>
</div>
</div> 
<div class="item">
<div class="content-tes a-center">They never said winning was easy. Some people can’t handle success, I can. The key to more success is to get a massage..</div>
<div class="meta a-center">
<span class="name">Anna</span>
</div>
</div> 
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#testimonials-demo-1");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>
</div>

7. Brands
Fashion Block Brands V1

<div class="ves-wapper">
<div class="container">
<div class="block block-brands no-margin">
<div class="block-title">
<strong>OUR BRANDS</strong>
</div>
<div class="pretext-html a-center" style="font-size: 16px; color: #a3a5a7">
We believe that Smart is Beautiful—that's why we carry an easy-to-shop selection <br>of wear-everywhere women's clothing for this season and next.
</div>
<div class="block-content">
<div id="brands-slider-demo-1" class="brands-slider">
<div class="owl-carousel">
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand1.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand2.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand3.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand4.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand5.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand6.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand7.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand8.png"}}" alt="" /></div>
</div>
<script type="text/javascript" xml="space">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
$("#brands-slider-demo-1 .owl-carousel").owlCarousel({
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
margin: 20,
nav: false, 
dots: false,
loop: true,
responsive: {
0: {
items:2
},
640: {
items:3
},
768: {
items:4
},
992: {
items:6
},
1200: {
items:6
}
}
});
});
</script>
</div>
</div>
</div>
</div>
</div>

8. Other
Fashion Block Contact

<div class="block-contact"><i class="fa fa-phone" style="color: #444a59;"></i><span style="color: #a8a8a8; margin-left: 10px;">Customer service:</span> <span style="color: #444a59;"><strong>012 34 56 789</strong></span></div>

Category Info

In Furniture Theme

In Furniture Theme

1. Home Slider
Furniture Homeslider 1

<div class="ves-wapper">
<div class="block block-slider no-margin">
<div class="block-content">
<div id="furniture-homeslider-1" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider1.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Eames Design<br>Side Chairs.</h2> 
<p class="d-none d-sm-block">We'll pick up from your venue, or ship it back to us!<br>
Chair Decor – Smart and Gorgeous.</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider2.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Eames Design<br>Side Chairs.</h2> 
<p class="d-none d-sm-block">We'll pick up from your venue, or ship it back to us!<br>
Chair Decor – Smart and Gorgeous.</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#furniture-homeslider-1");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Furniture Homeslider 2

<div class="ves-wapper">
<div class="block block-slider no-margin">
<div class="block-content">
<div id="furniture-homeslider-2" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider3.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Lounging Sofa<br>Modern room</h2> 
<p class="d-none d-sm-block">Make the most of your outdoor space with our lounging<br>
and relaxing furniture</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider3_02.jpg'}}" alt="" />
</a> 
<div class="item-content">
<h2>Lounging Sofa<br>Modern room</h2> 
<p class="d-none d-sm-block">Make the most of your outdoor space with our lounging<br>
and relaxing furniture</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#furniture-homeslider-2");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Furniture Homeslider 3

<div class="ves-wapper">
<div class="block block-slider no-margin">
<div class="block-content">
<div id="furniture-homeslider-3" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider5.jpg'}}" alt="" />
</a> 
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider6.jpg'}}" alt="" />
</a> 
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#furniture-homeslider-3");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

Furniture Homeslider 4

<div class="ves-wapper">
<div class="block block-slider no-margin">
<div class="block-content">
<div id="furniture-homeslider-4" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider4.jpg'}}" alt="" />
</a> 
<div class="item-content">
<p>TRENDING</p>
<h2>Fishnet Chair</h2> 
<p class="d-none d-sm-block">Seat and back with upholstery made of cold cure<br>
foam. Steel frame, available in matt powder-coated black</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
<div class="item">
<a href="#">
<img src="{{media url='wysiwyg/ves_boost/furniture/slider4.jpg'}}" alt="" />
</a> 
<div class="item-content">
<p>TRENDING</p>
<h2>Fishnet Chair</h2> 
<p class="d-none d-sm-block">Seat and back with upholstery made of cold cure<br>
foam. Steel frame, available in matt powder-coated black</p>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-default d-inline">shop now</a>
<a href="{{store url='fashion.html'}}" class="btn btn-lg btn-outline-dark d-inline">details</a>
</div>
</div>
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#furniture-homeslider-4");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});
</script>
</div>
</div>
</div>

2. Product

Furniture Block Product V1

Furniture Block Product V2

Furniture Block Product V3

Furniture Block Product V4

Furniture Block Product V5

Furniture Block Product V6

3. Banner

Furniture Block Images V1

<div class="ves-wapper" style="padding:3% 0 1%;">
<div class="container">
<div class="block title-center block-images v1">
<div class="block-title">
<strong>Popular Categories</strong>
</div>
<div class="block-content">
<div class="row">
<div class="col">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-01.png"}}" alt="" />
<div class="card-body">
<h5 class="card-title">
<a title="Living room" href="#">Living room</a>
</h5>
<div class="card-body"><p>234 Products</p></div>
</div>
</div>
</div>
<div class="col">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-02.png"}}" alt="" />
<div class="card-body">
<h5 class="card-title">
<a title="Home office" href="#">Home office</a>
</h5>
<div class="card-body"><p>234 Products</p></div>
</div>
</div>
</div>
<div class="col">
<div class="card"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-03.png"}}" alt="" />
<div class="card-body">
<h5 class="card-title">
<a title="Shop by room" href="#">Shop by room</a>
</h5>
<div class="card-body"><p>234 Products</p></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Images V2

<div class="ves-wapper">
<div class="block block-images no-margin">
<div class="block-content">
<div class="row no-gutters">
<div class="col-sm-12 col-md-4">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-1.jpg"}}" alt="" />
</div>
<div class="col-sm-12 col-md-4">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-2.jpg"}}" alt="" />
</div>
<div class="col-sm-12 col-md-4">
<img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-3.jpg"}}" alt="" />
</div>
</div>
</div>
</div>
</div>

Furniture Block Images V4

<div class="ves-wapper " style="padding: 3% 0 1%;">
<div class="container">
<div class="block block-images no-margin">
<div class="row">
<div class="col"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-4.jpg"}}" alt="" /></div>
<div class="col"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-5.jpg"}}" alt="" /></div>
</div>
</div>
</div>
</div>

Furniture Block Images V5

<div class="ves-wapper">
<div class="block block-images no-margin">
<div class="block-content">
<div class="row no-gutters">
<div class="col"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-6.jpg"}}" alt="" /></div>
</div>
</div>
</div>
</div>

Furniture Block Images V6

<div class="ves-wapper">
<div class="block block-images no-margin">
<div class="block-content">
<div class="row no-gutters">
<div class="col"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/ads-6.jpg"}}" alt="" /></div>
</div>
</div>
</div>
</div>

Furniture Block Images V7

<div class="ves-wapper border-top border-bottom" style="padding: 3% 0;">
<div class="container">
<div class="block no-margin block-images v7">
<div class="block-content">
<div class="row">
<div class="col-6 col-sm">
<div class="border-right" style="padding: 4px 0;"><a class="a-center" href="#"> <img class="d-block" style="margin: auto; margin-bottom: 29px;" src="{{media url="wysiwyg/ves_boost/furniture/icon-cat-01.png"}}" alt="" /> <span class="d-block" style="color: #000; font-size: 18px;">Lighting</span> </a></div>
</div>
<div class="col-6 col-sm">
<div class="border-right" style="padding: 4px 0;"><a class="a-center" href="#"> <img class="d-block" style="margin: auto; margin-bottom: 29px;" src="{{media url="wysiwyg/ves_boost/furniture/icon-cat-02.png"}}" alt="" /> <span class="d-block" style="color: #000; font-size: 18px;">Chairs</span> </a></div>
</div>
<div class="col-6 col-sm">
<div class="border-right" style="padding: 4px 0;"><a class="a-center" href="#"> <img class="d-block" style="margin: auto; margin-bottom: 29px;" src="{{media url="wysiwyg/ves_boost/furniture/icon-cat-03.png"}}" alt="" /> <span class="d-block" style="color: #000; font-size: 18px;">Furniture</span> </a></div>
</div>
<div class="col-6 col-sm">
<div class="border-right" style="padding: 4px 0;"><a class="a-center" href="#"> <img class="d-block" style="margin: auto; margin-bottom: 29px;" src="{{media url="wysiwyg/ves_boost/furniture/icon-cat-04.png"}}" alt="" /> <span class="d-block" style="color: #000; font-size: 18px;">Decoration</span> </a></div>
</div>
<div class="col-12 col-sm">
<div style="padding: 4px 0;"><a class="a-center" href="#"> <img class="d-block" style="margin: auto; margin-bottom: 29px;" src="{{media url="wysiwyg/ves_boost/furniture/icon-cat-05.png"}}" alt="" /> <span class="d-block" style="color: #000; font-size: 18px;">Bespoke Design</span> </a></div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Images V8

<div class="ves-wapper">
<div class="container">
<div class="border-top border-bottom" style="padding: 3% 0;">
<div class="block block-images v8">
<div class="block-content">
<div class="row">
<div class="col-sm-6 col-md-3">
<div class="custom-title" style="font-size: 30px; line-height: 48px; color: black; font-weight: 600; margin-top: 0; margin-bottom: 15px;"><strong style="border-bottom: 3px solid #f59678; font-weight: 600;">Categories</strong></div>
<p style="color: #696969; line-height: 30px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod</p>
</div>
<div class="col-sm-6 col-md-3">
<div class="card border-0"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-08.jpg"}}" alt="" />
<h5 class="card-title"><a title="Furniture" href="#"># Furniture </a><span>( 35 item )</span></h5>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="card border-0"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-09.jpg"}}" alt="" />
<h5 class="card-title"><a title="Lighting" href="#"># Lighting </a><span>( 22 item )</span></h5>
</div>
</div>
<div class="col-sm-6 col-md-3">
<div class="card border-0"><img class="card-img-top" src="{{media url="wysiwyg/ves_boost/furniture/img-category-10.jpg"}}" alt="" />
<h5 class="card-title"><a title="Accessories" href="#"># Accessories </a><span>( 32 item )</span></h5>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Html V1

<div class="ves-wapper" style="padding: 3% 0; background-color: #f5f5f5;">
<div class="container">
<div class="block block-html v1 no-margin">
<div class="block-content">
<p style="font-size: 18px;">About us</p>
<h3 style="font-size: 30px; font-weight: 600;">Boost Presentation</h3>
<p style="line-height: 30px; color: #969696;">Put it this way, it took me twenty five years to get these plants, twenty five years of blood sweat and tears, and I’m never giving up, I’m just getting started. They never said winning was easy. Some people can’t handle success, I can. The other day the grass was brown, now it’s green because I ain’t give up.</p>
</div>
</div>
</div>
</div>

Furniture Block Html V2

<div class="ves-wapper" style="padding: 4.5% 0;">
<div class="container">
<div class="block block-html html-v2 no-margin">
<div class="block-content">
<div class="row">
<div class="col-sm-12 col-lg-6">
<img src="{{media url="wysiwyg/ves_boost/furniture/ads-7.jpg"}}" alt="" /> 
</div>
<div class="col-sm-12 offset-lg-1 col-lg-5">
<div class="card border-0" style="padding-top: 18%;">
<div class="card-body">
<h5 class="card-title" style="font-size: 47px; color:#000000; font-weight: 600">Design Your Home <br>with Our Products</h5>
<p class="card-text" style="font-size: 24px;line-height:36px; color: #999999; margin-bottom: 20px;">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-lg btn-outline-dark" style="color:#000;">Read the Blog</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Html V3

<div class="ves-wapper" style="background-color: #f5f5f5; padding: 3% 0;">
<div class="container">
<div class="block block-html html-v3 no-margin">
<div class="block-content">
<div class="row">
<div class="col-sm-4 col-md-4">
<div class="content-html">
<h3 style="font-size: 24px; font-weight: 600; margin: 0; margin-bottom: 20px; color: #000;">Concept</h3>
<p style="color: #969696; line-height: 30px;">We help you create a comprehensive and comfortable design plan for your home. Your interior designer will design two different concepts specifically for your space, based on your needs</p>
<a style="color: #000; text-transform: uppercase; font-weight: 600;" href="#">Read more <span class="icon icon-508"></span></a></div>
</div>
<div class="col-sm-4 col-md-4">
<div class="content-html">
<h3 style="font-size: 24px; font-weight: 600; margin: 0; margin-bottom: 20px; color: #000;">Design</h3>
<p style="color: #969696; line-height: 30px;">We help you create a comprehensive and comfortable design plan for your home. Your interior designer will design two different concepts specifically for your space, based on your needs</p>
<a style="color: #000; text-transform: uppercase; font-weight: 600;" href="#">Read more <span class="icon icon-508"></span></a></div>
</div>
<div class="col-sm-4 col-md-4">
<div class="content-html">
<h3 style="font-size: 24px; font-weight: 600; margin: 0; margin-bottom: 20px; color: #000;">Enjoy it</h3>
<p style="color: #969696; line-height: 30px;">We help you create a comprehensive and comfortable design plan for your home. Your interior designer will design two different concepts specifically for your space, based on your needs</p>
<a style="color: #000; text-transform: uppercase; font-weight: 600;" href="#">Read more <span class="icon icon-508"></span></a></div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Html V4

<div class="ves-wapper">
<div class="block block-html html-v4 no-margin">
<div class="block-content">
<div class="content-html a-center" style="background:url({{media url='wysiwyg/ves_boost/furniture/bg-html4.jpg'}}) center center no-repeat;background-size:cover;padding: 6% 0">
<p style="font-size: 18px;color:#999999">Welcome to our</p>
<h3 style="font-size: 80px;color:#000; line-height: 80px;font-weight: 600;margin: 0;">Furniture Gallery</h3>
<p style="font-size: 18px;color:#999999;line-height: 30px; margin-bottom: 20px;">What’ in Trend this Summer?<br>
Most Helpfull Design Lessons You Should Learn to Make Your Dream-Home</p>
<a class="btn btn-lg btn-default" href="#">View more</a>
</div>
</div>
</div>
</div>

Furniture Block Html V5

<div class="ves-wapper" style="padding: 3% 0 0; background-color: #616da7;">
<div class="container">
<div class="block block-html html-v5 title-center text-white no-margin">
<div class="block-title"><strong>Why Choose Us</strong></div>
<div class="block-content">
<div class="row">
<div class="col-md-4">
<div class="list-icon" style="padding-top: 40px;">
<div class="item" style="margin-bottom: 85px; overflow: hidden;">
<div class="text text-right">
<h3>MORDERN DESIGN</h3>
<p>Lorem ipsum dolor amet, consectetur adipiscing elit, sed do.</p>
</div>
<div class="pull-right"><img src="{{media url="wysiwyg/ves_boost/furniture/icon-01.png"}}" alt="" /></div>
</div>
<div class="item">
<div class="text text-right">
<h3>UNIQUE QUALITY</h3>
<p>Lorem ipsum dolor amet, consectetur adipiscing elit, sed do.</p>
</div>
<div class="pull-right"><img src="{{media url="wysiwyg/ves_boost/furniture/icon-03.png"}}" alt="" /></div>
</div>
</div>
</div>
<div class="col-md-4 a-center d-none d-sm-block"><img class="d-inline-block" src="{{media url="wysiwyg/ves_boost/furniture/ads-8.png"}}" alt="" /></div>
<div class="col-md-4">
<div class="list-icon" style="padding-top: 40px;">
<div class="item" style="margin-bottom: 85px; overflow: hidden;">
<div class="f-left"><img src="{{media url="wysiwyg/ves_boost/furniture/icon-02.png"}}" alt="" /></div>
<div class="text a-left">
<h3>HONEST PRICES</h3>
<p>Lorem ipsum dolor amet, consectetur adipiscing elit, sed do.</p>
</div>
</div>
<div class="item">
<div class="f-left"><img src="{{media url="wysiwyg/ves_boost/furniture/icon-04.png"}}" alt="" /></div>
<div class="text a-left">
<h3>GREAT SUPPORT</h3>
<p>Lorem ipsum dolor amet, consectetur adipiscing elit, sed do.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Furniture Block Html V6

<div class="ves-wapper" style="background-color: #616da7;">
<div class="block block-html html-v6 no-margin">
<div class="block-content">
<div class="row">
<div class="col-sm-6 col-md-5 col-lg-7"><img src="{{media url="wysiwyg/ves_boost/furniture/ads-8.jpg"}}" alt="" /></div>
<div class="col-sm-6 col-md-7 col-lg-5">
<div class="card border-0" style="padding: 30% 10% 0; color: #fff; background-color: #616da7;">
<div class="card-body">
<h5 class="card-title" style="font-size: 16px; font-weight: 600; text-transform: uppercase;">Our Story</h5>
<p class="card-text" style="font-size: 42px; font-weight: 300;">Our marketplace makes it easy to buy directly from small businesses across the globe.</p>
<a class="btn btn-lg" style="background-color: #fff; color: #000;" href="#">JOIN US</a></div>
</div>
</div>
</div>
</div>
</div>
</div>

4. Blog
Furniture Block Blog V1

Furniture Block Blog V2

Furniture Block Blog V3

5. Testimonial
Furniture Testimonials V1

<div class="ves-wapper" style="background: url('{{media url='wysiwyg/ves_boost/furniture/bg-testimonial.jpg'}}') center center no-repeat; background-size: cover; padding: 3% 0 4.5%;">
<div class="container">
<div class="block title-center no-margin block-testimonials text-white testimonials-v1">
<div class="block-title"><strong>Testimonials</strong></div>
<div class="block-content">
<div id="testimonials-demo-1" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<div class="content-tes">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars!</div>
<div class="info-customer d-flex justify-content-center align-items-center"><img class="img-customer" src="{{media url="wysiwyg/ves_boost/furniture/img-testimonial-1.jpg"}}" alt="" />
<div class="meta"><span class="name">Stephen Holland</span> <span class="carrer">Customer</span></div>
</div>
</div>
<div class="item">
<div class="content-tes">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars 2!</div>
<div class="info-customer d-flex justify-content-center align-items-center"><img class="img-customer" src="{{media url="wysiwyg/ves_boost/furniture/img-testimonial-1.jpg"}}" alt="" />
<div class="meta"><span class="name">Stephen Holland 2</span> <span class="carrer">Customer 2</span></div>
</div>
</div>
</div>
<script type="text/javascript" xml="space">// <![CDATA[
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#testimonials-demo-1");
banner_owl.owlCarousel({
items: 1,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"]
});
});

// ]]></script>
</div>
</div>
</div>
</div>

Furniture Testimonials V2

<div class="ves-wapper" style="padding: 3% 0 0">
<div class="container">
<div class="row">
<div class="col-md-6 col-lg-8">
<div class="block block-testimonials testimonials-v2 no-margin">
<div class="block-title border-bottom">
<strong>Testimonials</strong>
</div>
<div class="block-content">
<div id="testimonials-demo-2" class="owl-carousel owl-banner-carousel owl-bottom-narrow owl-bottom-absolute-narrow">
<div class="item">
<div class="col-md-11 content-tes">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars!</div>
<div class="col-md-11 info-customer d-flex align-items-center">
<img class="img-customer" src="{{media url="wysiwyg/ves_boost/furniture/img-testimonial-1.jpg"}}" alt="" />
<div class="meta">
<span class="name">Stephen Holland</span>
<span class="carrer">Customer</span>
</div>
</div>
</div> 
<div class="item">
<div class="col-md-11 content-tes">I wish I would have found Boost earlier. That would have saved me a lot of money on WP themes. It's Highly Customizable! I Love it! I would like to rate it ten stars 2!</div>
<div class="col-md-11 info-customer d-flex align-items-center">
<img class="img-customer" src="{{media url="wysiwyg/ves_boost/furniture/img-testimonial-1.jpg"}}" alt="" />
<div class="meta">
<span class="name">Stephen Holland 2</span>
<span class="carrer">Customer 2</span>
</div>
</div>
</div> 
</div>
<script type="text/javascript">
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
var banner_owl = $("#testimonials-demo-2");
banner_owl.owlCarousel({
items: 2,
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
dots: false,
nav: true,
navRewind: true,
animateIn: 'fadeIn',
animateOut: 'fadeOut',
loop: true,
navText: ["<i class='icon icon-557'></i>","<i class='icon icon-556'></i>"],
responsive: {
0: {
items:1
},
640: {
items:1
},
768: {
items:1
},
992: {
items:2
},
1200: {
items:2
}
}
});
});
</script>
</div>
</div>
</div> 
<div class="col-md-6 col-lg-4">
{{widget type="Ves\Blog\Block\Widget\Posts" widget_title="Most Recent Blogs" addition_class="blog-v2 no-margin" layout_type="owl_carousel" categories="4" orderby="1" number_post="6" item_height="400px" number_item_percolumn="2" large_max_items="1" large_items="1" portrait_items="1" tablet_items="1" tablet_small_items="1" mobile_items="1" rtl="0" autoplay="0" dots="0" nav="0" loop="0" lazyload="0" show_image="0" image_width="400px" image_height="295px" show_title="1" show_shortdescription="0" show_categories="0" show_author="1" show_commentcount="1" show_updatedtime="0" show_createdtime="1" show_hits="0" show_tags="0" show_socialnetwork="0"}}
</div> 
</div>
</div>
</div>

6. Other
Furniture Block Top Header

<div class="furniture-block-header-top">
<ul>
<li>
<i class="icon icon-023"></i>
<span>Free Shipping & Returns</span>
</li>
<li>
<i class="icon icon-065"></i>
<span>100% Money refund</span>
</li>
<li>
<i class="icon icon-1238"></i>
<span>60-Day Returns</span>
</li>
</ul>
</div>

Furniture Block Newsletter

<div class="newsletter-footer">
<div class="container">
<div class="row">
<div class="col-lg-7">
<h3>SUBSCRIBE TO NEWSLETTER</h3>
<p>Be the first to learn about our latest trends and get exclusive offers</p>
</div>
<div class="col-lg-5">{{block class="Magento\Newsletter\Block\Subscribe" template="Magento_Newsletter::subscribe.phtml"}}</div>
</div>
</div>
</div>

Furniture Block Our Team V1

<div class="ves-wapper" style="padding: 3% 0;">
<div class="container">
<div class="block block-ourteam no-margin title-center">
<div class="block-title "><strong>Our Team</strong></div>
<div class="block-content">
<div id="our-team-slider-demo-1" class="our-team-slider">
<div class="owl-carousel">
<div class="item">
<div class="row">
<div class="col-sm-6 col-md-6">
<h3 style="font-size: 24px; color: #000; margin: 0; font-weight: 600;">Valeria Domino</h3>
<p style="color: #999999; line-height: 36px;">Lighting Designer</p>
<p style="color: #999999; line-height: 30px; padding: 25px 0;">In 3 easy steps, our professional designers can help you create your dream space very quickly and fun.</p>
<div class="item-progress">
<div class="item" style="padding-bottom: 15px;">
<p>Interior</p>
<div class="progress">
<div class="progress-bar" style="width: 75%;"></div>
</div>
</div>
<div class="item" style="padding-bottom: 15px;">
<p>Furniture Design</p>
<div class="progress">
<div class="progress-bar" style="width: 60%;"></div>
</div>
</div>
<div class="item" style="padding-bottom: 15px;">
<p>Lighting</p>
<div class="progress">
<div class="progress-bar" style="width: 85%;"></div>
</div>
</div>
</div>
<ul class="list-social">
<li class="facebook"><a class="fa fa-facebook" title="Facebook" href="http://facebook.com/#"></a></li>
<li class="twitter"><a class="fa fa-twitter" title="Twitter" href="https://twitter.com/#"></a></li>
<li class="instagram"><a class="fa fa-instagram" title="Instagram" href="https://instagram.com/#"></a></li>
</ul>
</div>
<div class="col-sm-6 col-md-6"><img src="{{media url="wysiwyg/ves_boost/furniture/our-team1.jpg"}}" alt="" /></div>
</div>
</div>
<div class="item">
<div class="row">
<div class="col-sm-6 col-md-6">
<h3 style="font-size: 24px; color: #000; margin: 0; font-weight: 600;">Valeria Domino</h3>
<p style="color: #999999; line-height: 36px;">Lighting Designer</p>
<p style="color: #999999; line-height: 30px; padding: 25px 0;">In 3 easy steps, our professional designers can help you create your dream space very quickly and fun.</p>
<div class="item-progress">
<div class="item" style="padding-bottom: 15px;">
<p>Interior</p>
<div class="progress">
<div class="progress-bar" style="width: 75%;"></div>
</div>
</div>
<div class="item" style="padding-bottom: 15px;">
<p>Furniture Design</p>
<div class="progress">
<div class="progress-bar" style="width: 60%;"></div>
</div>
</div>
<div class="item" style="padding-bottom: 15px;">
<p>Lighting</p>
<div class="progress">
<div class="progress-bar" style="width: 85%;"></div>
</div>
</div>
</div>
<ul class="list-social">
<li class="facebook"><a class="fa fa-facebook" title="Facebook" href="http://facebook.com/#"></a></li>
<li class="twitter"><a class="fa fa-twitter" title="Twitter" href="https://twitter.com/#"></a></li>
<li class="instagram"><a class="fa fa-instagram" title="Instagram" href="https://instagram.com/#"></a></li>
</ul>
</div>
<div class="col-sm-6 col-md-6"><img src="{{media url="wysiwyg/ves_boost/furniture/our-team1.jpg"}}" alt="" /></div>
</div>
</div>
</div>
<script type="text/javascript" xml="space">// <![CDATA[
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
$("#our-team-slider-demo-1 .owl-carousel").owlCarousel({
autoplay: true,
items: 1,
autoplayTimeout: 5000,
autoplayHoverPause: true,
margin: 20,
nav: true, 
navText: ["<i class='fa fa-arrow-circle-o-left'></i> Prev Member","Next Member <i class='fa fa-arrow-circle-o-right'></i>"],
dots: false,
loop: true
});
});
// ]]></script>
</div>
</div>
</div>
</div>
</div>

Furniture Block Brands V1

<div class="ves-wapper" style="padding: 2% 0;">
<div class="container">
<div class="block block-brands no-margin">
<div class="block-content">
<div id="brands-slider-demo-1" class="brands-slider">
<div class="owl-carousel">
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand1.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand2.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand3.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand4.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand5.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand6.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand7.png"}}" alt="" /></div>
<div class="item"><img src="{{media url="wysiwyg/ves_boost/brands/brand8.png"}}" alt="" /></div>
</div>
<script type="text/javascript" xml="space">// <![CDATA[
require([
'jquery',
'owl.carousel/owl.carousel.min'
], function ($) {
$("#brands-slider-demo-1 .owl-carousel").owlCarousel({
autoplay: true,
autoplayTimeout: 5000,
autoplayHoverPause: true,
margin: 20,
nav: false,
dots: false,
loop: true,
responsive: {
0: {
items:2
},
640: {
items:3
},
768: {
items:4
},
992: {
items:6
},
1200: {
items:6
}
}
});
});
// ]]></script>
</div>
</div>
</div>
</div>
</div>

Furniture Text Welcome

We're Dedicated to Our Customers 24/7

Furniture Block Header

<a href="{{store url="#"}}">Contact us</a> <a href="{{store url="#"}}">Faqs</a>

Tab by Category

Getting Started

Undu comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for Magento 2? Undu is designed for Magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Undu is one of our responsive Magento 2 themes. This Magento 2 theme created with new Magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from Magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Undu is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x, 2.2.x

Demo Link: http://demo4coder.com/undu/

Purchase It Now

General Questions

Homepage Configuration

Undu have 8 extensions with 6 homepages built by Ves Page Builder module.

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save the configuration.

Go to back-end > VenusTheme > Manage Page Profile > Edit profile name “Undu Home Page Default

In the back-end, we used the widget, namely “Content Carousel” on page builder profile. To change image slider, please Go to back-end > VenusTheme > choose “Manager Elements” > Edit block profile “Undu Slider 1”.

  1. Undu Slider 1
  2. Undu Slider 2
  3. Undu Slider 3
  4. Undu Slider 4
  5. Undu Slider 5
  6. Undu Slider 6




ex: content for “Undu Slider 1“:

<p><a href="{{store url="women.html"}}"><img src="{{media url="wysiwyg\ves_undu/slider/slider1.jpg"}}" alt="" /></a></p>
<div class="slider-content">
<h3>White Sneakers</h3>
<div class="sub-text">STYLE 2018</div>
<p><a class="action primary" href="{{store url='men.html'}}">VIEW COLLECTION</a></p>
</div>

 

Undu Banner:
Back-end Setting: 

Undu Banner V2:

Back-end Setting:

Undu Banner V3:

Back-end Setting:

Undu Banner V4:

Back-end Setting:

How To Config in the back-end :
please Go to back-end > VenusTheme > Manage Elements > Edit page builder element profile “Undu Ads”.

Add a background image to this block:

Undu Ads V2:

Back-end Setting:

Undu intro:

Back-end Setting:

Undu Intro V2 :

Back-end Setting:

Undu Intro V5:

Back-end Setting:

 

Back-end Setting:
please Go to back-end > VenusTheme > Manage Elements > Edit pagebuilder element profile “Our service”.

Our Service V2:

Back-end Setting:

+ How To Config In The Backend

please Go to back-end > VenusTheme > Manage Elements > Edit page builder element profile “Undu Newsletter”.



Undu Newsletter V2:

+ How To Config In The Backend

please Go to back-end > VenusTheme > Manage Elements > Edit pagebuilder element profile “Undu Blog Posts”.




 

Back-end Setting:

please Go to back-end > VenusTheme > Manage Elements > Edit page builder element profile “Undu Tab Product”.

 

Undu Featured Products:

 

Back-end Setting:
please Go to back-end > VenusTheme > Manage Elements > Edit page builder element profile “Undu Featured Products”.



 

Product List Product Slider:

Back-end Setting:
please Go to back-end > VenusTheme > Manage Elements > Edit page builder element profile “Product List Product Slider”.




 

Back-end Setting:
please Go to back-end > VenusTheme > Manage Elements > Edit pagebuilder element profile “Undu Instagram”.

Undu Instagram V2:

Back-end Setting:

Undu Instagram V3:

Back-end Setting:

The theme is not responsive on my mobile?

The problem when we using new version of ves themesettings extension on old theme sample data.
To fix it, please go to admin > venustheme > Ves Theme Settings > General > Input Maximum Page Width = Empty (before it was set 1200px). Then Save Config.

Simple Content Html Block

Homepage Configuration

Ves Global Magento 1.9.x have 2 different homepages built by Ves Page Builder module.

I. Global Home Page Default:

link demo

II. Global Home Page 2:

link demo

To configure the default home page for your store, go to System > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

To configure the home page for other store, please select your Store View and select the desired page in the CMS Home Page field

Go to back-end > VenusTheme > Ves Page builder > Manager page profile > Edit profile name “Home Page Default”

Go to back-end > VenusTheme > Ves LayerSlider > Manager Banners and select your slider ( ex: Slider default ).

– To change text

– To change image: click the current image, press “Select image” button then browser to your path.

To insert it in the pagebuilder, you use widget with namely: “Ves Layer Slider” and select “Banner Id”

+ In the back-end, we used the widget, namely “Single Image” on page builder profile

+ You can edit widget and change image in this popup by choosing “Edit” Button

– add class no-effect if you don’t want to show effect when hover the image.

– Enable Image Description: Yes and add description into textarea Image Description.

+ In the back-end, we used the widget, namely “HTML Block” on page builder profile

+ You can edit widget in this popup by choosing “Edit” Button

NOTE: you can insert class icon (font awesome) for Widget Title using

+ How To Config In The Backend

>> To config product carousel, please open the widget “Product list: Tabs by rules” or widget “Product list: Tabs by categories” (To select special category) and edit it

+ Tabs Settings:

Select your rule.

List rule, VenusTheme > Ves Product List > Manage Rules you can edit or add new rule.

+ Config Product Setting to Show/Hidden the elements:

+  Config Carousel Setting:

Config show/hidden Navigation, Pagination and product items on each device responsively.

>> Config Product list: Tabs by categories has different options here:

you can select your categories.

Column highlighted

Config in the back-end:

>> Select Column Style: highlighted

Column success

>> Select Column Style: Success

Fontend:

In this widget, you can config it like “6. How To Config Product Carousel Show Grid View Mode” element but it has different options here:

– Select Tabs Type: Bootstrap Tabs And Carousel Layout

– Config number column and products

In page builder, you can choose widget: “Content Carousel” and click “edit”

Carousel Setting:

you can set number items on each device responsively.

Block content:


			<div class="pull-left">
			<img src="{{media url="single_image/d1-06.png"}}" alt="" /></div>
			@venus It's fully customizable. A good extension!<br>
			<span><em class="fa fa-twitter"> </em>2 minutes ago</span>

		

In page builder, you can choose widget: “Ves Brand Scroll” and click “edit” button

you can change number item and column for this widget.

We used module template in file path: ves/brand/block/carousel.phtml

Remove space for each row

In page builder, you can choose “setting” button to make space for each row

In the “Row Setting” >> Open “Layout” Tab >> Add css margin or padding like below image

Remove space for each element

you can add class “no-padding-left” or “no-padding-right”

Or you can using column style: no-padding to remove all padding (top, right, bottom and left)

Getting Started

Seeking theme to turn your store into a high-fashion collection. Frido is the best choice for you. This Impressive Magento 2 Fashion theme designed to attract your customers at the first sight. With amazing design & dozen of stunning features, It best fits for your premium online stores like fashion store, accessories store, boutique shop, men & women collections, kid clothing, shoe store, etc.

With 8+ stunning premade homepages, 3+ category Layout Styles and Drag & Drop Mega Menu, Store owner can create a beautiful website in the blink of an eye.

Frido is organized in a flexible, customer-friendly way; hence, the desired page can be reached in the blink of an eye. Especially, including extended product page along with Ajax Filter, Product Hover Effect and quick view, it appeals effectively customers attention focus on and finds out quickly the desired product they want. Don’t worry anymore, thanks to Frido, your customer will have a great shopping experience on your site.

Frido is one of our responsive Magento 2 themes. This Magento 2 theme created with new Magento 2 UI and integrate bootstrap 4.0.0 layout components. Also, it is inherited from Magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Frido is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x, 2.2.x

Demo Link: http://server1.demo4coder.com/frido/landing

Purchase It Now

Header Configuration

Ves Global provides 2 header styles, you can choose one of them here.

Backend config:

To Config Header Default, Go to Admin Panel >> VenusTheme >> Ves Theme Settings >> Header >> Choose “Header” for Header Layout

Code html at this path file

app\design\frontend\ves_global\default\template\common\header\header.phtml

>> How To Config Other Header for storeview

  1. header: header.phtml
  2. header-v2: header-v2.phtml

To change Logo, Go to Admin Panel > System > Configuration > Design > Header

After that, you select Current Configuration Scopeto then enter url image (GIF, PNG, JPG, or SVG file type)

default path: skin\frontend\ves_global\default\images\

Font-end:

To change top link, Go to the path: app\design\frontend\ves_global\default\template\common\header

then select your header and change text, icon class

Config Contact Page

Link page: server1.demo4coder.com/bicomart/contact

How To config: Go To VenusTheme > Ves Theme Settings > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information: email, address, telephone, fax, custom HTML for us, etc…

 

+ Edit Form :

You can edit form in this patch file:

app\design\frontend\Venustheme\bicomart\Magento_Contact\templates\form.phtml

Coupon Countdown Banner

We use the widget to load a countdown banner with magento 2  coupon code information (cart price rules of magento marketing section).

Footer Profiles

The frontend show:

How To Config footer profiles in backend

Go to back-end > VenusTheme > Ves Theme Setting > Theme Setting > Footer > “Footer Layout

To edit content footer you go to VenusTheme > Ves Block Builder > Manage Block Profile open “Footer Layout

How To Edit Copyright and List Category

They are directed in file path: app\design\frontend\ves_global\default\template\page\html\footer.phtml

1. How To Change Copyright:
You can edit cotent copyright in Admin > System > Configuration > Design > Footer > Copyright

2. Change list category
Go to Admin > CMS > Static Blocks > open block_footer_categories and edit widget

Static Blocks Diagram

This is all CMS static blocks we are using on the Bicomart.
To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

How to use a CMS static block

Below is some sample content.

Block Banners

Block Banner 1

<div class="ves-wrap" style="margin-bottom: 30px;">
<div class="container">
<div class="row">
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='electronics.html'}}"><img src="{{media url="wysiwyg/bicomart/banner3.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='electronics.html'}}"><img src="{{media url="wysiwyg/bicomart/banner4.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='electronics.html'}}"><img src="{{media url="wysiwyg/bicomart/banner5.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
</div>
</div>
</div>

Block Banner 2

<div class="ves-wrap" style="margin-bottom: 30px;">
<div class="container">
<div class="row">
<div class="col-lg-6 col-sm-6">
<div class="block block-images">
<a href="{{store url='home-garden.html'}}"><img src="{{media url="wysiwyg/bicomart/banner6.jpg"}}" alt="" width="640" height="300" /></a>
</div>
</div>
<div class="col-lg-6 col-sm-6">
<div class="block block-images">
<a href="{{store url='home-garden.html'}}"><img src="{{media url="wysiwyg/bicomart/banner7.jpg"}}" alt="" width="640" height="300" /></a>
</div>
</div>
</div>
</div>
</div>

Block Banner 3

<div class="ves-wrap" style="margin-bottom: 30px;">
<div class="container">
<div class="row">
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='fashion.html'}}"><img src="{{media url="wysiwyg/bicomart/banner9.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='fashion.html'}}"><img src="{{media url="wysiwyg/bicomart/banner10.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
<div class="col-lg-4 col-sm-4">
<div class="block block-images">
<a href="{{store url='fashion.html'}}"><img src="{{media url="wysiwyg/bicomart/banner11.jpg"}}" alt="" width="420" height="258" /></a>
</div>
</div>
</div>
</div>
</div>

Block Banner 4

<div class="ves-wrap clearfix" style="margin: 0 0 40px;">
<div class="container">
<div class="block block-images">
<div class="block-title">
<strong>Consumer Electronics</strong>
</div>
<ul class="cat-links">
<li><a href="#">Computers</a></li>
<li><a href="#">Air Condition</a></li>
<li><a href="#">Smartphones</a></li>
<li><a href="#">TV &amp; Audio</a></li>
<li><a href="#">Office Electronic</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner2.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner3.jpg"}}" alt="" />
</a>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner4.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner5.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner6.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner7.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</div>

Block Banner 5

<div class="ves-wrap clearfix" style="margin: 0 0 40px;">
<div class="container">
<div class="block block-images">
<div class="block-title">
<strong>Home, Garden & Kitchen</strong>
</div>
<ul class="cat-links">
<li><a href="#">Furniture</a></li>
<li><a href="#">Cookware</a></li>
<li><a href="#">Utensils & Gadget</a></li>
<li><a href="#">Garden Tools</a></li>
<li><a href="#">Accessories</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner8.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner9.jpg"}}" alt="" />
</a>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner10.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner11.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner12.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner13.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</div>

Block Banner 6

<div class="ves-wrap clearfix" style="margin: 0 0 40px;">
<div class="container">
<div class="block block-images">
<div class="block-title">
<strong>Clothing & Apparel</strong>
</div>
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">Women</a></li>
<li><a href="#">Men</a></li>
<li><a href="#">Girls</a></li>
<li><a href="#">Boys</a></li>
<li><a href="#">Baby</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-4 col-md-4 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner14.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner15.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-4 col-md-4 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner16.jpg"}}" alt="" />
</a>
</div>
</div>
<div class="row">
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner17.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner18.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner19.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-3 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner20.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</div>

Block Banner 7

<div class="ves-wrap clearfix" style="margin: 0 0 20px;">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<div class="block block-images">
<div class="block-title">
<strong>Sport & Outdoors</strong>
</div>
<ul class="cat-links">
<li><a href="#">Accessories</a></li>
<li><a href="#">Clothings</a></li>
<li><a href="#">Shoes</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner21.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner23.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner24.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<div class="block block-images">
<div class="block-title">
<strong>Beauty & Health</strong>
</div>
<ul class="cat-links">
<li><a href="#">Accessories</a></li>
<li><a href="#">Hair Care</a></li>
<li><a href="#">Skin Care</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner22.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner25.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner26.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Block Banner 8

<div class="ves-wrap clearfix" style="margin: 0 0 20px;">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<div class="block block-images">
<div class="block-title">
<strong>Furniture</strong>
</div>
<ul class="cat-links">
<li><a href="#">Accessories</a></li>
<li><a href="#">Decor</a></li>
<li><a href="#">Office</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner27.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner29.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner30.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<div class="block block-images">
<div class="block-title">
<strong>Home Services</strong>
</div>
<ul class="cat-links">
<li><a href="#">Accessories</a></li>
<li><a href="#">Cleaning</a></li>
<li><a href="#">Painting</a></li>
</ul>
<div class="block-content">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner28.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner31.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-6 col-md-6 col-sm-6">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home2/banner32.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Block Banner 9

<div class="ves-wrap clearfix" style="background: #f2f2f2;">
<div class="container">
<div class="box box-v2" style="margin: 50px 0;">
<div class="row">
<div class="col-lg-2 col-md-12">
<div class="block block-link">
<div class="block-title">
<strong>Consumer Electronics</strong>
</div>
<div class="block-content">
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">New Arrivals</a></li>
<li><a href="#">Computers</a></li>
<li><a href="#">Air Condition</a></li>
<li><a href="#">Smartphones</a></li>
<li><a href="#">TV &amp; Audio</a></li>
<li><a href="#">Washing Machine</a></li>
<li><a href="#">Microwave</a></li>
<li><a href="#">Office Electronic</a></li>
<li><a href="#">Refrigerator</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner1.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner2.jpg"}}" alt="" />
</a>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner3.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner4.jpg"}}" alt="" />
</a>
<a href="#" class="no-margin">
<img src="{{media url="wysiwyg/bicomart/home3/banner5.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>

Block Banner 10

<div class="ves-wrap clearfix" style="background: #f2f2f2;">
<div class="container">
<div class="box box-v2" style="margin-bottom: 50px;">
<div class="row">
<div class="col-lg-2 col-md-12">
<div class="block block-link">
<div class="block-title">
<strong>Home, Garden & Kitchen</strong>
</div>
<div class="block-content">
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">New Arrivals</a></li>
<li><a href="#">Furniture</a></li>
<li><a href="#">Home Decor</a></li>
<li><a href="#">Cookware</a></li>
<li><a href="#">Utensils & Gadget</a></li>
<li><a href="#">Garden Tools</a></li>
<li><a href="#">Acessesories</a></li>
<li><a href="#">Sales & Deals</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner6.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner7.jpg"}}" alt="" />
</a>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner8.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner9.jpg"}}" alt="" />
</a>
<a href="#" class="no-margin">
<img src="{{media url="wysiwyg/bicomart/home3/banner10.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>

Block Banner 11

<div class="ves-wrap clearfix" style="background: #f2f2f2;">
<div class="container">
<div class="box box-v2" style="margin-bottom: 50px;">
<div class="row">
<div class="col-lg-2 col-md-12">
<div class="block block-link">
<div class="block-title">
<strong>Clothing & Apparel</strong>
</div>
<div class="block-content">
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">New Arrivals</a></li>
<li><a href="#">T-Shirt</a></li>
<li><a href="#">Men</a></li>
<li><a href="#">Women</a></li>
<li><a href="#">Girls</a></li>
<li><a href="#">Boys</a></li>
<li><a href="#">Baby</a></li>
<li><a href="#">Acessesories</a></li>
<li><a href="#">Sales & Deals</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner11.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner12.jpg"}}" alt="" />
</a>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner13.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner14.jpg"}}" alt="" />
</a>
<a href="#" class="no-margin">
<img src="{{media url="wysiwyg/bicomart/home3/banner15.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>

Block Banner 12

<div class="ves-wrap clearfix" style="background: #f2f2f2;">
<div class="container">
<div class="box box-v2" style="margin-bottom: 50px;">
<div class="row">
<div class="col-lg-2 col-md-12">
<div class="block block-link">
<div class="block-title">
<strong>Beauty & Health</strong>
</div>
<div class="block-content">
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">Grooming</a></li>
<li><a href="#">Value Bazaar</a></li>
<li><a href="#">Luxury Beauty</a></li>
<li><a href="#">Make-up</a></li>
<li><a href="#">Personal Care</a></li>
<li><a href="#">Household</a></li>
<li><a href="#">Diet & Nutrition</a></li>
<li><a href="#">Subscribe & Save</a></li>
<li><a href="#">Sales & Deals</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner16.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner17.jpg"}}" alt="" />
</a>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner18.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner19.jpg"}}" alt="" />
</a>
<a href="#" class="no-margin">
<img src="{{media url="wysiwyg/bicomart/home3/banner20.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>

Block Banner 13

<div class="ves-wrap clearfix" style="margin-bottom: 50px; background: #f2f2f2;">
<div class="container">
<div class="box box-v2" style="margin-bottom: 50px;">
<div class="row">
<div class="col-lg-2 col-md-12">
<div class="block block-link">
<div class="block-title">
<strong>Furniture</strong>
</div>
<div class="block-content">
<ul class="cat-links">
<li><a href="#">Best Seller</a></li>
<li><a href="#">New Arrivals</a></li>
<li><a href="#">Living Room</a></li>
<li><a href="#">Out Door</a></li>
<li><a href="#">Kitchens</a></li>
<li><a href="#">Lighting</a></li>
<li><a href="#">Sofa & Chair</a></li>
<li><a href="#">Office</a></li>
<li><a href="#">Bathroom</a></li>
<li><a href="#">Accessories</a></li>
<li><a href="#">Sales & Deals</a></li>
</ul>
</div>
</div>
</div>
<div class="col-lg-4 col-md-4">
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner21.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner22.jpg"}}" alt="" />
</a>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/home3/banner23.jpg"}}" alt="" />
</a>
</div>
<div class="col-lg-3 col-md-4">
<a href="#" style="margin-bottom: 20px;">
<img src="{{media url="wysiwyg/bicomart/home3/banner24.jpg"}}" alt="" />
</a>
<a href="#" class="no-margin">
<img src="{{media url="wysiwyg/bicomart/home3/banner25.jpg"}}" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>

Block Product

Block Product 1

Block Product 2

Block Product 3

Block Others

Block Deals

Block Deals V2

Block Categories

<div class="ves-wrap" style="background: #f3f3f3; padding: 35px 0; margin-bottom: 40px;">
<div class="container">
<div class="block block-cat">
<div class="block-title">Top Categories</div>
<div class="block-content">
<ul>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat1.jpg"}}" alt="" width="140" height="140" />
<p># Television</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat2.jpg"}}" alt="" width="140" height="140" />
<p># Camera</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat3.jpg"}}" alt="" width="140" height="140" />
<p># Watch</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat4.jpg"}}" alt="" width="140" height="140" />
<p># Chair</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat5.jpg"}}" alt="" width="140" height="140" />
<p># Sneaker</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat6.jpg"}}" alt="" width="140" height="140" />
<p># Xbox</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat7.jpg"}}" alt="" width="140" height="140" />
<p># Gopro</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat8.jpg"}}" alt="" width="140" height="140" />
<p># Lipstick</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat9.jpg"}}" alt="" width="140" height="140" />
<p># iPhone</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat10.jpg"}}" alt="" width="140" height="140" />
<p># Laptop</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat11.jpg"}}" alt="" width="140" height="140" />
<p># Book</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat12.jpg"}}" alt="" width="140" height="140" />
<p># Speaker</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat13.jpg"}}" alt="" width="140" height="140" />
<p># Blender</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat14.jpg"}}" alt="" width="140" height="140" />
<p># Bags</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat15.jpg"}}" alt="" width="140" height="140" />
<p># Headphone</p>
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/cat_img/cat16.jpg"}}" alt="" width="140" height="140" />
<p># Camping</p>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>

Block Brand

<div class="ves-wrap clearfix">
<div class="container">
<div class="block block-brand">
<div class="block-title">Top Brands</div>
<div class="block-content">
<ul>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand1.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand2.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand3.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand4.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand5.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand6.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand7.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand8.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand9.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand10.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand11.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
<li>
<a href="#">
<img src="{{media url="wysiwyg/bicomart/brands/brand12.jpg"}}" alt="" width="160" height="60" />
</a>
</li>
</ul>
</div>
</div>
</div>
</div>

Block Service

<div class="ves-wrap" style="margin-bottom: 30px;">
<div class="container">
<div class="row">
<div class="col-lg-3 col-sm-3">
<div class="block block-service">
<div class="block-content">
<div class="pull-left">
<span class="icon icon-023">&nbsp;</span>
</div>
<div class="service-content">
<h4>Free Delivery</h4>
<p>Free shipping on all order</p>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-sm-3">
<div class="block block-service">
<div class="block-content">
<div class="pull-left">
<span class="icon icon-048">&nbsp;</span>
</div>
<div class="service-content">
<h4>Member Discount</h4>
<p>Onevery order over $120.00</p>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-sm-3">
<div class="block block-service">
<div class="block-content">
<div class="pull-left">
<span class="icon icon-074">&nbsp;</span>
</div>
<div class="service-content">
<h4>Money Return</h4>
<p>Back guarantee under 7 days</p>
</div>
</div>
</div>
</div>
<div class="col-lg-3 col-sm-3">
<div class="block block-service">
<div class="block-content">
<div class="pull-left">
<span class="icon icon-270">&nbsp;</span>
</div>
<div class="service-content">
<h4>Online Support 24/7</h4>
<p>Support online 24 hours a day</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

Block Welcome

We're Dedicated to Our Customers 24/7

Config header

1. General tab: Choose Header Layout: “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add a custom top link:
3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of the search box
– Change the format button search

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\name_theme\Magento_Theme\templates\html\setting.phtml

How it is shown on front-end:
5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose to specify an element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

Banner Countdown Timer

Load banner image with count down timer.

we config the widget as this:

magento 2 pages builder | banner countdown widget config

Footer Proflies

The frontend show:

How To Config footer profiles in backend

Go to back-end > Ves Themesetting > Footer > Custom HTML click button “Insert Widget

Select Widget : “ Ves Block Builder: Generate Block Builder Profile

Choose Block Id : “Flipcart Footer

 

How To Edit Our Service

Go to back-end > Ves PageBuilder > Manage Block Proflie > Choose Edit Block Flipcart Footer

In the back-end, we used the widget, namely “HTML Block” on page builder profile. To change content our service, please  Choose edit “HTML Block” widget.

Edit Content our service

How To Edit Footer Logo

In the back-end, we used the widget, namely “HTML Block” on Manage block profile. To change Logo , please Go to back-end > Ves Pagebuilder > Manager block profile > Choose to edit Flipcart Footer > Edit “HTML Block” widget.

Edit Logo, text content :

How To Edit Footer Links

In the back-end, we used the widget, namely “Block Links” on Manage block profile. To change links , please Go to back-end > Ves Pagebuilder > Manager block profile > Choose to edit Flipcart Footer > Edit “Block Links” widget.

Edit Text Links, Link url :

How To Change Logo Payment

In the back-end, we used the widget, namely “HTML Block” on Manage block profile. To change Logo , please Go to back-end > Ves Pagebuilder > Manager block profile > Choose to edit Flipcart Footer > Edit “HTML Block” widget.

Edit Title, images logo :

How To Edit Copyright and Custom Links

In the back-end, we used the widget, namely “HTML Block” on Manage block profile. To change Copyright , please Go to back-end > Ves Pagebuilder > Manager block profile > Choose to edit Flipcart Footer > Edit “HTML Block” widget.

Edit Copyright , custom links :

Config Product View Page

– Other elements:

+ Config enable / disable elements by change value Yes / No

+ Specify you can change the position of thumbnail slider: horizontal or vertical, Top or bottom

– Config show tab- Custom tab

+ Tab By Product Attribute Code

+ Tab By CMS Block

+ Tab By Static Html Content

– Config Related Products, Upsell product: number items and item show on responsive

– Frontend show:

Theme Settings

In this tab, you are able to:

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Select your header, footer profile

– Config enable/disable elements in pages

– Config size product’s image in detail and category page

– Config number products show in block upsell, related and crossell…

 

To config them please go to Admin Panel > VES THEME SETTINGS > Theme Settings

We created 6 skins in Ves Global Magento 1 theme: Default (green), blue, black, red, pink and yellow, you can view it in folder:

..\skin\frontend\ves_global\default\scss\skins

Config Cart Page

Config in admin panel > Venustheme > Settings > VES Theme settings  > Cart page:

+ Config number product for cross-selling on cart page:

Front-end showing

Note: config show / hidden element (name, price, review…) as related, upsell

 

Counting Number

Showing counting number as this:

We config the widget as this:

magento 2 pages builder | counting number widget

Theme Design

In this tab, you are able to:

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

– Select fomat and config icon class

– Add custom google font for body, product

 

To config them please go to Admin Panel > VES THEME SETTINGS > Theme Design

To config them for orther store please change “Current Configuration Scope” and reconfig values

Ves Blackstore Magento 2.x

Load Custom Extension Block

If you want to load any extension’s block without use layout xml, we can use the widget to make that.

For example: we want to load block type “Magento\Newsletter\Block\Subscribe”  – it will been call to block class file “vendor/magento/module-newsletter/Block/Subscribe.php

Please follow as this:

ves pagebuilder | load custom block widget guide

 

Widget options:

Addition Class: Custom Block css class, use for custom style for block

Block Type: Input the block type (it will call to module block class), same way of layout xml are calling.

On layout xml, the block are calling as this:

<block class=”Magento\Newsletter\Block\Subscribe” name=”form.subscribe” as=”subscribe” before=”-” template=”Magento_Newsletter::subscribe.phtml”/>

Block Name: input the name for the block as you want.

Block Parameters: You can input there param will use on the block. example:

template=’Magento_Newsletter::subscribe.phtml’

Theme Layout

Fontend:

In this tab, you are able to:

– Set Maximum Page Width or Custom Maximum Page Width: to config width page content

– Config Fluid Width

 

To config them please go to Admin Panel > VES THEME SETTINGS > Theme Layout

Static Blocks Diagram

This is all CMS static blocks we are using on the ezBoozt.
To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

How to use a CMS static block

Ex: Blog Block

Ex: Product Block

Below is some sample content.

Megamenu

Bicomart includes the fantastic Megamenu in an additional module called Ves MegaMenu. The Megamenu module comes with a custom admin interface through which you can create powerful Menu. No coding is required. Follow these steps to create a module:

Front-end:

Back-end:

– Create a new Menu item:

– General Information:

– Header:

– Left Block:

– Main content:

– Right block:

– Bottom block:

– Custom design for a menu item:

Static Blocks Diagram

This is all CMS static blocks we are using on the theme Ves Global.

To Open Cms Static Blocks, Go To Admin Panel > CMS > Static Blocks

 

1. “block_footer_categories” is used in footer.


<div>{{widget type="ves_base/widget_links" ul_cls="list-inline" enable_collapse="false" text_link_1="About us" link_1="#" text_link_2="Customer service" link_2="#" text_link_3="Site map" link_3="#" text_link_4="Search terms" link_4="#" text_link_5="Advanced search" link_5="#" text_link_6="Orders & Returns" link_6="#" text_link_7="Contact us" link_7="#"}}</div>

Detail config:

 

2. “block-custom-header” (current status: disable) you can enable to show in header


<em class="fa fa-phone"> </em>
<p>+123-456-7890</p>

Deal Product

Config Footer

Venustheme allows you to config various footer sections: Footer top, Footer center, Footer Bottom

app\design\frontend\Venustheme\ves_flipcart\Ves_Themesettings\layout\default.xml

 

<!-- Footer Container -->
        <referenceContainer name="footer-container">
            <container name="footer" as="footer" label="Page Footer" htmlTag="div" htmlClass="ves-footer">
                <container name="footer-top" label="Footer Top" htmlTag="div" htmlClass="footer-top">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.top" template="Ves_Themesettings::html/footer/footer-top.phtml"/>
                </container>
                <container name="footer-center" label="Footer Center" htmlTag="div" htmlClass="footer-center" after="footer-top">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.center" template="Ves_Themesettings::html/footer/footer-center.phtml"/>
                </container>
                <container name="footer-bottom" label="Footer Bottom" htmlTag="div" htmlClass="footer-bottom" after="footer-center">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.bottom" template="Ves_Themesettings::html/footer/footer-bottom.phtml"/>
                </container>
                <remove name="form.subscribe"/>
                <block class="Magento\Framework\View\Element\Template" name="report.bugs" template="Magento_Theme::html/bugreport.phtml" />
            </container>
        </referenceContainer>
        <!-- End Footer Container -->

 

You can configure the options related to the footer section in Ves Themesettings > Footer

– General Settings:

+ You can custom style if use value Yes, change text color and link color on footer

+ You can style background color or set background image, patent for footer by option “Outer Container”

+ You can enable or disable text copy right, and you can custom text copy-right at option “Copyright”

 

– Footer Top setting:

+ You can enable or disable position

+ You can choose static block or custom html redirect on text editor

+ You can custom style if use value Yes: Text color, Link color, Link hover color

+ You can style “Outer Container”, ” Inner Content” – Main content at here

 

– For Footer Center Setting, Footer Bottom setting, you can config it like Footer Top setting. But in case the theme do NOT have, please set ” Enable Footer Center” or ” Enable Footer Bottom” to :NO

 

Getting Started

Ves Fresh comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Ves Fresh is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Ves Fresh is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Venustheme – Developer Guide For Magento 2

Compatibility:

Venus theme is fully compatible with Magento Community Edition 2.0.0, 2.0.2, 2.0.4, 2.0.6, 2.0.7, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/fresh/landing

Purchase It Now

Facebook Widget

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:

etc/view.xml:-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme:- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml:- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in thedefault.xml file. This file is also used to override default theme’s settings.media/preview.png:- The preview of the current theme.web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php :- This file is required to register our theme to Magento2 system.theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install/update for the user to ensure the theme installs correctly. Creating theme files, Let us now create our files one by one. Creating theme files, Let us now create our files one by one.theme.xml ( app/design/frontend/Venustheme/frido_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Venustheme Frido</title>
	<parent>Venustheme/frido</parent>
    <media>
        <preview_image>media/preview.jpg</preview_image>
    </media>
</theme>

registration.php ( app/design/frontend/Venustheme/ezboozt_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/frido_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/frido_child/composer.json )

{
 "name": "magento/theme-frontend-frido_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-frido": "100.2.*",
 "magento/framework": "101.0.*"
 },
 "type": "magento2-theme",
 "version": "100.2.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose the Frido child


* Important: After you choose a new theme or new theme child, you need reindex data and run the command below via SSH:

php bin/magento setup:static-content:deploy

Facebook Comment

Overview

Welcome to Venustheme!
We would like to thank you for purchasing Extensions ofVenustheme!

Compatibility
Ves Gallery is fully compatible with Magento Community Edition 1.8.x, 1.9.x

  • Manage gallery image
  • Display gallery images on bootstrap layout, Masonry, Owl Carousel block
  • Allow share image to social
  • Show gallery image on product page.
  • Easy-to-use & intuitive interface

Ves Megamenu

Ves megamenu provides powerful and most advanced menu, we’re going to describe detailed instructions how to use this powerful menu features.

Front-end:

For general menu settings, please go to Admin Panel > VenusTheme > Ves Megamenu > Manage Menu Items

List Widgets which used in memu’s dropdown:

 

Config items menu:

Menu item “Home”

  1. Enter Name for item menu
  2. Select Type: URL and enter URL: {{store url=”}}

Then, press “Live Mega Menu Editor” button to config elements in dropdown

  1. Create submenu: Yes
  2. Width of submenu: enter your width
  3. Alignment: select your layout
  4. You can add row, column and set number “Column Width” for that
  5. Select the widget end insert it

 

Menu item “New Arrivals”

  1. Enter Name for item menu
  2. Select Type: Category and select your category

And config element in dropdown menu like item Home.

 

Menu item “Deals”

  1. Enter Name for item menu
  2. Select Type: URL and insert your url

NOTE: url: “deals” is identifier rule in Ves Product List.

Addition, you can inport megamenu from list categories in Catalog/Manage Categories.

Feed Reader

Installation

The module we provide 2 ways of  Ves Gallery installation which was supported by magento 1.8.x, 1.9.x

1. INSTALLATION FROM FTP (RECOMMENDED)

Your magento 2 extension can be installed in a few minutes by going through these following steps:

  • Download/purchase the extension
  • Unzip the file in a temporary directory
  • Upload it to your Magento installation root directory
  • Flush the cache under System->Cache Management
  • Re-config Role Resources for admin user: Go to admin > System > Permissions > Roles >  Edit administrator roles > choose role resources = “Custom” then choose back “All” and save the role. See the screenshot:
  • Now you can see the menu in backend “Venustheme > Ves Gallery”

2. MAGENTO CONNECT INSTALLATION

  • Download/purchase the extension
  • Go to admin > System > Magento Connect > Magento Connect Manager > Then upload file module .tgz in section “Direct package file upload“, then setup the module.
  • Flush the cache under System->Cache Management

Congrats! You finished install the extension, now you can go forward!

Ves Verticalmenu

Fontend:

Config title

Go to admin panel > VenusTheme > Ves Verticalmenu > Configuration.

You can add class icon awesome with in here.

Config icon

you can add class icon awesome or insert image for each item menu.

Other Config

Other Config like module ves megamenu.

Manual Installation

In this tutorial, we will show you how to install theme step by step. We will take Ves Oshop ( one of our themes) as an example. For other themes, you can do the same way.

Step1: Decompress the theme package (ex: ves_oshop_full.zip) into your PC.
Then upload and decompress the file “Theme Files/magento 2.2.x/theme_files.zip” into webroot folder (which you setup magento 2 before):

theme_file_decompress-1

Step2: Upload the file [theme_name]_media.zip (ex: bicomart_media.zip) in to webroot and decompress it. The file stored sample images of the theme.

Step3: Go to your site ( It will require you run command code to setup upgrade )

Step4: You should run there command codes in terminal (SSH)

php bin/magento setup:upgrade --keep-generated

php bin/magento setup:static-content:deploy

Step5: Go to admin > Ves Setup > Import > Choose profile “Ves_Oshop_FULL.json” then click on install configuration button

Step6: Choose default theme

Magento 2.0.x:

>> Go to admin > Stores > Configuration > General > Design > Choose design theme “Venustheme – Bicomart”

Magento 2.1.x and 2.2.x:

>> Go to admin > Content > > Configuration > General > Design > Choose design theme “Venustheme – Bicomart”

Step7: Config default homepage layout

>> Go to admin > Content > Configuration > General > Web > Default Pages > Choose default cms homepage

Homepage Configuration

Ves Fresh have 3 different homepages built by Ves Page Builder module.

I. Fresh Home Page Default:

link demo

II. Fresh Home Page 2:

link demo

III. Fresh Home Page 3:

link demo

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

To configure the home page for other store, please select your Store View and select the desired page in the CMS Home Page field

Go to back-end > Ves Pagebuilder > Manager page profile > Edit profile name “Fresh_layout1_home”

In the back-end, we used the widget, namely “Ves Image Slider” on page builder profile. To change image slider, please Go to back-end > Ves Pagebuilder > Manager page profile > Choose to edit desired homepage > Edit “Ves Image Slider” widget.

  1. Fresh_layout1_home_imageslider_1
  2. Fresh_layout1_home_imageslider_2
  3. Fresh_layout1_home_imageslider_3

Note: Ves Fresh Image Slider are using CMS static block. Hence, if you want to change image slider, please go to Admin Panel > Content > Blocks > Choose Desired CMS Static Block you want to edit.

+ In the back-end, we used the widget, namely “Single Image” on page builder profile

+ You can edit widget and change image in this popup by choosing “Edit” Button

in Shortcode you can see:

{{widget type="Ves\BaseWidget\Block\Widget\Image" file="wysiwyg/ves_fresh/store1/home-banner/2.jpg" image_size="770x370" alignment="right" popup_type="colorbox" link="#"}}

Config image banner with row-success (the banner will overwrite the content above)

config:

select Row style: Success

Config image banner with description

config in admin:

– add class no-effect if you don’t want to show the effect when hover the image.

– Enable Image Description: Yes and add description into textarea Image Description

Config in admin:

Add the class: widget-images to has style hover as image banner widget

Carousel Setting:

Call block image:

Note: Ves Fresh Content Carousel are using CMS static block. Hence, to change image, please go to Admin Panel > Content > Blocks > Choose Desired CMS Static Block you want to edit.

+ How To Config In The Backend

>> In the back-end, we used the widget, namely “Product list: Tabs by categories”. To config product carousel, please open the widget “Product list: Tabs by categories” and edit it

>> Select your categories and config load ajax for them. config After tab title is clicked for the categories without first item (position smallest)

>> you can re-select source for widget.

>> In this widget,  we use default template in the following path file: app\design\frontend\Venustheme\fresh\Ves_Productlist\templates\widget\owlcarousel\items.phtml

+ Config Item Settings to Show/Hidden the elements:

+  Config Carousel Settings: select Type and count Number Item in the widget.

+  You can config the number of row, and product items on each device responsively:

+ Config to show/hidden navigation:

How To Config in the back-end :

>> Select Column Style: Success

In this widget, you can config it like “3.Product carousel” element but it has different options here:

–  Select your categories and change source: deals, most popular….

 

– Change config for Item Settings:

 

– Change config number product item on each device responsively:

>> Select Column Style: highlighted

In page builder, you can choose widget: “Ves Blog: Latest Posts” and click “edit”

Config:

Set the number post items on each device responsively and config show/hidden navigation:

Post Settings: config to show/hidden elements in this widget.

In page builder, you can choose widget: “Our Service” and click “edit” button

you can change the title, image/icon Awesome, content for this widget.

In page builder, you can choose “setting” button to make space for each row

In the “Row Setting” >> Open “Layout” Tab >> Add css margin or padding like below image

Header Configuration

Ves Fresh provides 3 header styles, you can choose one of them here.

Backend config:

To Config Header Default, Go to Admin Panel >> VES THEMESETTINGS >> Header >> General Settings >> Choose ” Default” Header Layout

Code html at this path file

app\design\frontend\Venustheme\fresh\Ves_Themesettings\templates\header\default.phtml

The block static: Fresh_header_contact was called in Fresh’s header. Hence, to change content it, you go to Content >> Elements >> Blocks >> Fresh_header_contact

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default1: default1.phtml (header 1)
  3. Default2: default2.phtml (header 2)

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Backend Configuration

Go to admin > venustheme > Ves Gallery > Configuration

1, General Settings

a, Config Enable/Disable:

  • Enabled: Enable/disable all module blocks on frontend
  • Enabled Gallery Block: Enable/disable the gallery module block on frontend
  • Max file size: Input number of max file size when upload image for gallery item
  • Allow File Types: allow upload image files type (Default: jpg,jpeg,gif,png)
  • Upload Folder: input upload folder path (the folder will in the media/ folder). Default: gallery/upload/

b, Config module block:

the module gallery block will show on the position of the site by config in the layout xml file (“/app/design/frontend/base/default/layout/ves_gallery.xml”) with the code as this:

<reference name=”content”>

     <block type=”core/text_list” name=”gallery” as=”gallery” translate=”label”>

              <block type=”ves_gallery/file” name=”ves.gallery” before=”-” />

      </block>

</reference>

To config the module block we will config there options:

 

  • Module Title: input the title of the block
  • Select Template: The color skin for the gallery
  • Module Width/Height: Input module width and height
  • Render Thumbnail: Allow render thumbnail or not
  • Thumbnail Height/Width: Enable render thumbnail you should input the value (default: 100 – 100 px)
  • Limit: Number of images will show on gallery block
  • Max item on a page: is option to show number of items on a grid page or a carousel page.
  • From Source: will get images from image database or in media folder.
  • Image Folder Path: you should input the media folder in the setting if you choose “From Source” = “Image In Folder”
  • Images group: choose group if you choose “From Source” = “Gallery Banner Group”
  • Config for owl carousel: enable if you want to show the gallery images as a carousel, config as default or find more guide at here: https://owlcarousel2.github.io/OwlCarousel2/docs/started-welcome.html

Footer Profiles

The frontend show:

How To Config footer profiles in backend

Go to back-end > Ves Themesetting > Footer > enter your block


To edit content footer you go to back-end > VES PAGEBUILDER > Block Builder > Manage Block Profile “Fresh_Layout1_FooterTop

Getting Started

Mohawk comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Mohawk is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Mohawk is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Mohawk is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/mohawk/landing

Purchase It Now

Config Generals

In this tab, you are able to:

– Choose maximum page width on dropdown or change value input

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Config body background, padding

– Add custom google font for body

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

 

Please Go to Admin Panel > Ves ThemeSettings > General

Ves Fresh provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

We created 6 skins in Ves Fresh theme: Default (gold), blue, green, orange, pink and violet you can view it in folder:

..\Venustheme\fresh\Ves_Themesettings\web\css\skins\

Flickr

Getting Started

Ves Melody comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Ves Melody is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Ves Melody is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Venustheme – Developer Guide For Magento 2

Compatibility:

Venus theme is fully compatible with Magento Community Edition 2.0.0, 2.0.2, 2.0.4, 2.0.6, 2.0.7, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/melody/landing

Purchase It Now

Config Header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add custom top link.

 

On front-end, it is shown like below image:

 

3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of search box
– Change format button search

How it is shown on front-end:

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\fresh\Magento_Theme\templates\html\setting2.phtml

How it is show on front-end:

    
    <?php
        $id = $block->getIdModifier() ? '-' . $block->getIdModifier() : '';
        $currency_custom = $this->getChildHtml('currency_custom2');
        $store_language = $this->getChildHtml('store_language_custom2');
    ?>
    <?php if($currency_custom || $store_language): ?>
        <div class="setting-links">
            <div class="actions options setting-links-options">
            <?php if($store_language): ?>
                <div class="switcher-language-wrapper">
                    <?php echo $store_language ?>
                </div>
            <?php endif; ?>
            <?php if($currency_custom): ?>
                <div class="switcher-currency-wrapper">
                    <?php echo $currency_custom ?>
                </div>
            <?php endif; ?>
            </div>
        </div>
    <?php endif; ?>

 

5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

frontend show:

Config Footer

Venustheme allows you to config various footer sections: Footer top, Footer center, Footer Bottom

app\design\frontend\Venustheme\fresh\Ves_Themesettings\layout\default.xml

 

<!-- Footer Container -->
    <referenceContainer name="footer-container">
        <container name="footer" as="footer" label="Page Footer" htmlTag="div" htmlClass="ves-footer">
            <container name="footer-top" label="Footer Top" htmlTag="div" htmlClass="footer-top">
                <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.top" template="Ves_Themesettings::html/footer/footer-top.phtml"/>
            </container>
            <container name="footer-center" label="Footer Center" htmlTag="div" htmlClass="footer-center" after="footer-top">
                <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.center" template="Ves_Themesettings::html/footer/footer-center.phtml"/>
            </container>
            <container name="footer-bottom" label="Footer Bottom" htmlTag="div" htmlClass="footer-bottom" after="footer-center">
                <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.bottom" template="Ves_Themesettings::html/footer/footer-bottom.phtml"/>
            </container>
            <remove name="form.subscribe"/>
            <block class="Magento\Framework\View\Element\Template" name="report.bugs" template="Magento_Theme::html/bugreport.phtml" />
        </container>
    </referenceContainer>
<!-- End Footer Container -->

 

You can configure the options related to the footer section in Ves Themesettings > Footer

– General Settings:

+ You can custom style if use value Yes, change text color and link color on footer

+ You can style background color or set background image, patent for footer by option “Outer Container”

+ You can enable or disable text copy right, and you can custom text copy-right at option “Copyright”

 

– Footer Top setting:

+ You can enable or disable position

+ You can choose static block or custom html redirect on text editor

+ You can custom style if use value Yes: Text color, Link color, Link hover color

+ You can style “Outer Container”, ” Inner Content” – Main content at here

 

– For Footer Center Setting, Footer Bottom setting, you can config it like Footer Top setting. But in case the theme do NOT have, please set ” Enable Footer Center” or ” Enable Footer Bottom” to :NO

 

Google Plus Button

Config Category Page

Venus theme provides several types of category layout. You can choose one as your choice.

+ Go to the Admin Panel > Products > Inventory > Categories.

+ Select “Default Category” in the treeview area at the left side.

+ Click “Add Subcategory” button, then input Category name, Description, etc. Notes: set the options “Is Active” to “Yes”, “Include in Navigation Menu” to “Yes” in “General Information” tab.

+ If you want to display banner image, please set image in “Content” tab: upload image

 

+ In “Display Settings” tab, default Display Mode: “Product Only” but in order to display banner with static block, please set “Display Mode” to “Static block and products” and CMS Block

 

+ You can change layout category on Design tab:

 

+ Change number column product in each layout design:

you insert code in Layout Update XML

	<referenceBlock name="category.products.list">
        <action method="setTemplate">
            <argument name="template" xsi:type="string">Magento_Catalog::product/list-col2.phtml</argument>
        </action>
	</referenceBlock>
	

+ Click “Save Category” button, to update your changes.

Go to Admin Panel > Ves Themesetting > Category page:

1. General tab:

– Show name, description, image of category

– Show Top toolbar and Bottom Toolbar

2. Product settings tab:

– Show element for each product item:

+ Config to select element of each product: name, description, price, review, lable sale or new, ect

+ Config format button add to cart, quickview, add to wishlist, add to compare

+ Config product image: image size, swap image

Google Map

Config Product View Page

– Other elements:

+ Config enable / disable elements by change value Yes / No

+ Specify you can change position of thumnail slider: horizonal or vetical, Top or bottom

– Config show tab

– Custom tab

+ Tab By Product Attribute Code

+ Tab By CMS Block

+ Tab By Static Html Content

– Config Related Products, Upsel product: number items and item show on responsive

– Frontend show:

Config Contact Page

Link page: demo4coder.com/fresh/contact

How To config: Go To Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\Venustheme\fresh\Magento_Contact\templates\form.phtml

 

 

 

Google Plus

Manage gallery images

To manage gallery images you should go to admin > Venustheme > Ves Gallery > Manage Files.

Add new/edit/delete image files for gallery at here.

Add new gallery image as this:

 

Then save the image item to save it on database. The module will show the image items on gallery block and gallery widgets on frontend.

 

The module support multi upload images.

Please go to “admin > Venustheme > Ves Gallery > Add Multi Files then follow as screenshot:

Config Cart Page

Config in admin panel > Ves Themesetting > Cart page:

 

+ Config number product for cross-sell on cart page:

Note: config show / hidden element (name, price, review…) as related, upsell

 

Static Blocks Diagram

This is all CMS static blocks we are using on the theme Ves Fresh.

To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

 

1. “Fresh_layout1_home_imageslider_1”, “Fresh_layout1_home_imageslider_2”, “Fresh_layout1_home_imageslider_3” are used in widget “Ves Image slider” on pagebuilder “Fresh_layout1_home”


	<a href="#"><img src="{{media url="wysiwyg/ves_fresh/store1/slidershow/1.jpg"}}" alt="" /></a>
	<div class="slidershow-info">
		<h3>Fresh Food</h3>
		<p>Delivery</p>
	</div>

Showing in front-end (the slidershow in demo 1):

 

2. “Fresh_layout2_home_imageslider_1”, “Fresh_layout2_home_imageslider_2” are used in widget “Ves Image slider” on pagebuilder “Fresh_layout2_home”


	<a href="#"><img src="{{media url="wysiwyg/ves_fresh/store2/slidershow/1.jpg"}}" alt="" /></a>
	<div class="slidershow-info">
		<h2>Fresh<br> Fruit</h2>
	</div>

Showing in front-end (the slidershow in demo 2):

 

3. “Fresh_layout3_home_imageslider_1”, “Fresh_layout3_home_imageslider_2”, “Fresh_layout3_home_imageslider_3” are used in widget “Ves Image slider” on pagebuilder “Fresh_layout3_home”

 

4. “Fresh_header_contact” show in all header


	<div> <i class="fa fa-phone">   </i> (+01) <span class="call-number"> 234 000 5678 </span> </div>
	<div> <i class="fa fa-envelope-o">   </i> email@domain.com </div>

 

5. “Fresh_layout1_home_carousel_image_1”, “Fresh_layout1_home_carousel_image_2”, “Fresh_layout1_home_carousel_image_3” are used in widget “Content Carousel” on pagebuilder “Fresh_layout1_home”

 


	<a href="#"><img src="{{media url="wysiwyg/ves_fresh/store1/home-banner/4.jpg"}}" alt="" /></a>

 

Heading Text

Getting Started

Ves Body Fitness comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Body Fitness is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Body Fitness is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Arden is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x, 2.2.0

Demo Link: http://server1.demo4coder.com/body_fitness/landing

Purchase It Now

Ves Blog

1. How To Change URL link:

Go to Admin Panel > Ves Blog > Settings > Configuration > General Settings

Config Social Buttons:

Config RSS Feed: enable/disable it in the pages

 

2. Config show/hidden elements in post page (detail post)

Show on frontend:

In the case, the post page will show elements: Breadcrumbs, image, title, description, comment count, create time, socials and hits.

>> Config comment in detail post

>> Config related posts block in detail post

 

3. Config show/hidden elements in Category page

Show on frontend

 

4. How To Change page layout for each blog category

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category

On Design tab : you can choose page layout for category

 

5. How To Custom Category Blog Page: Show grid, list or Masonry View Mode

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category > Design tab:

 

You can config to show blog item on responsive at here

List view mode: htpp://demo4coder.com/fresh/blog/customer-stories.html

Grid view mode: http://demo4coder.com/fresh/blog/best-practice.html

 

Html Content

Ves Megamenu

Ves megamenu provides powerful and most advanced menu, we’re going to describe detailed instructions how to use this powerful menu features as our demo site.

For general menu settings, please go to Admin Panel > Ves Megamenu > Menu Management like below image and then follow the below instructions. It shows you how to config:

 

1. Horizontal menu:

Note:
– You can review “Structure Preview” to easy config the module.
– You must press “Update” button after each amendment.

 

Menu item “HOME”

How to config menu item, namely “Home” on back-end :

  1. Enter Name for item menu
  2. Add class “full-width” to fullwidth or Setting width dropdown
  3. Add image in pub/media/wysiwyg/ves_fresh/all/megamenu/icons/ or add class Awesome
  4. Setting Main Content Type: Child menu item
  5. Setting Child Menu Column: 3 columns

 

Menu item “PRODUCTS”

 

How to config menu item, namely “Products” on back-end

– Add Header block width html content:

<div class="pull-left">
 <ul class="links">
  <li>Recommended:</li>
  <li><a href="#">Configurable</a></li>
  <li><a href="#">Galaxy S3</a></li>
  <li><a href="#">Galaxy S4</a></li>
  <li><a href="#">iPhone 5</a></li>
 </ul>
</div>
<div class="pull-right">
 <ul class="links">
  <li><a href="#">Galaxy S4</a></li>
  <li><a href="#">iPhone 5</a></li>
 </ul>
</div>

 

– Add left block width: 25% and content:

<img src="{{media url="wysiwyg/ves_fresh/all/megamenu/5.jpg"}}" alt="" width="370" height="320" />
<h4 class="block-title">Featured Category</h4>
<p>This is a custom block ready to display any content. You can add blocks to any category in the catalog...</p>
<br>
<a href="#">View Category <em class="fa fa-angle-double-right"> </em></a>

 

– Add Main content width : 50%

Setting Main Content Type: Child menu item

Setting Child Menu Column: 3 columns

 

– Add Right Block width 25% and widget to content:

<div>{{widget type="Ves\Megamenu\Block\Widget\Products" widget_title="Latest Products" product_source="latest" categories="20" number_item="2" column="1" enable_owlcarousel="1" number_item_percolumn="1" autoplay="1" autoplay_timeout="3000" autoplay_hoverpause="1" nav="1" loop="1" show_name="1" show_price="1" show_review="1" show_image="1" image_width="270" image_height="290"}}</div>

 

– Add Bottom block width html content:

<div class="pull-left">
 <ul class="links">
  <li>Recommended:</li>
  <li><a href="#">Configurable</a></li>
  <li><a href="#">Galaxy S3</a></li>
  <li><a href="#">Galaxy S4</a></li>
  <li><a href="#">iPhone 5</a></li>
 </ul>
</div>
<div class="pull-right">
 <ul class="links">
  <li><a href="#">Galaxy S4</a></li>
  <li><a href="#">iPhone 5</a></li>
 </ul>
</div>

 

Menu Item “Vegetables”

How to config menu item, namely “Vegetables” on back-end

– Add submenu

– On each submenu of “Vegetables”, Main Content dropdown, add width Ves-Megamenu:Product

<div>{{widget type="Ves\Megamenu\Block\Widget\Products" product_source="latest" categories="11" number_item="3" column="3" number_item_percolumn="1" show_name="1" show_price="1" show_review="1" show_image="1" image_width="270" image_height="290"}}</div>

You can change “categories” for each submenu item. ex: categories=”11″ (category width ID=11)

 
 

2. Vertical menu (in demo 3):

 

Icon for each menu item is configured:

– You can setting show icon change value “yes”

– Upload icon image

– Choose position for icon show

How to config Vertical Menu on back-end

 

 

How To Create Simple Menu & Change Top Menu – Magento 2 Mega Menu Tutorials

How To Create 6 Menu Types – Drag & Drop Magento 2 Mega Menu Tutorials

How To Style Your Menu without editing css file – Magento 2 Mega Menu Tutorials

 

Getting Started

Ves Crafk comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Ves Crafk is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Ves Crafk is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Compatibility:

Venus theme is fully compatible with Magento Community Edition 2.0.0, 2.0.2, 2.0.4, 2.0.6, 2.0.7, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/crafk/landing

Purchase It Now

Instagram

Homepage Configuration

Ves Crafk have 5 different homepages built by Ves Page Builder module.

I. Crafk Home Page Default:

link demo

II. Crafk Home Page 2:

link demo 2

III. Crafk Home Page 3:

link demo 3

IV. Crafk Home Page 4:

link demo 4

V. Crafk Home Page 5:

link demo 5

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

Go to back-end > Ves Pagebuilder > Manager page profile > Edit profile name “Crafk Home Page Default”

In the back-end, we used the widget, namely “Ves Image Slider” on page builder profile. To change image slider, please Go to back-end > Ves Pagebuilder > Manager page profile > Choose to edit desired homepage > Edit ““Ves Image Slider” widget.

  1. Crafk Default Slider 1
  2. Crafk Default Slider 2
  3. Crafk Default Slider 3
  4. Crafk Default Slider 4
  5. Crafk Default Slider 5

Note: Ves Crafk Image Slider are using CMS static block. Hence, if you want to change image slider, please go to Admin Panel > Content > Blocks > Choose Desired CMS Static Block you want to edit.

+ In the back-end, we used the widget, namely “Single Image” on page builder profile

+ You can edit widget and change image in this popup by choosing “Edit” Button

{{widget type="Ves\BaseWidget\Block\Widget\Image" addition_cls="cat-info" file="wysiwyg/ves_crafk/home1/categories/img_cat1.jpg" image_size="570x404" alignment="center" html="PGRpdiBjbGFzcz0idi1jZW50ZXIgYS1jZW50ZXIgYmxhY2siID4KPGgyPjxhIGhyZWY9IiMiPm1pbmltYWxpc3Qgd29vZDwvYT48L2gyPgo8cD4xOCBpdGVtczwvcD4KPC9kaXY+Cg==" popup_type="colorbox"}}

How To Config in the back-end :

Go to admin > Ves Pagebuilder > Manager Page profile > Edit “Crafk Home Page Default″ > Design Tab > Edit widget “Product list: Tabs by rules”

In this widget, you can config it like “Product carousel” element but it has different options here:


How To Config in the back-end :
In this widget, you can config it:

How To Config in the back-end :

In this widget, you can config it:

How To Config in the back-end :

In this widget, you can config it:

Config Contact Page

Link page: demo4coder.com/m2themes/contact

How To config: Go To Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\M2themes\evolution\Magento_Contact\templates\form.phtml

 

 

 

General Questions

Links

Header Configuration

Ves Crafk provides 5 header styles, you can choose one of them here.

Backend config:

To Config Header Default, Go to Admin Panel >> VES THEMESETTINGS >> Header >> General Settings >> Choose ” Default” Header Layout

Code html at this path file

app\design\frontend\Venustheme\crafk\Ves_Themesettings\templates\header\default.phtml

Backend config:

To Config Header 1, Go to Admin Panel >> VES THEMESETTING >> Header >> General Settings >> Choose ” Default 2″ Header Layout

Code html at this path file

app\design\frontend\Venustheme\crafk\Ves_Themesettings\templates\header\default2.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Gallery Images

Footer profile

The frontend show:

How To Config footer profiles in backend

Design in: Ves Pagebuilder > Manage Block Profile > edit item block builder :”Ves Crafk Footer”

Go to back-end Ves Themesetting Footer Choose CMS static block : “Crafk Block Footer Top

Newsletter Widget

Config Generals

In this tab, you are able to:

  • Choose maximum page width on dropdown or change value input
  • Choose skin color store view
  • Choose director support LTR or RTL Languages
  • Enable or disable panel tool
  • Config body background, padding
  • Add custom google font for body
  • Config color text body, text link, text link hover
  • Config button color, background and hover, focus

Please Go to Admin Panel > Ves ThemeSettings > General

Ves Crafk provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

Our Service

Header Configuration

Bishop provides 1 header styles, you can choose here.

#Header1:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)

Code HTML at this path file

app\design\frontend\Venustheme\blackstore\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Config Header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

On front-end, it is shown like below image:

 

 

3. Search tab:

– Enable: Yes or No

– Custom style

– Add maximum width of search box

– Change format button search

How it is shown on front-end:

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\crafk\Magento_Theme\templates\html\setting.phtml

How it is show on front-end:

<div class="setting-links" id="setting-links<?php echo $id?>">
    <div class="actions dropdown options setting-links-options">
        <div class="action toggle switcher-trigger" id="setting-links-trigger<?php echo $id?>">
            <i class="fa fa-cog">&nbsp;</i> <?php echo __('Setting') ?>
        </div>

        <ul class="dropdown setting-links-dropdown" data-mage-init='{"dropdownDialog":{
        "appendTo":"#setting-links<?php echo $id?> > .options",
        "triggerTarget":"#setting-links-trigger<?php echo $id?>",
        "closeOnMouseLeave": false,
        "triggerClass":"active",
        "parentClass":"active",
        "buttons":null}}'>
            <?php if($currency_custom): ?>
            <li class="switcher-currency-wrapper">
                <?php echo $this->getChildHtml('currency_custom') ?>
            </li>
            <?php endif; ?>
            <?php if($store_language_custom): ?>
            <li class="switcher-language-wrapper">
                <?php echo $this->getChildHtml('store_language_custom') ?>
            </li>
            <?php endif; ?>
        </ul>
        
    </div>
</div>

 

 5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

 6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

frontend show:

Config Category page

Go to Admin Panel > Ves Themesetting > Category page:
1. General tab:
– Show name, description, image of category
– Show Top toolbar and Bottom Toolbar

2. Product settings tab:

– Show element for each product item:
+ Config to select element of each product: name, description, price, review, lable sale or new, ect
+ Config format button add to cart, quickview, add to wishlist, add to compare
+ Config product image: image size, swap image
3. Product Image Setting

Pinterest

Footer Profiles

Footer manager:

Admin -> VenusTheme -> Ves Pagebuilder -> Manage Elements:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Bishop Footer”:


How To Choose footer profiles

Go to back-end > Ves Themesetting > Footer > enter your block

Pinterest – Profile Widget

Popup

Config Footer

Venustheme allows you to config various footer sections: Footer top, Footer center, Footer Bottom

app\design\frontend\Venustheme\crafk\Ves_Themesettings\layout\default.xml

 

<!-- Footer Container -->
        <referenceContainer name="footer-container">
            <container name="footer" as="footer" label="Page Footer" htmlTag="div" htmlClass="ves-footer">
                <container name="footer-top" label="Footer Top" htmlTag="div" htmlClass="footer-top">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.top" template="Ves_Themesettings::html/footer/footer-top.phtml"/>
                </container>
                <container name="footer-center" label="Footer Center" htmlTag="div" htmlClass="footer-center" after="footer-top">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.center" template="Ves_Themesettings::html/footer/footer-center.phtml"/>
                </container>
                <container name="footer-bottom" label="Footer Bottom" htmlTag="div" htmlClass="footer-bottom" after="footer-center">
                    <block class="Ves\Themesettings\Block\Html\Footer" name="ves.footer.bottom" template="Ves_Themesettings::html/footer/footer-bottom.phtml"/>
                </container>
                <remove name="form.subscribe"/>
                <block class="Magento\Framework\View\Element\Template" name="report.bugs" template="Magento_Theme::html/bugreport.phtml" />
            </container>
        </referenceContainer>
        <!-- End Footer Container -->

 

You can configure the options related to the footer section in Ves Themesettings > Footer

– General Settings:

+ You can custom style if use value Yes, change text color and link color on footer

+ You can style background color or set background image, patent for footer by option “Outer Container”

+ You can enable or disable text copy right, and you can custom text copy-right at option “Copyright”

 

– Footer Top setting:

+ You can enable or disable position

+ You can choose static block or custom html redirect on text editor

+ You can custom style if use value Yes: Text color, Link color, Link hover color

+ You can style “Outer Container”, ” Inner Content” – Main content at here

 

– For Footer Center Setting, Footer Bottom setting, you can config it like Footer Top setting. But in case the theme do NOT have, please set ” Enable Footer Center” or ” Enable Footer Bottom” to :NO

 

How to add gallery widget?

The module support widget to insert on CMS Page’s content, CMS Block’s content or widget instance.

Then config the widget and save it. On frontend will generate widget shortcode to view the gallery as you want.

 

Ves Blog

1. How To Change URL link:

Go to Admin Panel > Ves Blog > Configuration

 

 

2. How To Change page layout for each blog category

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category

On Design tab : you can choose page layout for category

 

3. How To Custom Category Blog Page: Show grid, list or Masonry View Mode

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category > Design tab:

 

You can config to show blog item on responsive at here

Config Category Page

Venus theme provides several types of category layout. You can choose one as your choice.
+ Go to the Admin Panel > Products > Inventory > Categories.
+ Select “Default Category” in the treeview area at the left side.
+ Click “Add Subcategory” button, then input Category name, Description, etc. Notes: set the options “Is Active” to “Yes”, “Include in Navigation Menu” to “Yes” in “General Information” tab.
+ If you want to display banner image, please set image in “Content” tab: upload image or choose cms block
+ In order to display banner with static block, please set “Display Mode” to “Static block and products” and CMS Block in “Display Settings” tab.

 

+ You can change layout category on Design tab:

+ Click “Save Category” button, to update your changes.

Go to Admin Panel > Ves Themesetting > Category page:
1. General tab:

– Show name, description, image of category– Show Top toolbar and Bottom Toolbar

2. Product settings tab:– Show element for each product item:

+ Config to select element of each product: name, description, price, review, lable sale or new, ect

+ Config format button add to cart, quickview, add to wishlist, add to compare

+ Config product image: image size, swap image

Pricing Plan

Single Product Block

Getting Started

Arthome comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Arthome is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Arthome is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Arthome is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/arthome/landing

Purchase It Now

Config Generals

In this tab, you are able to:

– Choose maximum page width on dropdown or change value input

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Config body background, padding

– Add custom google font for body

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

 

Please Go to Admin Panel > VenusTheme > Ves ThemeSettings > General

Bishop provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

We created 15+ skins in Bishop: You can view it in folder:

..\Venustheme\bishop\Ves_Themesettings\web\css\skins\

Config Product View Page

– Name config:
– Other elements:
+ Config enable / disable elements by change value Yes / No

+ Specify you can change position of thumnail slider : horizonal or vetical, Top or bottom

– Config show tab
– Custom tab
+ Tab By Product Attribute Code
+ Tab By CMS Block
+ Tab By Static Html Content

– Config Related Products : number items and item show on responsive


– Frontend show:

Getting Started

Ezboozt – a wonderful Fashion, beauty, and furniture Magento 2 theme with a creative, inspiring and product-oriented design.
You are seeking a template which can help you start your business successfully with fashion store, beauty store or even furniture store? Ezboozt is what you need. It will attract your customers with impressive, dynamic and strong feeling at the first sight.

Including 12+ Elegant Unique Homepages, 9+ Unique footers, 9+ Skin color & powerful Admin Panel, admin can create their own wonderful website in seconds.
Ves Ezboozt is 100% Mobile friendly. Hence, it looks perfect on any devices. It is created with SEO Optimization, Conversion Rate, Ease of customization & Installation which are functionally important for any theme. Moreover, with Regular Update, Timely Support, Advanced Extensions Integration, Ves Ezboozt will bring the great experience for customers.

EzBoozt is one of our responsive Magento 2 themes. This Magento 2 theme created with new Magento 2 UI and integrate bootstrap 4.0.0 layout components. Also, it is inherited from Magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

ezBoozt is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x, 2.2.x

Demo Link: http://server1.demo4coder.com/ezboozt/landing

Purchase It Now

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml :-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme :- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml :- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in default.xml the file.This file is also used to override default theme’s settings.

media/preview.png :- The preview of the current theme.

web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.

registration.php :- This file is required to register our theme to Magento2 system.

theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.

composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install / update for the user to ensure the theme installs correctly.Creating theme filesLet us now create our files one by one.

Creating theme files

Let us now create our files one by one.

theme.xml ( app/design/frontend/Venustheme/arthome_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Arthome Child</title> <!-- your theme's name -->
   <parent>Magento/blank</parent> <!-- the parent theme -->
   <media>
        <preview_image>media/preview.jpg</preview_image> <!-- theme's preview image -->
   </media>
</theme>

registration.php ( app/design/frontend/Venustheme/arthome_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/arthome_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/arthome_child/composer.json )

{
 "name": "magento/theme-frontend-arthome_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-blank": "100.0.*",
 "magento/framework": "100.0.*"
 },
 "type": "magento2-theme",
 "version": "100.0.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose Arthome child


* Important: After you choose new theme or new theme child, you need reindex data and run command below via SSH:

php bin/magento setup:static-content:deploy

Progress Bar

Header Configuration

Ves Sportshop provides 4 header styles, you can choose one of them here.

Backend config:

To Config Header Default, Go to Admin Panel >> VenusTheme >> Ves Theme Settings >> Header >> Choose “Header” for Header Layout

Code html at this path file

app\design\frontend\ves_sportshop\default\template\common\header\header.phtml

>> How To Config Other Header for storeview

  1. header: header.phtml
  2. header-v2: header-v2.phtml
  3. header-v3: header-v3.phtml
  4. header-v4: header-v4.phtml

To change Logo, Go to Admin Panel > System > Configuration > Design > Header

After that, you select Current Configuration Scopeto then enter url image (GIF, PNG, JPG, or SVG file type)

default path: skin\frontend\ves_sportshop\default\images\

Homepage Configuration

Arthome have 8 extension with 5 homepage built by Ves Page Builder module.

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

Go to back-end > VenusTheme > Ves Page Builder > Edit profile name “Arthome Homepage Default

In the back-end, we used the widget, namely “Content Carousel” on page builder profile. To change image slider, please Go to back-end > VenusTheme > Ves Page Builder > choose “Manager Elements” > Edit block profile “Arthome Slider 1”.

  1. Arthome Slider 1
  2. Arthome Slider 2
  3. Arthome Slider 3
  4. Arthome Slider 4




ex: content for “Arthome Slider 1“:

<p><a href="{{store url="women.html"}}"><img src="{{media url="wysiwyg/ves_arthome/slider1.jpg"}}" alt="" /></a></p>
<div class="slider-content" style="left: 20%; top: 25%;">
<p><span class="caption">Hot Sale</span></p>
<h4>SOCIAL DSO4AAL 4</h4>
<h3>SEATER <span>SOFA</span></h3>
<p>Lorem Khaled Ipsum is a major key to success. told you all this</p>
<p>when you have a swimming pool...</p>
<a class="btn hidden-md" href="#">BUY NOW</a></div>

 

 

Back-end Setting:

 

Arthome Image V2:

Back-end Setting:

Arthome Image V3:

Back-end Setting:

Arthome Image V4:

Back-end Setting:

Choose “no-margin” for row setting and “no-padding” for col setting:

How To Config in the back-end :
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome HTML”.

Add class Prefix for this block:


 
Arthome HTML V2:

Back-end Setting:


 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit pagebuilder element profile “Arthome Our service”.


 




 

Config in admin in Pages Builder Elements profile “Arthome Blog”.

Add the class prefix for row setting


 
Arthome Blogs V2:

Add the class prefix for widget blog:

 
Arthome Blog + Testimonial:

Back-end Setting:

+ How To Config In The Backend

>> In the back-end, we used the Pages Builder Elements “Arthome Brand” to build it



 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Newsletter”.

 

 

Back-end Setting:

please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List”.

 

Arthome Product List V2:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List V2”.

 

Add prefix class in widget setting:

 

Arthome Product List V3:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List V3”.

 

Arthome Product List & HTML:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List & HTML”.

 

Arthome Product List & Image:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List & Image”.

 

Add prefix class in widget setting:

 

Arthome Product List & Tesimonial:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List & Tesimonial”.

 

Arthome Product List V4:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List V4”.

 

Add prefix class in widget setting:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Our Team”.

+ How To Config In The Backend

>> In the back-end, we used the Pages Builder Elements “Arthome Brand” to build it

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Arthome Product List V4”.

Getting Started

Gemme comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Gemme is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Gemme is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Gemme is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/gemme/landing

Purchase It Now

Config Contact Page

Link page: demo4coder.com/crafk/contact

How To config: Go To Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\Venustheme\crafk\Magento_Contact\templates\form.phtml

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml:-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme:- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml:- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in thedefault.xml file. This file is also used to override default theme’s settings.media/preview.png:- The preview of the current theme.web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php :- This file is required to register our theme to Magento2 system.theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install/update for the user to ensure the theme installs correctly. Creating theme files, Let us now create our files one by one. Creating theme files, Let us now create our files one by one.theme.xml ( app/design/frontend/Venustheme/ezboozt_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
    <title>Venustheme ezBoozt</title>
	<parent>Venustheme/furniture</parent>
    <media>
        <preview_image>media/preview.jpg</preview_image>
    </media>
</theme>

registration.php ( app/design/frontend/Venustheme/ezboozt_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/ezboozt_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/boost_child/composer.json )

{
 "name": "magento/theme-frontend-ezboozt_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-ezboozt": "100.2.*",
 "magento/framework": "101.0.*"
 },
 "type": "magento2-theme",
 "version": "100.2.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose the ezBoozt child


* Important: After you choose a new theme or new theme child, you need reindex data and run the command below via SSH:

php bin/magento setup:static-content:deploy

Header Configuration

Arthome provides 5 header styles, you can choose one of them here.

#Header1:

#header2:

#header3:

#header4:

#header5:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default1: default1.phtml (header 1)
  3. Default2: default2.phtml (header 2)

Code HTML at this path file

app\design\frontend\Venustheme\arthome\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Config Contact Page

Link page: demo4coder.com/bishop/contact

How To config: Go To VenusTheme > Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\Venustheme\bishop\Magento_Contact\templates\form.phtml

 

 

 

Generate a Shortcode

Footer Profiles

Footer manager:

Admin -> VenusTheme -> Ves Pagebuilder -> Manage Elements:

#Footer1:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Arthome Footer”:

#Footer2:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Arthome Footer2”:

How To Choose footer profiles

Go to back-end > Ves Themesetting > Footer > enter your block

Config Cart Page

Config Generals

In this tab, you are able to:

– Choose maximum page width on dropdown or change value input

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Config body background, padding

– Add custom google font for body

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

 

Please Go to Admin Panel > VenusTheme > Ves ThemeSettings > General

Arthome provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

We created 15+ skins in Arthome: You can view it in folder:

..\Venustheme\arthome\Ves_Themesettings\web\css\skins\

Static Blocks Diagram

This is all CMS static blocks we are using on the theme Ves Crafk.

To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

 

“Crafk Image Slider ” show in home page: http://demo4coder/crafk

We need you help

Sed ut perspiciatis unde omnis iste natus error sit accusantium rem aperiam Shop Now

Single Image

Config Product View Page

– Name config:
– Other elements:
+ Config enable / disable elements by change value Yes / No

+ Specify you can change position of thumnail slider : horizonal or vetical, Top or bottom

– Config show tab
– Custom tab
+ Tab By Product Attribute Code
+ Tab By CMS Block
+ Tab By Static Html Content– Config Related Products : number items and item show on responsive


– Frontend show:

– Config Upsel product : number items and item show on responsive

– Frontend show:

Config header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add a custom top link.

 

3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of search box
– Change format button search

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\arthome\Magento_Theme\templates\html\setting.phtml

How it is show on front-end:
5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

Ves Blog

1. How To Change URL link:

Go to Admin Panel VENUSTHEME EXTENSIONS Ves Blog General Settings

 

 

2. How To Change page layout for each blog category

Go to Admin Panel Ves Blog Categories Category Management Edit 1 category or add new category

On Design tab : you can choose page layout for category

 

3. How To Custom Category Blog Page: Show grid, list or Masonry View Mode

Go to Admin Panel Ves Blog Categories Category Management Edit 1 category or add new category Design tab:

 

You can config to show blog item on responsive at here

List view mode: htpp://demo4coder.com/crafk/blog/magento-news.html

Grid view mode: http://demo4coder.com/crafk/blog/best-practice.html

Masonry view mode:  http://demo4coder.com/crafk/blog/best-practice.html

 

Single Deal Block

Config Product View Page

– Other elements:

+ Config enable / disable elements by change value Yes / No

+ Specify you can change position of thumnail slider: horizonal or vetical, Top or bottom

– Config show tab- Custom tab

+ Tab By Product Attribute Code

+ Tab By CMS Block

+ Tab By Static Html Content

– Config Related Products: number items and item show on responsive

Back-end Setting:

Frontend result:

– Config Upsell product:

Back-end Setting:

Frontend result:

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml :-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme :- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml :- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in default.xml the file.This file is also used to override default theme’s settings.media/preview.png :- The preview of the current theme.web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php :- This file is required to register our theme to Magento2 system.theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.

composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install / update for the user to ensure the theme installs correctly.Creating theme filesLet us now create our files one by one.

Creating theme files

Let us now create our files one by one.

theme.xml ( app/design/frontend/Venustheme/gemme_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Gemme Child</title> <!-- your theme's name -->
   <parent>Magento/blank</parent> <!-- the parent theme -->
   <media>
        <preview_image>media/preview.jpg</preview_image> <!-- theme's preview image -->
   </media>
</theme>

registration.php ( app/design/frontend/Venustheme/gemme_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/gemme_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/gemme_child/composer.json )

{
 "name": "magento/theme-frontend-gemme_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-blank": "100.0.*",
 "magento/framework": "100.0.*"
 },
 "type": "magento2-theme",
 "version": "100.0.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose Gemme child


* Important: After you choose new theme or new theme child, you need reindex data and run command below via SSH:

php bin/magento setup:static-content:deploy

Ves Megamenu

Ves megamenu provides powerful and most advanced menu, we’re going to describe detailed instructions how to use this powerful menu features as our demo site.

For general menu settings, please go to Admin Panel > Ves Megamenu > Menu Management like below image and then follow the below instructions. It shows you how to config:

 

 1. Horizontal menu:

Menu item” FEATURES”

How to config menu item, namely “Features” on back-end :

  1. – add submemu
  2. – setting width dropdown: 600px
  3. – Setting Main Content Type: Child menu item
  4. – Setting Child Menu Column: 3 columns

 

 

Menu item” WOMEN”

How to config menu item, namely “Women” on back-end

– Add submenu

– Add dropdown width: 100%

– add html on header block:

<div class="pull-left">
<ul class="links">
<li>Recommended:</li>
<li><a href="#">Configurable</a></li>
<li><a href="#">Galaxy S3</a></li>
<li><a href="#">Galaxy S4</a></li>
<li><a href="#">iPhone 5</a></li>
</ul>
</div>
<div class="pull-right">
<ul class="links">
<li><a href="#">Galaxy S4</a></li>
<li><a href="#">iPhone 5</a></li>
</ul>
</div>

– Add left block width: 20% and content:

 

<p><img src="{{media url="wysiwyg/ves_crafk/banner1.jpg"}}" alt="" width="370" height="320" /></p>
<h3>Featured Category</h3>
<p>This is a custom block ready to display any content. You can add blocks to any category in the catalog...</p>
<p>&nbsp;</p>
<p><strong><a href="http://localhost/ves_crafk/admin/cms/wysiwyg/directive/___directive/e3tzdG9yZSB1cmw9IndvbWVuLmh0bWwifX0,/key/41400a407ff7453926ef640794fe7ca32e4465b44438337672bedc3c3c582d6c/">View Category <em class="fa fa-long-arrow-right">&nbsp;</em></a></strong></p>

– Add Main content width : 50%

Setting Main Content Type: Child menu item

Setting Child Menu Column: 3 columns

 

– Add Right Block width 30% and widget to content:

 

<div>{{widget type="Ves\Megamenu\Block\Widget\Products" widget_title="Latest Products" product_source="latest" categories="20" number_item="8" column="2" enable_owlcarousel="1" number_item_percolumn="1" autoplay="1" autoplay_timeout="3000" autoplay_hoverpause="1" dots="1" nav="1" loop="1" show_name="1" show_short_description="1" show_price="1" show_review="1" show_new_label="1" show_sale_label="1" show_image="1" image_width="200" image_height="259" show_compare="1" show_wishlist="1" show_addtocart="1"}}</div>

– Add Bottom block width html content:

 

<div class="pull-left">
<ul class="links">
<li>Recommended:</li>
<li><a href="#">Configurable</a></li>
<li><a href="#">Galaxy S3</a></li>
<li><a href="#">Galaxy S4</a></li>
<li><a href="#">iPhone 5</a></li>
</ul>
</div>
<div class="pull-right">
<ul class="links">
<li><a href="#">Galaxy S4</a></li>
<li><a href="#">iPhone 5</a></li>
</ul>
</div>

 

Menu Item “Fashion”

How to config menu item, namely “Fashion” on back-end

– Add submenu

– On each submenu, Main Content dropdown, add width Ves-Megamenu:Product

<div>{{widget type="Ves\Megamenu\Block\Widget\Products" product_source="latest" categories="11" number_item="4" column="4" number_item_percolumn="1"  show_price="1" show_name="1" show_review="1" show_new_label="1" show_sale_label="1" show_image="1" image_width="200" image_height="260" show_compare="1" show_wishlist="1" show_addtocart="1"}}</div>

You can change categories for each submenu item

 

How To Create Simple Menu & Change Top Menu – Magento 2 Mega Menu Tutorials 

How To Create 6 Menu Types – Drag & Drop Magento 2 Mega Menu Tutorials

How To Style Your Menu without editing css file – Magento 2 Mega Menu Tutorials

 

 

Homepage Configuration

ezBoozt have 4 extensions with 13 homepages

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save the configuration.

To get more details, please watch this video in home installation part:

Go to back-end > Content > Pages > Edit profile name “ex: Fashion Home Page 1

To change the layout of the page, go to Content > Pages, select the page, select one of the options in the Layout field and click Save Page button:

To edit the content of the home page, add “block” or remove “block” in the “Layout Update XML” field and click Save Page button.
To edit the content of this block, Go to back-end > Content > Blocks > Edit profile name “ex: fashion_homeslider_1

To get more details, please watch this video:

To edit these slider content, please go to Admin Panel > Content > Elements > Blocks, select necessary static block. You can modify slider content by custom HTML based on sample content.

To make the slide image clickable, you can use this HTML as a block content:

<a href="#"><img src="{{media url='wysiwyg/ves_boost/slide_01.jpg'}}" alt="Sample slide" /></a>

Config Contact Page

Link page: demo4coder.com/arthome/contact

How To config: Go To VenusTheme > Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\Venustheme\arthome\Magento_Contact\templates\form.phtml

 

 

 

Homepage Configuration

Gemme have 8 extension with 5 homepage built by Ves Page Builder module.

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

Go to back-end > VenusTheme > Ves Page Builder > Edit profile name “Gemme Homepage Default

In the back-end, we used the widget, namely “Content Carousel” on page builder profile. To change image slider, please Go to back-end > VenusTheme > Ves Page Builder > choose “Manager Elements” > Edit block profile “Gemme Slider 1”.

  1. Gemme Slider 1
  2. Gemme Slider 2
  3. Gemme Slider 3




ex: content for “Gemme Slider 1“:

<p><a href="{{store url="women.html"}}"><img src="{{media url="wysiwyg/ves_gemme/slider1.jpg"}}" alt="" /></a></p>
<div class="slider-content" style="left: 20%; top: 25%;">
<p><span class="caption">Hot Sale</span></p>
<h4>SOCIAL DSO4AAL 4</h4>
<h3>SEATER <span>SOFA</span></h3>
<p>Lorem Khaled Ipsum is a major key to success. told you all this</p>
<p>when you have a swimming pool...</p>
<a class="btn hidden-md" href="#">BUY NOW</a></div>

 

 

Back-end Setting:

 

Gemme Image V2:

Back-end Setting:

Gemme Image V3:

Back-end Setting:

Gemme Image V4:

Back-end Setting:

Choose “no-margin” for row setting and “no-padding” for col setting:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit pagebuilder element profile “Gemme Our service”.



Config in admin in Pages Builder Elements profile “Gemme Blog”.

Add the class prefix for row setting




 

Back-end Setting:

please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Gemme Product List”.

 

Gemme Product List V2:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Gemme Product List V2”.

 

Add prefix class in widget setting:

 

Blackstore Product List V3:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Gemme Product List V3”.


 
Add the class prefix for row setting

Gemme Product List V4:


Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Gemme Product List & HTML”.

Config header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add a custom top link.

 

3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of search box
– Change format button search

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\bishop\Magento_Theme\templates\html\setting.phtml

How it is show on front-end:
5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

General Questions

Social Links

Config header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add custom top link.

 

3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of search box
– Change format button search

How it is shown on front-end:

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\melody\Magento_Theme\templates\html\setting2.phtml

How it is show on front-end:

    
    <?php
        $id = $block->getIdModifier() ? '-' . $block->getIdModifier() : '';
        $currency_custom = $this->getChildHtml('currency_custom2');
        $store_language = $this->getChildHtml('store_language_custom2');
    ?>
    <?php if($currency_custom || $store_language): ?>
        <div class="setting-links">
            <div class="actions options setting-links-options">
            <?php if($store_language): ?>
                <div class="switcher-language-wrapper">
                    <?php echo $store_language ?>
                </div>
            <?php endif; ?>
            <?php if($currency_custom): ?>
                <div class="switcher-currency-wrapper">
                    <?php echo $currency_custom ?>
                </div>
            <?php endif; ?>
            </div>
        </div>
    <?php endif; ?>

 

5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

frontend show:

Config Cart Page

Config in admin panel > Ves Themesetting > Cart page:

 

+ Config number product for cross-sell on cart page:

Front-end showing

Note: config show / hidden element (name, price, review…) as related, upsell

 

Header Configuration

Gemme provides 5 header styles, you can choose one of them here.

#Header Default:

 

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default2: default2.phtml (header 2)

Code HTML at this path file

app\design\frontend\Venustheme\blackstore\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Static Blocks Diagram

This is all CMS static blocks we are using on the Arthome.

To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

 

1. “Arthome Block Header”

<p><em class="fa fa-phone">&nbsp;</em><span style="font-weight: 600; color: #222;">Hotline: </span>(008) 2345 - 6789</p>

 

2. Arthome Block Header 2 (show in header3)

<p>Hello guys! Welcome to <span style="font-weight: 600;">ART HOME</span></p>

 

3. Arthome Categories Block (show in Categories page)

<p><img src="{{media url="wysiwyg/ves_arthome/categories_banner.jpg"}}" alt="" /></p>
<div class="categories-desc">
<h3>SOFA COLLECTION</h3>
<h4>LOWEST PRICES <span>GUARANTEED</span></h4>
<p class="hidden-sm hidden-xs">Lorem Khaled Ipsum is a major key to success. told you all thisbefore, when you have a swimming pool.</p>
<p class="hidden-sm hidden-xs">when you have a swimming pool.</p>
</div>

Choose block for categories
Please go to Admin -> Products -> Categories -> edit a categories -> choose Blocks fo it:

4. Arthome Content Popup (show in popup newsletter)

<div class="popup-content" style="margin-top: 45px;">
<h4>Daily Promotion</h4>
<h3>Sign up for Newsletter</h3>
</div>
<div class="social hidden-xs">
<ul>
<li class="social-facebook"><a title="Facebook" href="https://www.facebook.com/venustheme"> <em class="fa fa-facebook"><em class="hidden">Facebook</em></em></a></li>
<li class="social-google"><a title="Google" href="https://plus.google.com/+VenusTheme"> <em class=" fa fa-google-plus"><em class="hidden">Google+</em></em></a></li>
<li class="social-twitter"><a title="Twitter" href="https://twitter.com/venustheme"> <em class="fa fa-twitter"> <em class="hidden">Twitter</em></em></a></li>
<li class="social-youtube"><a title="Youtube" href="https://www.youtube.com/user/venustheme"> <em class="fa fa-youtube-play"><em class="hidden">Youtube</em></em></a></li>
<li class="social-instagram"><a title="Instagram" href="#"> <em class="fa fa-instagram"><em class="hidden">Instagram</em></em></a></li>
</ul>
</div>

Footer Profiles

Footer manager:

Admin -> VenusTheme -> Ves Pagebuilder -> Manage Elements:

#Footer1:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Gemme Footer”:

#Footer2:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Gemme Footer2”:

How To Choose footer profiles

Go to back-end > Ves Themesetting > Footer > enter your block

Social Share Links

Blog module

1. How To Change URL link:

Go to Admin Panel > Stores -> Configuration > Venus Theme Extension > Ves Blog

2. Config show/hidden elements in post page (detail post)

Show on frontend:

 

3. Config show/hidden elements in Category page

Show on frontend

 

4. How To Change page layout for each blog category

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category

On Design tab : you can choose page layout for category

 

5. How To Custom Category Blog Page: Show grid, list or Masonry View Mode

Go to Admin Panel > Ves Blog > Categories > Category Management > Edit 1 category or add new category > Design tab:

 

Config Contact Page

Link page: demo4coder.com/arthome/contact

How To config: Go To VenusTheme > Ves Themesetting > Contact page:

 

+ Contact Form tab:

 

+ Google map tab:

– You can change address, Longitude, Latitude

– You can add contact information : email, address, telephone, fax, custom html about us, etc…

 

+ Edit Form :

You can edit form at this path file:

app\design\frontend\Venustheme\gemme\Magento_Contact\templates\form.phtml

 

 

 

Tab by Source and Conditions

Megamenu

Arthome includes the fantastic Megamenu in an additional module called Ves MegaMenu. The Megamenu module comes with a custom admin interface through which you can create powerfull Menu. No coding is required. Follow these steps to create a module:

 

Front-end:

 

Back-end:

– Create new Menu item:

– General Information:

– Header:

– Left Block:

– Main content:

– Right block:

– Bottom block:

– Custom design for menu item:

– Dynamic Content Tab:

Front-end showing:

Back-end config:


Config menu item dynamic:

Config Generals

In this tab, you are able to:

– Choose maximum page width on dropdown or change value input

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Config body background, padding

– Add custom google font for body

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

 

Please Go to Admin Panel > VenusTheme > Ves ThemeSettings > General

Gemme provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

We created 15+ skins in Gemme : You can view it in folder:

..\Venustheme\gemme\Ves_Themesettings\web\css\skins\

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml :-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme :- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml :- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in default.xml the file.This file is also used to override default theme’s settings.media/preview.png :- The preview of the current theme.web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php :- This file is required to register our theme to Magento2 system.theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.

composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install / update for the user to ensure the theme installs correctly.Creating theme filesLet us now create our files one by one.

Creating theme files

Let us now create our files one by one.

theme.xml ( app/design/frontend/Venustheme/mohawk_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Mohawk Child</title> <!-- your theme's name -->
   <parent>Magento/blank</parent> <!-- the parent theme -->
   <media>
        <preview_image>media/preview.jpg</preview_image> <!-- theme's preview image -->
   </media>
</theme>

registration.php ( app/design/frontend/Venustheme/mohawk_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/mohawk_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/mohawk_child/composer.json )

{
 "name": "magento/theme-frontend-mohawk_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-blank": "100.0.*",
 "magento/framework": "100.0.*"
 },
 "type": "magento2-theme",
 "version": "100.0.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose Mohawk child


* Important: After you choose new theme or new theme child, you need reindex data and run command below via SSH:

php bin/magento setup:static-content:deploy

Header Configuration

Body Fitness provides 4 header styles, you can choose one of them here.

#Header1:

#header2:

#header3:

#header4:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default2: default2.phtml (header 2)
  3. Default3: default3.phtml (header 3)
  4. Default4: default4.phtml (header 4)

Code HTML at this path file

app\design\frontend\Venustheme\body_fitness\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Header Configuration

Aveda provides 3 header styles, you can choose one of them here.

#Header1:

#header2:

#header3:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default1: default1.phtml (header 1)
  3. Default2: default2.phtml (header 2)

Code HTML at this path file

app\design\frontend\Venustheme\blackstore\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Header Configuration

Ves Ministore provides 2 header styles, you can choose one of them here.

Backend config:

To Config Header Default, Go to Admin Panel >> VES THEMESETTINGS >> Header >> General Settings >> Choose ” Default” Header Layout

Code html at this path file

app\design\frontend\Venustheme\ministore\Ves_Themesettings\templates\header\default.phtml

Backend config:

To Config Header 1, Go to Admin Panel >> VES THEMESETTING >> Header >> General Settings >> Choose ” Default 2″ Header Layout

Code html at this path file

app\design\frontend\Venustheme\ministore\Ves_Themesettings\templates\header\default2.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name
After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Config header

1. General tab: Choose Header Layout : “Default”

2. Top Link tab: Show link my account, sign in, create an account, and custom link

You can add a custom top link.

 

3. Search tab:
– Enable: Yes or No
– Custom style
– Add maximum width of search box
– Change format button search

 

4. Language Switcher and Currency Switcher tab:

This block setting group custom code in this file

app\design\frontend\Venustheme\gemme\Magento_Theme\templates\html\setting.phtml

How it is show on front-end:
5. Sticky Header tab:

Config “Scroll To Fixed” header ( keep header when scrolling window). You can choose all sticky elements (all header )or choose specify element

6. Top cart tab:

– There are 4 options for you to show Top Cart, you can choose to show what you want

  • Text Only
  • Icon Class Only
  • Text + Icon Class
  • Icon Class + Text

Homepage Configuration

Mohawk have 8 extension with 6 homepage built by Ves Page Builder module.

 

#Overview:

To configure the default home page for your store, go to Store > Configuration > General > Web > Default Pages tab, select the desired page in the CMS Home Page field and save configuration.

Go to back-end > VenusTheme > Ves Page Builder > Edit profile name “Mohawk Homepage Default

In the back-end, we used the widget, namely “Content Carousel” on page builder profile. To change image slider, please Go to back-end > VenusTheme > Ves Page Builder > choose “Manager Elements” > Edit block profile “Cricket Slider 1”.

  1. Mohawk Slider 1
  2. Mohawk Slider 2
  3. Mohawk Slider 3
  4. Mohawk Slider 4




ex: content for “Mohawk Slider 1“:

<p><a href="{{store url="women.html"}}"><img src="{{media url="wysiwyg/ves_mohawk/slider1.jpg"}}" alt="" /></a></p>
<div class="slider-content" style="left: 15%; top: 25%;">
<h2>The Gass &amp;</h2>
<h2 style="margin-bottom: 40px;">The Guardian</h2>
<p style="margin-bottom: 40px;">THE GUIDE FOR GIVING QUALITY GIFTS THIS SEASON</p>
<h3>$59,995</h3>
<p><a class="view-more hidden-md hidden-sm" href="#">SHOP NOW <em class="fa fa-long-arrow-right"><em class="hidden">shop now</em></em></a></p>
</div>
<div class="follow hidden-xs">
<ul class="social">
<li>FOLLOW US</li>
<li class="line"></li>
<li><a class="facebook" title="Facebook" href="https://www.facebook.com/venustheme"> <em class="fa fa-facebook"><em class="hidden">Facebook</em></em></a></li>
<li><a class="twitter" title="Twitter" href="https://twitter.com/venustheme"> <em class="fa fa-twitter"> <em class="hidden">Twitter</em></em></a></li>
<li><a class="youtube" title="Youtube" href="https://www.youtube.com/user/venustheme"> <em class="fa fa-youtube-play"><em class="hidden">Youtube</em></em></a></li>
</ul>
</div>
<div class="right-caption hidden-xs">
<p>FASHION / COLECTION 2017</p>
</div>
<div class="find-more">
<p>FIND OUR MORE</p>
</div>

 

 

Back-end Setting:

 

Mohawk Image V2:

Back-end Setting:

Mohawk Image V3:

Back-end Setting:

Mohawk Image V4:

Back-end Setting:

Add prefix class:

Mohawk Image V5:

Back-end Setting:

Add prefix class:

Mohawk Image V6:

Back-end Setting:

How To Config in the back-end :
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mohawk HTML”.

Add class Prefix for this block:


Mohawk HTML V2, V3, V4:

Back-end Setting:

Mohawk HTML V5:

Back-end Setting:

Add background image for this block:

Mohawk HTML V6:

Back-end Setting:

Mohawk HTML V7:

Back-end Setting:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit pagebuilder element profile “Cricket Our service”.


Widget configuration:

Config in admin in Pages Builder Elements profile “Cricket Blog”.



Mohawk Blogs V2:

Add the class prefix for widget blog:


+ How To Config In The Backend

>> In the back-end, we used the Pages Builder Elements “Cricket Newsletter” to build it



Mohawk Newsletter V2:

+ How To Config In The Backend

Mohawk Newsletter V3:

+ How To Config In The Backend:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Mohawk Testimonial”.

 

Back-end Setting:

please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Cricket Product List”.

 

Add prefix lass:

Mohawk Product V5, V6, V7, V8, V9:

 

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Cricket Product V2”.

 

Mohawk Product V11:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “MohawkProduct V11”.

Add categroeis tab for product list widget:

Mohawk Product V12:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Cricket Product V4”.

 

Mohawk Product V13:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Cricket Product V5”.

 

Mohawk Product V14:

Back-end Setting:
please Go to back-end > VenusTheme > Ves Pages Builder > Manage Elements > Edit page builder element profile “Cricket Product V6”.

Add the class prefix for Cricket Product List V6:

 

Heading title big size:

 
Back-end Setting: Add class prefix

Heading title medium size:

Footer Profiles

Footer manager:

Admin -> VenusTheme -> Ves Pagebuilder -> Manage Elements:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Aveda Footer”:

How To Choose footer profiles

Go to back-end > Ves Themesetting > Footer > enter your block

Content Swiper Slider

Config Product View Page

– Other elements:

+ Config enable / disable elements by change value Yes / No

+ Specify you can change position of thumnail slider: horizonal or vetical, Top or bottom

– Config show tab- Custom tab

+ Tab By Product Attribute Code

+ Tab By CMS Block

+ Tab By Static Html Content

– Config Related Products: number items and item show on responsive

Back-end Setting:

Frontend result:

– Config Upsell product:

Back-end Setting:

Frontend result:

Header Configuration

Mohawk provides 6 header styles, you can choose one of them here.

#Header1:

#header2:

#header3:

#header4:

#header5:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default1: default1.phtml (header 1)
  3. Default2: default2.phtml (header 2)

Code HTML at this path file

app\design\frontend\Venustheme\blackstore\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Footer profile

The frontend show:

How To Config footer profiles in backend

Design in: Ves Pagebuilder > Manage Block Profile > edit item block builder :”Ves Ministore Footer”

Go to back-end Ves Themesetting Footer Choose CMS static block : “Ministore Block Footer Top

Config Cart Page

Config in admin panel > Ves Themesetting > Cart page:

 

+ Config number product for cross-sell on cart page:

Front-end showing

Note: config show / hidden element (name, price, review…) as related, upsell

 

Footer Profiles

Footer manager:

Admin -> VenusTheme -> Ves Pagebuilder -> Manage Elements:

Footer layout 1, 2, 3:

Backend configuration:

Footer layout 4:

Backend configuration:

Footer layout 5:

Backend configuration:

Design in: VenusTheme -> Ves Pagebuilder -> Manage Elements -> edit item pages builder element “Cricket Footer”:

How To Choose footer profiles

Go to back-end > Ves Themesetting > Footer > enter your block

Getting Started

Havina comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Havina is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Havina is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Havina is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://server1.demo4coder.com/havina/landing

Purchase It Now

P/s: Our change theme name from Ves Aveda to Ves Havina (08/07/2017)

Header Configuration

Swimwear provides 2 header styles, you can choose one of them here.

#Header1:

#header2:

>> How To Config Other Header for storeview

To Config Other Header, Go to Admin Panel >> VenusTheme >> VES THEMESETTING >> Header >> General Settings >> Choose Your Header Layout

  1. Default: default.phtml (header default)
  2. Default1: default2.phtml (header 2)

Code HTML at this path file

app\design\frontend\Venustheme\swimwear\Ves_Themesettings\templates\header\default.phtml

To change Logo, Go to Admin Panel > Content > Configuration > Edit theme_name

After that, you need to open “Header” Tab > Upload your logo(GIF, PNG, JPG, or SVG file type) with the uploader

Static Blocks Diagram

This is all CMS static blocks we are using on the Gemme.

To Open Cms Static Blocks, Go To Admin Panel > Content > Blocks

 

1. “Gemme Block Header”

 

<div class="ves-widget widget-phone item">
<ul>
<li class="first"><strong>635-662-1372</strong></li>
<li class="last"><span>Available. 24/7 </span></li>
</ul>
</div>

 

2. Gemme Block Header 2 (show in header3)

<p><a href="#"><img src="{{media url="wysiwyg/ves_gemme/store1/slidershow/1.png"}}" alt="" /></a></p>
<div class="slidershow-info">
<div class="slider-text ">
<div class="txt1 des wow" style="visibility: visible; animation-duration: 1s; animation-name: fadeIn;" data-wow-duration="1s">Cuprite <span>mexico fine mineral</span> specimen</div>
</div>
</div>

 

 

Config Generals

In this tab, you are able to:

– Choose maximum page width on dropdown or change value input

– Choose skin color store view

– Choose director support LTR or RTL Languages

– Enable or disable panel tool

– Config body background, padding

– Add custom google font for body

– Config color text body, text link, text link hover

– Config button color, background and hover, focus

 

Please Go to Admin Panel > VenusTheme > Ves ThemeSettings > General

Cricket provides Custom Page Width (960px, 1024 px, 1280px, 1360px, 1440px, 1680px,…), and Maximum Page Width mode, you can choose the one that you prefer. You can apply this option to any home versions.

We created 15+ skins in Cricket: You can view it in folder:

..\Venustheme\cricket\Ves_Themesettings\web\css\skins\

Getting Started

Bishop comes with modern, elegant, professional product-oriented design, the theme lets you showcase your items at it’s best.

Are you seeking theme for magento 2? Bishop is designed for magento 2 with tons of improvements in performance and scales. Also, it delivers engaging and rich user experience on any devices. Thus customer can shop anytime anywhere

Bishop is one of our responsive magento 2 themes. This magento 2 theme created with new magento 2 UI and integrate bootstrap 3.3.6 layout components. Also, it is inherited from magento 2 blank theme

Advanced Guide: Developer Guide For Magento 2

Compatibility:

Bishop is fully compatible with Magento Community Edition 2.0.0, 2.0.x, 2.1.0, 2.1.x

Demo Link: http://demo4coder.com/bishop/landing

Purchase It Now

Child Theme Configuration

Please create child theme folder in app/design/frontend/company_name/theme_name
ex:
etc/view.xml :-This file is used to specify product image dimensions, thumbnails etc.Magento_Theme :- This directory is used to override existing Magento’s theme files.Magento_Theme/layout/default.xml :- By default, Magento2 assumes that your theme’s logo file should be: /web/media/logo.svg If you want some other file for logo, then you must declare it in default.xml the file.This file is also used to override default theme’s settings.media/preview.png :- The preview of the current theme.web :- This directory contains all the theme’s static data like images, styles, javascript, fonts etc.registration.php :- This file is required to register our theme to Magento2 system.

theme.xml :- This is a compulsory file that defines our theme name, its parent and optionally theme’s preview image.

composer.json :- If you plan to distribute the theme using a composer package will make it easier for people to install the custom theme, you can specify any required packages in which composer can install / update for the user to ensure the theme installs correctly.Creating theme filesLet us now create our files one by one.

Creating theme files

Let us now create our files one by one.

theme.xml ( app/design/frontend/Venustheme/aveda_child/theme.xml )

<theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd">
   <title>Aveda Child</title> <!-- your theme's name -->
   <parent>Magento/blank</parent> <!-- the parent theme -->
   <media>
        <preview_image>media/preview.jpg</preview_image> <!-- theme's preview image -->
   </media>
</theme>

registration.php ( app/design/frontend/Venustheme/aveda_child/registration.php )

<?php
\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::THEME,
    'frontend/Venustheme/aveda_child',
    __DIR__
);

composer.json ( app/design/frontend/Venustheme/aveda_child/composer.json )

{
 "name": "magento/theme-frontend-aveda_child",
 "description": "N/A",
 "require": {
 "php": "~5.5.0|~5.6.0|~7.0.0",
 "magento/theme-frontend-blank": "100.0.*",
 "magento/framework": "100.0.*"
 },
 "type": "magento2-theme",
 "version": "100.0.2",
 "license": [
 "OSL-3.0",
 "AFL-3.0"
 ],
 "autoload": {
 "files": [
 "registration.php"
 ]
 }
 }

Please go to Admin -> Content -> Configuration

Then open Design Configuration -> choose Aveda child


* Important: After you choose new theme or new theme child, you need reindex data and run command below via SSH:

php bin/magento setup:static-content:deploy