A Product Archive/Shop page is a WooCommerce page used to display the products added. It displays according to the settings given in WooCommerce > Settings > Products.
In MyBag theme, the Shop Page can be displayed in 3 available layouts which are :
You can select the layout of the shop from MyBag > Shop Tab > Shop/Catalog Pages > Shop/Catalog Pages Layout.
MyBag is bundle with two different product styles.
The Content Section of the Shop Page displays either Products or Categories or both depending on the choice given in Shop Page Display option under WooCommerce > Settings > Products.
Product Categories/ Subcategories are displayed according to the layout in grids. It will display the Product Category image and Product Category Title. We recommend displaying only Products in Product Archive/Shop Pages.
In Product Archive/Shop Page, product items can be displayed by choosing number of columns for displaying products in shop and catalog pages.
You can select the Product Columns under MyBag > Shop Tab > Shop/Catalog Pages > No of Product Columns.
Once we have chosen the shop layout, we'll have the number of product items displayed per row. The number of product items per page is recommended to be a multiple of the number of product items displayed per row.
You can set the number of items displayed from MyBag > Shop Tab > Shop/Catalog Pages > Number of Products Per Page.
Product items can be animated when the appear on viewport. More than 25+ CSS3 animation effects are available which includes :
You can set whether you want to animate the product item from MyBag > Shop Tab > Product Item Settings > Product Item Animation .
Animation-delay property specifies when the animation should start. This lets the animation sequence begin some time after it's applied to an element.
You can enable/disable animation delay from MyBag > Shop Tab > Product Item Settings > Should Delay Animation.
Lazy loading is a technique used to defer the loading of an image until the point at which it is needed i.e. when the image appears in the viewport. This will contribute to faster page loading since the images are not loaded until required.
You can enable/disable Lazy loading of Thumbnail images from MyBag > Shop Tab > Product Item Settings > Thumbnail Lazy loading.
In MyBag theme, the Single Product Page can be displayed in 3 different styles, you can choose the style as you like in Single Product Item Style option.
This widgetized area contains all the widgets used for layered navigation. In the default preview we have used :