WordPress.org
Get WordPress
WordPress.org

Plugin Directory

Gridpress – Grid Layout Design

Gridpress – Grid Layout Design

By Daylan
Download

Description

Gridpress is a flexible and powerful WordPress grid plugin that lets you display any WordPress post type — posts, pages, products, portfolios, team members, testimonials, and more — in beautiful, responsive grid layouts. Choose from 30 unique card styles, configure everything through a clean admin interface, and embed your grid anywhere with a simple shortcode.

Whether you’re building a blog, a WooCommerce store, a portfolio site, or a company website, Gridpress gives you the tools to present your content in a visually compelling, mobile-friendly grid layout — without writing a single line of code.

🎨 30 Pre-Built Grid Styles

Gridpress ships with 30 ready-to-use grid card designs covering a wide variety of use cases:
* Blog / Magazine styles – with post date, author, comments count, categories & tags
* Portfolio / Gallery styles – clean image-focused layouts with hover effects
* Video gallery styles – dedicated video card designs with views & likes counters
* Product-ready styles – layouts optimized for WooCommerce and eCommerce
* Creative / branding styles – multi-image cards, background color cards, Behance-linked cards and more

📦 Dual Data Source Support

  • Posts Data – Pull content automatically from any registered WordPress post type. Filter by taxonomy terms, set order, sort direction, and number of posts per grid.
  • Manual Data – Build grids with hand-crafted items. Add custom titles, images, URLs, video files or YouTube/Vimeo links, dates, authors, categories, excerpts, views, likes, and more — entirely independent of your site’s posts.

🔧 Full Grid Configuration

Each grid is configured through a tabbed settings panel:
* General Settings: Select one of 30 card styles
* Data Source: Posts data vs. manual items; post type, taxonomy filters, order, pagination
* Layout: Simple or Masonry grid; number of columns (2/3/4/6); hover effects
* Display Settings: Show/hide excerpt, button, date, author, comments, categories/tags; top taxonomy filters
* Typography: Custom font size, line height, font style, font weight and color for text elements

🧩 Integrations

  • Includes a native Elementor widget
  • Includes WPBakery Page Builder element integration

Third-Party Libraries

This plugin includes third-party libraries used under their respective licenses.

Select2

Files included:
– js/select2/select2.full.min.js
– css/select2/select2.full.min.css

Source: https://select2.org/
Repository: https://github.com/select2/select2
License: MIT License

Copyright (c) Select2 contributors

Demo Data Import (Recommended)

To help you get started quickly with sample layouts and structures, you can download and install our companion demo data plugin:
* Download URL: https://codestap.com/plugins/gridpress-demo-data.zip
* Instructions: Upload this zip file as a standard WordPress plugin, activate it, and it will automatically populate your website with complete demo data to showcase the various grid layouts.

Screenshots

