Updated on December 14, 2018 In the members-only forum a user asked,
how easy / hard would it be to take this: and utilize it for a woocommerce main "shop" page?In this article we shall spruce up the standard WooCommerce products display on product archives (main Shop page, Category archives and Tag archives) into a sleek 3-column image-only grid. Hovering on a product image will fade in the product details: Name, Excerpt, Rating, Price and Add to cart button. When the mouse moves off a image, the product meta will fade out. Live Demo Before: After: When a product image is hovered:
While the tutorial has been written for Agency Pro child theme it should work with minor adjustments in any Genesis child theme.
Step 1Install and activate WooCommerce and Genesis Connect for WooCommerce, if you haven't already. Set up WooCommerce.
Step 2Add the following in child theme's functions.php:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.