Shop Page

First you have to setup the shop page, Go to your WP dashboard, Install WooCommerce plugin from WordPress.org and activate it. Setup your WooCommerce. Create shop page, Navigate to WooCommerce tab > Setting > Products. Now click on “select a page” choose your shop page and save it.

For shop page, Go to Appearance > Customize > WooCommerce > Shop Page. Here you can set up your shop page products.

Products per row –

Enter the number of products which will be displayed in each row. For example, if you set the number of products as “4”, in each row “4” products will be displayed.

Rows per page –

Enter the number of row you want to show in each page. For example, if you set the number of rows as “3”, on each page “3” row of products will be displayed.

Product Image Hover Style –

Choose the desired hover style and show your product in a unique way. You can show your product in “Zoom” or as “Swap” hover style.

Zoom – It is a kind of basic magnify effect on your product, it will zoom out your product while hovering the mouse over it.

Swap – In swap condition the product gallery images will be displayed while hovering or clicking the mouse over the Product. It will exchange the product image and show other images of product which have some different look. For “Product Gallery option” Go to a single product page on the rightmost side you can set your product gallery images.

Product Structure –

Disable or Enable the “Category”, “Title”, “Ratings”, “Price”, “Add to cart” and “Short description”. Change their position by drag & drop the desired element.

Product Content Alignment –

Align your content “Left”, “Right” or “Center”. Just click on the tab and set the desired position.

Product Box shadow –

Set product box background shadow by just scrolling the bar or enter the value in text box. This will highlight your product with a Shadow in the background.

Product Box shadow on Hover –

Whenever you hover your mouse on the product it will show a shadow in the background. Set product box on hover shadow by just scrolling the bar or enter the value in text box.

woo-shop-page

Quick View – Pro Feature

Quick View will allow you to get a quick look of your product without opening the product page. If you want to display your product in Quick view, just “Enable Quick view” by checking the box.

Off Canvas Sidebar – Pro Feature

Off Canvas Sidebar feature will allow you to add navigation sidebar. Just enable or disable it and display navigation sidebar.

Post Pagination – Pro Feature

Choose Post pagination option and show your post as Numbered, Load more and Infinite scroll. You can also add Load more text in the text area.

How to Setup Cart Page, Checkout page and My Account Page –

For Cart

Go to Pages > Add new page > Create Cart page > Add [woocommerce_cart] shortcode in the editor and publish it.  It will show your cart contents in your site.

For Checkout

Go to Pages > Add new page > Create Checkout page > Add [woocommerce_checkout] shortcode in the editor and publish it. In Checkout page show the information such as shipping and payment options.

For My Account

Go to Pages > Add new page > Create Checkout page > Add [woocommerce_my_account] shortcode in the editor and publish it. It will show information to the customer about their account, orders, etc.

Now To set Cart, Checkout and My account Page, go to WooCommerce > Setting > Advanced. In Page setup, set these pages by choosing desired pages from the Select Box. Save it.

woocommerce-pages

Still feel any difficulty, Visit to our Support forum.