Description

Grid of Content and Products for Elementor 1.0.5

One-line: Easily display posts, pages, and WooCommerce products in stylish, responsive grid layouts using Elementor.

📝 Description

Grid of Content and Products for Elementor is a powerful Elementor addon that allows you to create flexible grid layouts for showcasing blog posts, custom content, or WooCommerce products. With multiple layout styles, advanced filters, and customization options, it’s perfect for blogs, online stores, and portfolio websites.

This addon is designed to be lightweight, responsive, and fully compatible with Elementor’s drag-and-drop builder — meaning you can configure your grids without touching a single line of code.

✨ Key Features

• 🧩 Elementor Widget – drag-and-drop grid builder inside Elementor.
• 🛍️ WooCommerce Ready – display products with title, price, add-to-cart, rating, and sale badge.
• 📰 Content Support – showcase posts, pages, or custom post types in a uniform grid.
• 🎨 Layout Options – choose between masonry, classic, metro, and equal-height grid styles.
• 🔍 Filter & Sorting – category filters, keyword search, and sort by date, popularity, or custom order.
• 📱 Responsive Controls – set different column counts for desktop, tablet, and mobile.
• 🖼️ Image Handling – featured image display with hover effects and lazy loading.
• 🎛️ Style Customization – control spacing, typography, colors, hover animations, and overlays.
• 🔗 Dynamic Links – auto-link to posts, pages, or product details.
• 🚀 Lightweight & Fast – optimized queries and caching-friendly structure.

🆕 What’s New in 1.0.5

• ✅ Added “Quick View” option for WooCommerce products.
• ✅ New filter bar style presets (minimal, boxed, underline).
• ✅ Improved lazy loading for faster page performance.
• ✅ Bug fixes for Elementor 3.22+ compatibility.
• ✅ Optimized query handling for large WooCommerce stores.

⚙️ Requirements

• WordPress 5.6+
• Elementor 3.0+ (free or pro)
• WooCommerce (for product grids)
• PHP 7.2+ (tested up to PHP 8.2)

🚀 How to Use

1. Install and activate the plugin.
2. Open Elementor → search for “Grid of Content & Products” widget.
3. Choose Content Source (Posts / Pages / Products / Custom Post Type).
4. Configure columns, filters, pagination, and sorting.
5. Style the grid with Elementor’s options (colors, typography, spacing).
6. Save and publish your layout.

📌 Use Cases

• 🛍️ Shop pages – showcase WooCommerce products with filters and quick view.
• 📰 News/Blog grids – display posts with categories and tags as filters.
• 🎨 Portfolio galleries – show custom post types in clean, modern grids.
• 📄 Page listing – create a visual index of important pages.

🔧 Developer Notes

• Shortcode available:

  [ecp_grid type="product" columns="3" filter="yes"]
  

• Hooks and filters:
  • ecp_grid_query_args → modify query arguments.
  • ecp_grid_item_output → customize item rendering.