Modules WooCommerce Products
WooCommerce Products
Show your WooCommerce products with Kinetic motion: cards that stack as you scroll, a shelf that travels sideways, an endless product marquee and a list that shows each product’s picture beside the pointer. Pick recent, featured, on-sale, best-selling or top-rated products, a category or hand-picked ones.
↓ The products are sample products in a demo shop. Prices, sale badges and Add to cart come straight from WooCommerce.
Live demo · Pro · Products module
A product grid that fades up
The Products module lists products as cards with image, sale badge, category, price and Add to cart. Here it shows the four newest products, and Stagger in its Kinetic tab brings the cards in one after another.
Live demo · Pro · Stacking Cards
Featured products that stack
Stacking Cards on the row with Panels: posts of the Loop or Products module. Each product pins under the header and the next one slides over it. This is the Products: stacking cards section template.
Featured
Our favourites this week
-
Desk
Halo Clock
Original price was: €72.00.€64.00Current price is: €64.00.Silent-sweep desk clock with a coral hand and a matte black face.
-
Lighting
Orbit Lamp
Original price was: €129.00.€99.00Current price is: €99.00.A dimmable table lamp with a soft glass shade that glows violet at dusk.
Live demo · Pro · Horizontal Scroll
A shelf that travels sideways
Horizontal Scroll pins the row and moves the product cards from right to left as you scroll down, with a progress bar. On phones it becomes a swipeable strip. This is the Products: horizontal scroll section template.
Shop
New in the shop
Live demo · Pro · Marquee
An endless product marquee
The free Marquee module gets a Products source in Pro: image, name and price, each linking to its product, looping without a seam and pausing on hover. This is the Products: marquee section template.
In the shop
Live demo · Pro · Hover Image
A product list with a hover image
The Products module with images hidden and one column becomes a big type list. Hover Image in its Kinetic tab shows each product’s own picture beside the pointer, with no image to pick: hover a name (mouse or trackpad).
How to use it
Where to find it
- With WooCommerce active, add Products (WooCommerce) from the Kinetic modules. Choose Products: recent, featured, on sale, best selling, top rated, a category or hand-picked, then how many and the order.
- Show or hide the image, category, rating, price, short description and Add to cart, and set columns per device, the image shape, colours and the title font.
- Stacking Cards and Horizontal Scroll on the row: pick posts of the Loop or Products module as the cards or panels.
- Marquee: set Source to Products and pick what to show (image, name and price).
- Hover Image and Stagger work on the Products module like on a Loop: each product uses its own image.
Without WooCommerce nothing is registered: the module is not offered, existing ones render nothing and a products marquee stays empty instead of showing other content. Hidden, private and out-of-stock products (when the shop hides them) are left out.
Works with
- Stacking Cards, Horizontal Scroll, Marquee
- Hover Image, Stagger, Scroll Effects
- WooCommerce’s own Add to cart (AJAX when enabled)
- Three ready-made product section templates
Good to know
- Pro feature, one switch in Settings
- Uses WooCommerce’s product visibility rules
- Prices in your shop’s currency and format
- Degrades quietly when WooCommerce is off
Kinetic Modules
Make your Beaver Builder sites move.
Start with the free plugin. Add Pro when a project needs the big effects.