In this panel, you can customize all settings for WooCommerce elements.

Please notice that all changes in this panel will only affect WooCommerce pages, including:

 

 

General

In this section, you can live configure general settings for all WooCommerce pages and elements.

 

Options:

 

Note: you can also use “buy now” button for one or several products anywhere on your site by using Buy Now shortcode.

 

Enable catalog mode

 

When enabled, no one can see eCommerce buttons (add to cart, buy now, quick view, compare). Your eCommerce site will turn into an online catalog.

ecommerce

When catalog mode is enabled, you can disable product price as well as add acustom CTA button.

 

Disable price

Show or hide price in Product List or Product Details pageecommerce-copy-2

 

Enable custom button

In Product Details page, you can add a button with the following options:ecommerce-copy
Button text: insert text on button

  • Button type:
    • Simple text or link: insert action for button such as link or email address etc.
    • Contact Form 7: select form, only work with Contact Form 7 plugin

 

Disable wishlist/buy now

  • #1 Enable/disable wishlist: show/hide wishlist icon on each product item

image15

 

image38

 

  • #3 Enable “buy now” button: when enabled, there’ll be a “buy now” button being added to each product item. You can configure how this “buy now” button works

enable

 

Icon set

Pick up a predefined eCommerce icon set for all WooCommerce elements

Note: you can also use “buy now” button for one or several products anywhere on your site by using Buy Now shortcode.
icon-set

 

Product Category

In this sub-panel, you can customize settings for product category.

 

General

Options:

 

 

Show page title

Show or hide page titletitle

 

Sidebar layout

Pick up a layout for product category page. There are 3 sidebar layouts.

 

Layout 1slidebar-layout1

 

Layout 2slidebar-layout2

 

Layout 3slidebar-layout3

 

Sidebar width

Change the width for sidebar. If you choose “no sidebar” option above, this option won’t be shown

sidebar

 

Enable sticky sidebar

Make sidebar sticky.

image20

 

Sidebar above product list

Pick up a sidebar above product list

To create a new sidebar or change sidebar content, go to Widgets panel on Live Customizer, or go to WP Dashboard > Appearance > Widgets.

sidebar-above-product-list

 

Sidebar below product list

Pick up a sidebar below product list.layout-copy-5

To create a new sidebar or change sidebar content, go to Widgets panel on Live Customizer, or go to WP Dashboard > Appearance > Widgets.

 

Customize widget styles

You can also customize Widget styles for your product detail page by clicking on this button.

 

 

Product List

With this sub-panel, you can customize:

 

Layout

There are 3 product list layouts: Grid, Masonry, and List.

 

Grid
layout-1

Masonry
layout2-1

List
layout3-1

Enable border wrap

Use border wrap around each product itemboder boder2

Number of columns

There are 3 options for number of columns:

 

2-column2-colum

 

3-column3-colum

 

4-column4-colum

Column gutter width
layout-copy-6

 

Enable full width

Enable full-width layout style for product list page

Enable item animation

Turn on animation effect for product items

Number of products per page

Change total number of product items per page

Pagination type

There are 3 pagination types.

 

 

Numberpagination

 

Load Morepagination2

 

Infinity scroll

image17

 

Product Item

Here you can pick up a layout as well as hover effect for each product item on product category page.

 

Layouts

There are 6 layouts for a product item.

 

Layout 1

 

Layout 2

 

Layout 3

 

Layout 4

 

Layout 5

image13

 

Layout 6

image39

 

Hover effects

There are 4 hover effects for your product item:

 

Notice: if your choose product list layout #4, you cannot set hover effect.

None
There is no hover effect at all.hover-none

 

Zoom Inimage30

 

Mask Overlayimage27

2-image Previewimage56

 

Product Details

On this sub-panel, you can configure your product detail item page, including:

 

 

General

 

  • #1 Enable floating “add to cart”: make “add to cart” button always display no matter how you scroll mouse up and down
  • #2 Enable social share: turn on social sharing

social

  • Sidebar above product details: pick up a sidebar above product details areasidebar-above-product-list

 

 

  • Sidebar below product details: pick up a sidebar below product details arealayout-copy-7

 

Main Information

Options:

 

Layout

There are 5layout styles for main information area.

 

Layout 1layout1

 

 

Layout 2layout2

With layout 2, you can:

 

Sidebar layout

There are 3 sidebar layouts:

 

 

Noneslidebar-layout2
Left sidebarslidebar-layout1

 

 

With left sidebar, you can customize sidebar, including:

 

Pick up sidebar content

To create a new sidebar or change sidebar content, go to Widgets panel on Live Customizer, or go to WP Dashboard > Appearance > Widgets.pickup-slide-bar

 

Change sidebar width

Sidebar width is in pxsidebar

 

Enable sticky sidebar
Keep the sidebar display when scrolling downsticky

 

Customize widget styles

you can also customize Widget styles by clicking on this button.custom

 

Right sidebarslidebar-layout3With right sidebar, you can make customizations like on left sidebar, including:

 

Thumbnail position
There are 3 thumbnail positions: Left, Right, Bottom

 

Leftthumbnail3

 

Rightthumbnail2

 

Bottomthumbnail1

Enable zooming on mouse hover

When enabled, you can make zooming effect on mouse hover.

You can customize zooming options, including:

 

Zooming type
There are 3 zooming types: Window, Inner, and Lens.

 

Windowimage39

With this zooming type, you can change width and height for the zooming window.layout-copy-8

Innerimage18

Lensimage67

Enable mousewheel zoom

When enabled mousewheel zoom, you can make zooming just by scrolling your mousewheel.mouse

image03

Enable easing

When enabled easing, your zooming movements will be smoother.easing

 

Layout 3layout3

 

Layout 4layout4

 

With this layout, you can pick up background color for main product section.color

 

Layout 5

This layout is used for digital download niche, but you can still use it for your product detail page if you like.layout5

Extra Information

 

  • #1 Show description: show product descriptionshow-des

 

  • #2 Show attributes: show product attributesattriibuilt

 

  • #3 Show reviews: show review arearevie

 

Other Products

In this section, you can customize:

 

 

Show upsell productslayout-copy-10

 

Show recently viewed productslayout-copy-9

Number of products to show

Number of products is from 1 to 6relate-size

 

Cart Page

 

Sidebar above cart pagelayout-copy-11

 

Sidebar below cart pagerelate-size-copy-2

 

Checkout Page

Sidebar above checkout formlayout-copy-12

 

Sidebar below checkout formlayout-copy-13

 

 

Thank You Page

You can write your own thank you page by clicking “Set Content” button. HTML tags are allowed

layout-copy-14

 

Mobile layout

Besides using responsive desktop layout, you can setup a special shop layout on mobile devices. We highly recommend you to use this mobile layout to ensure the most friendly user experience on mobile devices.

On this section, you can setup mobile layout for:

Product category

This is a product category layout on mobile.

image87

 

With this shop page, you can:

 

Show or hide product categories widget

image38

 

image69

 

Show or hide sidebar widget. When enabling sidebar widget, you can pick up a sidebar content

image82

 

image86

 

 

Layout:

There are 2 layouts for product category: Grid and List

 

Grid

With grid layout, you can pick up number of product item columns. There are 2 options for number of columns:

 

1-column

image05

 

2-columns

image10

 

List

image06

 

Product details

With product detail, you can enable or disable sticky function of “add to cart” button.

image19

 

image24