MonkeyDesign Product Grid for Elementor
| 开发者 | monkeydesign2026 |
|---|---|
| 更新时间 | 2026年7月12日 00:54 |
| PHP版本: | 8.1 及以上 |
| WordPress版本: | 7.0 |
| 版权: | GPLv2 or later |
| 版权网址: | 版权信息 |
详情介绍:
MonkeyDesign Product Grid is a lightweight Elementor widget that displays WooCommerce products in a responsive grid — no Elementor Pro required.
Product selection
- Latest, Featured, Sale, Best Selling, Top Rated, Category, or Manual Selection
- Sort by date, title, price, rating, popularity, or random order
- Responsive columns (separate desktop/tablet/mobile control)
- Adjustable grid gap
- Equal height cards toggle
- Pagination: none, numbered, or Load More
- Product card background, border, corner radius, and shadow controls
- Typography and color controls for the title and price
- Add to Cart button color controls
- Load More button color controls and a customizable button label
- Automatically adopts your active theme's WooCommerce styling (fonts, colors, button look) by default — only overrides what you explicitly customize
- Cached product queries for fast repeat page loads
- Admin settings page for global defaults (product limit, columns, ordering, caching, display options)
安装:
- Upload to
/wp-content/plugins/ - Activate the plugin
- Edit a page with Elementor and drag in the "Product Grid" widget
屏幕截图:
常见问题:
Does this require Elementor Pro?
No. This widget works entirely with Elementor Free.
Does this require WooCommerce?
Yes, WooCommerce must be installed and active — this widget displays WooCommerce products.
Will the grid match my theme's design?
Yes, by default. Product titles, prices, and the Add to Cart button pick up your active theme's own WooCommerce styling automatically. You can still override colors, typography, and card shape from the widget's Style tab if you want a custom look.
Where do I configure global defaults?
Under the "Product Grid" admin menu item (product limit, default ordering, caching, and display options). Per-widget settings in Elementor always take priority over these.
更新日志:
1.5.20
- Clarified in the admin "Display Defaults" card that "Show ratings" and "Show Add to Cart button" can be overridden per grid with the PRO add-on (via the widget's own "Card Fields" section), while "Show out of stock products" always stays a site-wide setting since it affects which products are queried in the first place.
- Grid Gap is now a proper row/column gap control (matching Elementor's own native containers), instead of a single slider controlling both directions at once.
- Fixed the Price Color control not affecting the actual price digits — WooCommerce wraps the price in its own inner element, which most themes color directly, so only styling the outer wrapper had no visible effect.
- Fixed row spacing in the grid being larger than the configured Grid Gap value — some themes (e.g. Astra) add their own margin to WooCommerce product list items, left over from float-based grid layouts, which added on top of this plugin's own Grid Gap control.
- Fixed a phpcs:ignore comment that lost its association with the code line it was meant to cover, causing Plugin Check to report a false-positive nonce-verification warning.
- Security hardening per WP.org review feedback: raw client-submitted data (the AJAX Load More query, and the Settings page form) is now sanitized immediately at the point it enters the plugin, before it reaches any internal extensibility hook — previously a hooked callback could have received unsanitized input.
- Renamed the PRO add-on's folder/text domain to
monkeydesign-product-grid-for-elementor-proto match the FREE plugin's new slug, and updated the Freemiuspremium_slugreference accordingly. No functional changes.
- Renamed the plugin's text domain and folder to
monkeydesign-product-grid-for-elementorto match the slug assigned by the WordPress.org plugin review team (the originally requestedmonkeydesign-product-gridwas already taken). No functional changes. - Added self as a listed contributor.
- Fixed the previous height fix not actually taking effect: a stronger min-height rule elsewhere was still winning, so the Compare table's text field and color pickers still rendered a few pixels apart. Now pinned with !important so it holds.
- Gave the Compare table's color pickers an explicit height matching the text field beside them — native color inputs render shorter than text inputs by default, which threw off the row's alignment.
- Fixed the Compare table's button settings layout: the text field and its three color pickers now share a single row (text field fills the remaining space, colors keep their compact native size), instead of the text field sitting on its own row above them.
- Tidied up the Compare table's admin appearance settings: the three color pickers for each button (View Product / Remove) now sit side by side in one row, and each button's text field spans the full width.
- Split the Compare table's "Button Background/Text/Hover Color" admin settings into separate "View Product Button" and "Remove Button" groups — the existing controls only ever styled the "View product" button, so the "Remove" button had no configurable color at all until now.
- Added a custom button text field for both the "View Product" and "Remove" buttons in the Compare table (previously hardcoded).
- Restyled the Card Actions shortcode note: 6px spacing between lines, and each shortcode now shown as a dark badge with white text so it stays legible in both the light and dark Elementor panel themes (plain white text would have disappeared against a light panel).
- Replaced the sort dropdown's solid triangle arrow with a subtler, thin outlined chevron.
- Fixed the PRO Result Bar's result count not sitting on the same vertical center line as the sort dropdown — a theme-level paragraph margin (e.g. Astra's content-area spacing) was pushing it down; a more specific selector now overrides it.
- Added a custom dropdown arrow to the sort dropdown, consistent across browsers (replaces each browser's own native arrow) without widening the field.
- Fixed the PRO Result Bar's sort dropdown wrapping onto its own line below the result count instead of sitting beside it (like WooCommerce's own shop toolbar) — some themes apply a blanket
select { width: 100% }rule that the dropdown had no explicit width to override.
- Split the combined "Wishlist, Compare & Quick View Buttons" Style-tab section into three independent sections (one per button), each only appearing when its own button is actually available on the grid — fixes a usability regression from 1.5.3 where all three were bundled together regardless of which were enabled.
- Added Style-tab color and border-radius controls for the PRO add-on's Wishlist, Compare, and Quick View card icon buttons, matching the customization already available for the Add to Cart and Load More buttons.
- Added a PRO "Result Bar" feature: an optional result count ("Showing 1–8 of 24 results") and sort dropdown shown above a paginated grid, each with its own master switch and per-grid Show/Hide control. Sorting reloads the page with the new order, the same way WordPress core's own shop sorting works, so it behaves correctly regardless of pagination type.
- Moved the PRO add-on's Quick View modal styling (background, border, radius, padding, shadow, and now its own Add to Cart button colors) from the admin Settings page into a native "Quick View" section on the Product Grid widget's own Style tab, matching where every other style control already lives. It still targets the shared modal element directly (not per-widget-scoped), since the modal itself is one DOM node shared by the whole page.
- Fixed a bug found during hands-on testing: adding/removing a product from a Wishlist or Compare page didn't update an already-rendered
[monkeydesign_wishlist]/[monkeydesign_compare]shortcode elsewhere on the same page without a manual refresh. Root cause: PHP'ssetcookie()doesn't update the current request's cookie data, so the shortcode was re-rendered from the pre-toggle state. The PRO add-on's toggle response now carries the freshly rendered list, refreshed on the page immediately. - Added Quick View modal padding control and Compare table button color controls (background, text, hover) to the admin settings.
- Added color controls and a customizable label for the "Load More" pagination button (Style and Content tabs).
- Fixed several PRO add-on issues found during hands-on testing: its CSS/JS now loads reliably in the Elementor editor preview and on the wishlist/compare shortcode pages (previously only loaded if triggered by a product grid elsewhere on the page); un-wishlisting/un-comparing a product now updates the visible list immediately instead of requiring a manual page refresh; the Quick View button no longer overlaps the Sale badge.
- Replaced the "Enable Infinite Scroll" master switch with a per-grid "Load More Behavior" choice in Elementor — having two independent site-wide switches let both be turned on at once even though they're mutually exclusive per grid.
- Added a
ProductDTO::$shortDescriptionfield and supporting template markup, used by the PRO add-on's new per-grid Card Fields controls.
- Extended the
monkeydesign_product_card_datafilter to receive the current display options as a third argument, so a PRO add-on's card-level features can be controlled per grid instance, not only site-wide. No behavior change for sites without the PRO add-on.
- Added internal extensibility needed for the upcoming PRO add-on: a
monkeydesign_settings_sanitizefilter so PRO's own settings persist correctly, aProductRendererService::renderCards()method for rendering product batches without a full page reload, and pagination markup that a PRO AJAX/infinite-scroll layer can hook into. No behavior change for sites without the PRO add-on.
- The "Get PRO" link now points to the correct language version of the product page (Hungarian or English) based on the site's locale.
- Moved the admin settings page to its own top-level menu item (was nested under WooCommerce).
- Wired up two settings that were previously saved but ignored: "Lazy Load Images" now adds
loading="lazy"to product images, and "Requires Plugins" is now declared in the plugin header for automatic dependency prompts. - Added the documented extension hooks/filters (
monkeydesign_before_product_query,monkeydesign_product_query_args,monkeydesign_product_card_data, and others) so Pro features can hook in without modifying core files. - Added widget search keywords in the Elementor panel.
- Various documentation/code consistency fixes found during a full pre-submission review.
- Security hardening pass: fixed missing output escaping and input unslashing, added uninstall cleanup, added a missing-dependency admin notice.
- Prepared Freemius licensing wiring (inactive until real credentials are configured).
- Generated the .pot translation template.
- Fixed a Pro Settings label mismatch ("AJAX Load More" vs "AJAX Filtering").
- Initial development build: Elementor widget, full query engine, layout/style controls, admin settings, query caching.