CardGrid for WooCommerce
Replace the default WooCommerce product page with a professional card-based variation grid, live order summary, and a modern payment panel.
Use with caution
CardGrid for WooCommerce works, but test it on a staging site before relying on it in 2026. Was last updated 4 months ago, and scores 42/100 on our health check.
- Small user base (<10 active installs)
- Very few reviews so far
- Only tested up to WordPress 6.9 (latest is 7.1)
Daily downloads
Download spikes usually follow a new release — each site that auto-updates counts as a download.
Rankings
Where CardGrid for WooCommerce stands todayWordPress.org search rankings
Live position in the plugin search, top 100| Keyword | Position |
|---|---|
| card grid | >100 |
| dark theme | >100 |
| product page | >100 |
| variation | >100 |
| woocommerce | >100 |
About CardGrid for WooCommerce
From the official readme · v1.9.4Description
CardGrid for WooCommerce transforms the standard WooCommerce single-product page into a high-converting, card-based experience.
Instead of traditional dropdowns, every product variation is displayed as a visual, interactive card. Customers see prices at a glance, select multiple packages, adjust quantities, and place multi-item orders — all without a page reload.
Key Features
Card-Based Variation Grid
- Every variation is a clickable card — no more dropdowns.
- Custom icon / logo displayed inside each card (e.g. ChatGPT, Adobe logo).
- Note badge (pill-shaped) displayed in the top-left of each card.
- Cards show a selected state (border glow + checkmark animation).
- Sale ribbons for discounted variations.
- Out-of-stock cards are visually dimmed and non-clickable.
Smart Quantity Logic
- When quantity = 1: a trash icon is shown. Clicking it deselects the card and removes it from the summary.
- When quantity > 1: the trash icon automatically becomes a minus button for decreasing quantity.
Live Order Summary
- Real-time table showing Package, Rate x Qty, and Line Total.
- Grand Total updates instantly.
- “Clear All” button with configurable colour and hover state.
Per-Product Feature Badges
- Up to 5 customisable feature badges per product (icon + text).
- Drag-to-reorder via the product edit screen.
- Empty slots are automatically hidden on the front end.
5 Layout Templates
- Subscription / Digital — hero image, identity bar, feature pills.
- Service Package — service banner, what’s included checklist, portfolio gallery.
- Software / License — big product icon, version badges, feature grid, screenshots.
- Wholesale / Bulk — multi-image gallery with thumbnails, specs table.
- Event / Course — event banner, date/location badges, curriculum list, seats progress bar.
- Per-product layout override from the product edit sidebar.
Column Width Control
- Admin slider (30-60%) to set the left column width.
- Right column (packages + payment) takes the remaining width.
UI Label Overrides
- 7 front-end text labels are overridable from the settings page without editing code.
PPOM & Third-Party Plugin Compatibility
- Fields added by PPOM (e.g. WhatsApp number), WC Product Add-ons, and similar plugins are preserved and rendered above the Order Now button.
- Default WooCommerce variation dropdowns and add-to-cart button are hidden to avoid duplication.
AJAX Multi-Item Add to Cart
- Adds multiple variation packages in a single AJAX request.
- No page reload.
- Configurable post-purchase redirect: Cart, Checkout, or Stay on Page.
Fully Responsive
- Two-column layout on desktop.
- Single-column stacked layout on mobile.
Translation Ready
- All strings use __() / _e() with the cardgrid-for-woocommerce text domain.
- .pot template included.
Use Cases
- Digital product subscriptions (ChatGPT, Adobe, streaming services)
- SaaS licence packages
- Service bundles (1 Month / 3 Month / 12 Month)
- Any WooCommerce store selling variable products in Bangladesh or globally
Privacy Policy
This plugin does not collect or transmit any personal data. It does not use cookies. No third-party services are contacted.
Installation
- Download the plugin ZIP.
- In your WordPress dashboard go to Plugins > Add New > Upload Plugin.
- Choose the ZIP file and click Install Now.
- Click Activate Plugin.
- Go to Variation Engine in the WordPress sidebar.
- Configure your colours, badge, payment icons, and checkout behaviour.
- Edit any product: set the type to Variable Product, create attributes and add variations, upload a Variation Card Icon per variation, and use the Product Feature Badges meta box to add feature pills.
Frequently asked questions
Does it work with simple products?
Yes. Simple products show a single card.
Will my PPOM / WC Add-ons fields still appear?
Yes. The plugin outputs all fields registered on woocommerce_before_add_to_cart_button inside a dedicated wrapper above the Order Now button.
Is the plugin translation ready?
Yes. All strings use the cardgrid-for-woocommerce text domain. A .pot file is included in the languages/ directory.
Can I customise the colours?
Yes. The settings page (Variation Engine > Settings) includes colour pickers for accent colour, card background, header background, grid background, border, text, grand total, clear-all button, order button, and badge colours.
Can I change the layout for one specific product?
Yes. On any product’s edit page, use the “Layout Template (Variation Engine)” dropdown in the sidebar to override the global layout for that product only.
Does it conflict with page builders like Elementor?
All CSS classes use the vcfw- prefix to avoid conflicts. Known Elementor font CORS issues are automatically resolved on product pages.
Changelog
Fixed: Product image now shows fully — removed aspect-ratio and max-height constraints. Fixed: Image uses height:auto so container adapts to actual image dimensions, no cropping. Fixed: All responsive breakpoints updated — image always shows at natural proportions.
1.9.4
- Added: Section Visibility Controls — independently enable/disable 4 sections (Select Package, Payment Method, Product Image+Info, Description).
- Added: When a section is OFF, WooCommerce default renders for that section instead of hiding.
- Added: Image Lightbox — click product image to view full-size with smooth animation + ESC to close.
- Added: Zoom icon overlay on image hover.
- Fixed: Product image now shows fully — height auto, no aspect-ratio or max-height cropping.
- Fixed: All 4 section toggle combinations work correctly (packages × payment ON/OFF matrix).
- Fixed: Third-party fields (e.g. WhatsApp, PPOM) auto-captured and displayed in payment panel.
- Fixed: Responsive layout across mobile, tablet, desktop.
- Fixed: VCFW_VERSION constant now properly reflects installed version.
- Fixed: Admin page title shows CardGrid for WooCommerce correctly.
1.9.3
Renamed to WPThemePrime Variation Cards for WooCommerce. All inline CSS converted to wp_add_inline_style(). PHP syntax fix. WP.org reviewer issues resolved.
1.9.2
SVG output sanitized with wp_kses(). Stylesheet enqueue fixed. Tested up to WP 6.9.
1.9.1
Plugin Check errors fixed: translators comments, escaping, upgrade notice lengths.
1.9.0
- Major: Complete prefix rebrand — all internal code migrated from aiwbd- to vcfw- (Variation Cards For WooCommerce).
- Changed: All PHP classes renamed VCFW_* (was AIWbd_VE_*).
- Changed: All PHP constants renamed VCFW_* (was AIWBD_VE_*).
- Changed: All CSS classes renamed vcfw-* (was aiwbd-*).
- Changed: All CSS variables renamed –vcfw-* (was –aiwbd-*).
- Changed: All JS selectors and references updated to vcfw-.
- Changed: All file names renamed from aiwbd-ve-* to vcfw-*.
- Audit: 0 deprecated functions, 0 hardcoded paths, 0 dangerous code, 315+ escaping calls verified.
1.8.2
- New: Button height control (40–80px range slider).
- New: Button font size control (12–24px range slider).
- New: Button border radius control (0–40px range slider).
- New: Button border width, style (solid/dashed/dotted/double), and color controls.
- New: Live preview panel for the order button — shows changes instantly before saving.
For developers
Is this your plugin? Show off the numbers.
Add a live badge to your site, docs or GitHub README. It updates on its own — no account needed.
FAQ
CardGrid for WooCommerce: quick answers
Straight answers, pulled from live WordPress.org data.
Live data from WordPress.org · checked Sep 29, 2026
Is CardGrid for WooCommerce free?
Yes. CardGrid for WooCommerce is free to download and use from the official WordPress.org plugin directory.
Is CardGrid for WooCommerce safe to use in 2026?
CardGrid for WooCommerce works, but test it on a staging site before relying on it in 2026. Was last updated 4 months ago, and scores 42/100 on our health check.
How many websites use CardGrid for WooCommerce?
CardGrid for WooCommerce is active on <10 WordPress websites and has been downloaded 355 times since it launched in May 2026. It was downloaded 51 times in the last 30 days.
Does CardGrid for WooCommerce work with WordPress 7.1?
CardGrid for WooCommerce is officially tested up to WordPress 6.9.9, while the latest release is 7.1.2. It may still work, but try it on a staging site first.
What PHP version does CardGrid for WooCommerce need?
CardGrid for WooCommerce requires PHP 7.4 or higher. Most hosts run PHP 8.x today, so it works on any modern WordPress hosting.
When was CardGrid for WooCommerce last updated?
The latest version, 1.9.4, was released on May 18, 2026 (4 months ago).
Who makes CardGrid for WooCommerce?
CardGrid for WooCommerce is developed and maintained by wpthemeprime.
Powered by PageForge
Want thousands of pages that rank like these? Build them in an afternoon.
This directory runs on the same engine as PageForge. Turn any spreadsheet, CSV or API into thousands of fast, SEO-ready WordPress pages — with schema, internal links and AI-written copy baked in.
- CSV, Google Sheets & API data sources
- AI content, schema & internal links per page
- Works with Elementor, Gutenberg, Yoast & Rank Math
- Free on WordPress.org — no credit card