General Settings Dashboard: Easily configure global variables, default font settings, container styles, and global layout rules.
General Settings Dashboard: Easily configure global variables, default font settings, container styles, and global layout rules.
Add New Grid Layout Interface: Create and customize a brand-new grid canvas with our interactive, tab-based control panel.
Add New Grid Layout Interface: Create and customize a brand-new grid canvas with our interactive, tab-based control panel.
Grid Shortcode Copy Panel: Generate and grab unique system shortcodes instantly upon saving any layout.
Grid Shortcode Copy Panel: Generate and grab unique system shortcodes instantly upon saving any layout.
Embedding Grid Shortcode into a Page: Paste the shortcode block effortlessly into standard Gutenberg editor paragraphs, Classic editors, or custom builders.
Embedding Grid Shortcode into a Page: Paste the shortcode block effortlessly into standard Gutenberg editor paragraphs, Classic editors, or custom builders.
Grid Layout Style 1: Clean minimalist blogging design with meta layout.
Grid Layout Style 1: Clean minimalist blogging design with meta layout.
Grid Layout Style 2: Traditional masonry cards tailored for editorial content.
Grid Layout Style 2: Traditional masonry cards tailored for editorial content.
Grid Layout Style 3: Compact card overview with crisp typography.
Grid Layout Style 3: Compact card overview with crisp typography.
Grid Layout Style 4: Creative background overlay card variant.
Grid Layout Style 4: Creative background overlay card variant.
Grid Layout Style 5: High-impact modern grid interface.
Grid Layout Style 5: High-impact modern grid interface.
Grid Layout Style 6: Smooth grid layout optimized for multi-author entries.
Grid Layout Style 6: Smooth grid layout optimized for multi-author entries.
Grid Layout Style 7: Borderless creative card framework.
Grid Layout Style 7: Borderless creative card framework.
Grid Layout Style 8: Bold boxed masonry template.
Grid Layout Style 8: Bold boxed masonry template.
Grid Layout Style 9: Modern magazine-inspired card aesthetic.
Grid Layout Style 9: Modern magazine-inspired card aesthetic.
Grid Layout Style 10: Seamless content masonry showcase.
Grid Layout Style 10: Seamless content masonry showcase.
Grid Layout Style 11: Portfolio grid layout highlighting full-resolution imagery.
Grid Layout Style 11: Portfolio grid layout highlighting full-resolution imagery.
Grid Layout Style 12: Gallery interface complete with sleek hover text overlays.
Grid Layout Style 12: Gallery interface complete with sleek hover text overlays.
Grid Layout Style 13: Behance-inspired creative portfolio layout.
Grid Layout Style 13: Behance-inspired creative portfolio layout.
Grid Layout Style 14: Modern dark-theme photography grid structure.
Grid Layout Style 14: Modern dark-theme photography grid structure.
Grid Layout Style 15: Media-first showcase grid focusing on project details.
Grid Layout Style 15: Media-first showcase grid focusing on project details.
Grid Layout Style 16: Balanced grid interface for dual-column portfolios.
Grid Layout Style 16: Balanced grid interface for dual-column portfolios.
Grid Layout Style 17: Video gallery card layout with play actions and metrics tracker.
Grid Layout Style 17: Video gallery card layout with play actions and metrics tracker.
Grid Layout Style 18: Inline responsive video preview card layout.
Grid Layout Style 18: Inline responsive video preview card layout.
Grid Layout Style 19: YouTube & Vimeo standard streaming gallery card.
Grid Layout Style 19: YouTube & Vimeo standard streaming gallery card.
Grid Layout Style 20: Cinematography block portfolio style card.
Grid Layout Style 20: Cinematography block portfolio style card.
Grid Layout Style 21: Product-ready card layout with integrated Add-to-Cart formatting.
Grid Layout Style 21: Product-ready card layout with integrated Add-to-Cart formatting.
Grid Layout Style 22: eCommerce store listing optimization grid card.
Grid Layout Style 22: eCommerce store listing optimization grid card.
Grid Layout Style 23: Multi-column product display box with sales flags.
Grid Layout Style 23: Multi-column product display box with sales flags.
Grid Layout Style 24: Minimalist boutique product presentation grid item.
Grid Layout Style 24: Minimalist boutique product presentation grid item.
Grid Layout Style 25: Team & Testimonial profile block grid system.
Grid Layout Style 25: Team & Testimonial profile block grid system.
Grid Layout Style 26: Author profile introduction layout array.
Grid Layout Style 26: Author profile introduction layout array.
Grid Layout Style 27: Multi-image collage block layout.
Grid Layout Style 27: Multi-image collage block layout.
Grid Layout Style 28: Floating text overlay card design framework.
Grid Layout Style 28: Floating text overlay card design framework.
Grid Layout Style 29: Monochromatic split-card presentation format.
Grid Layout Style 29: Monochromatic split-card presentation format.
Grid Layout Style 30: Clean modern list-to-grid hybrid card layout.
Grid Layout Style 30: Clean modern list-to-grid hybrid card layout.
Grid Layout Style 31: Abstract background-color text layout block.
Grid Layout Style 31: Abstract background-color text layout block.

Installation

  1. Upload the plugin files to the /wp-content/plugins/gridpress-grid-layout-design directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress.
  3. The Setup Wizard will launch automatically — follow the steps to configure your global settings.
  4. Navigate to Grids -> Add New to create your first grid.
  5. Choose a style, configure data source and display settings, then copy the shortcode.
  6. Paste the shortcode [gridpress_grid id="YOUR_ID"] into any page or post.

FAQ

Does Gridpress work with any WordPress theme?

Yes. Gridpress is built using standard WordPress APIs and outputs clean HTML. It works with any properly coded theme.

Can I display WooCommerce products in a grid?

Yes. Any registered post type — including WooCommerce product — can be selected as the data source once it is enabled in Global Settings.

Does it support Elementor?

Yes. Gridpress includes a native Elementor widget so you can add grids directly from the Elementor editor panel.

Can I create a grid with custom items?

Yes. Use the Manual Data source to add items with custom titles, images, video URLs, dates, authors, and more.

What pagination options are available?

Page Numbers, Load More (AJAX button), and Infinite Scroll (AJAX auto-load on scroll).

Can I export and import grid settings?

Yes. Use the Import/Export tab in any grid’s settings to download a JSON backup or upload one to restore settings.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“Gridpress – Grid Layout Design” is open source software. The following people have contributed to this plugin.

Contributors

Translate “Gridpress – Grid Layout Design” into your language.

Interested in development?

Browse the code, check out the SVN repository, or subscribe to the development log by RSS.

Changelog

1.0.0

  • Initial release.

Meta

Ratings

No reviews have been submitted yet.

Your review

See all reviews

Contributors

Support

Got something to say? Need help?

View support forum