Display your WooCommerce products in a beautiful, fully‑styleable grid — with sale badges, ratings, prices, Add‑to‑Cart, and optional Wishlist / Compare / Quick View buttons.
Requires: WooCommerce active. The conversion buttons additionally require the WooCommerce Conversion module — see the Conversion Suite.
Adding the grid
- Edit a page in Elementor and drag in the Tiger Product Grid widget.
- Pick a Style Preset — Classic, Minimal, Beauty, Luxe, or Soft. Beauty uses a fixed layout, so its Order Settings section (drag order for category/tag/title on the card) is hidden.
- Choose Columns (1–6, responsive) and Total Products.
- Style everything in the Style tab.
Archive / pagination mode
Switch Archive / Pagination Mode on to hook the grid into the current WooCommerce archive query (shop, category, tag pages) instead of a fixed product list — pick Numbers or Previous/Next pagination. Leave it off for a “Simple” fixed-count grid, which can instead show an AJAX Load More button that appends the next page without a page reload.
Choosing which products to show
In Simple mode, the Source control picks the base set: Latest, On Sale, or Featured. Stack a category/tag Include or Exclude filter on top of that (e.g. “Featured products in category X”), and set Order By (date, title, price, sales, random) and direction.
Each product card automatically shows its image, title, category, rating, price (including sale price with a discount badge), and an Add to Cart button — toggle any of these (badge, category, tags, reviews, description) on or off in Card Settings.
Conversion buttons (Wishlist / Compare / Quick View)
In the grid's Wishlist & Compare section you can switch on three card buttons:
| Toggle | Adds |
|---|---|
| Show Wishlist Button | A heart to save the product. |
| Show Compare Button | A toggle to add the product to a comparison. |
| Show Quick View Button | An eye icon that opens the product in a pop‑up. |
These appear as neat icon buttons on each card and fade in on hover. See the Wishlist, Compare, and Quick View articles for the full experience.
This section only appears when the WooCommerce Conversion module is active.
Styling
The Style tab gives you control over card spacing, borders, image size, title and price colours, badge style, rating colour, and the Add‑to‑Cart button. Pick a preset for a quick professional look, then fine‑tune.
Tips
- Keep 3–4 columns on desktop for a balanced look; the grid stacks responsively on smaller screens.
- Turn on Archive / Pagination Mode for real shop/category pages so the grid respects WooCommerce’s own product query and any store filters/search.
- Turn on Quick View on busy category pages so shoppers can preview without leaving.
- Use the sale badge and rating to build trust and urgency.
Troubleshooting
No products show. Check your Source and category/tag filters — a filter with no matching products returns an empty grid.
The Wishlist/Compare/Quick View toggles are missing. They only appear when WooCommerce and the WooCommerce Conversion module are both active.
Prices or sale badges look wrong. These come straight from WooCommerce. Confirm the product's regular/sale prices are set correctly in the product editor.