Clover [Genesis] - Shop Page
Clover features a custom shop page built with WooCommerce.
Getting Started with WooCommerce
Click here for instructions on installing WooCommerce. Come back here once you have the necessary plugins installed.
Configuring your shop like the demo
1. In your WordPress dashboard, go to Appearance > Customize > WooCommerce > Product Catalog.
2. Under Products Per Row, type "3."
3. Still in the Customizer, go to WooCommerce > Product Images.
4. Configure the settings as shown below:
5. Click Publish to save your changes.
WooCommerce Shop Sidebar
Clover features a shop sidebar containing product-related widgets. You can add widgets to the shop sidebar at Appearance > Widgets > WooCommerce Sidebar.
Please note: WooCommerce must be installed and activated on your website before the WooCommerce Sidebar will appear on your Widgets page.
Here are the widgets used in the demo:
Remove the shop sidebar
Don't want the sidebar? Go to Pages > All Pages and open your Shop page. Then click here for instructions setting on the page to the full-width layout.
Change the number of products per page
Go to Appearance > Customize > Clover Theme Settings > Category Archives > Number of posts on archive pages.
Change the position of the shop sidebar
If you'd like the shop sidebar to display on the right instead of the left, that is possible with a minor code modification.
1. Go to Appearance > Theme Editor > woo > woocommerce-functons.php.
2. Scroll to line ~75 and find this section:
//* Change Shop and Cat Archive Pages to Sidebar-Content Layout add_filter( 'genesis_pre_get_option_site_layout', 'clover_layout_woocommerce'); function clover_layout_woocommerce( $opt ) { if ( ! class_exists( 'WooCommerce' ) ) return; if ( is_shop() || is_product_category() || is_product_tag() ) { $opt = 'sidebar-content'; return $opt; } }
3. On the line shown below, replace sidebar-content with content-sidebar. Make sure to leave the quotes where they are.
$opt = 'sidebar-content';
4. Click Update File to save.