Title: Responsive Columns Author: Specia1ne Published: May 14, 2025 Last modified: April 19, 2026 --- Search plugins ![](https://ps.w.org/responsive-columns/assets/icon-256x256.png?rev=3293306) # Responsive Columns By [Specia1ne](https://profiles.wordpress.org/specia1ne/) [Download](https://downloads.wordpress.org/plugin/responsive-columns.1.3.0.zip) * [Details](https://en-nz.wordpress.org/plugins/responsive-columns/#description) * [Reviews](https://en-nz.wordpress.org/plugins/responsive-columns/#reviews) * [Installation](https://en-nz.wordpress.org/plugins/responsive-columns/#installation) * [Development](https://en-nz.wordpress.org/plugins/responsive-columns/#developers) [Support](https://wordpress.org/support/plugin/responsive-columns/) ## Description Responsive Columns extends the core Columns block and the Query Loop grid template with precise controls for desktop, tablet, and mobile breakpoints, flexible X/Y gap management, and an optional Masonry layout. ### Key features * Five responsive breakpoints, including Desktop, tablet, and mobile layouts. * Shared breakpoint switching for column and gap controls. * Theme-aware gaps with separate column and row spacing controls. * Gap inheritance across smaller breakpoints with per-breakpoint overrides. * One-click Masonry for Query Loop grids. * Native block support for core/Columns and core/Post Template. * Lightweight output based on CSS custom properties and small front-end assets. ### How it works The plugin adds a `has-s1-rc-columns` class and a small set of CSS custom properties: ``` --s1-rc-columns-mobile-portrait --s1-rc-columns-mobile-landscape --s1-rc-columns-tablet-portrait --s1-rc-columns-tablet-landscape --s1-rc-columns-desktop --s1-rc-gap-x --s1-rc-gap-y ``` Your theme stays in control of the base layout. Responsive Columns only adjusts the number of columns and gaps at the configured breakpoints. If the plugin is removed, the blocks fall back to their normal WordPress behavior without leaving custom block markup behind. ### Editor experience * Responsive controls live inside the block inspector with a shared breakpoint selector. * Gap defaults are pulled from the active theme when possible. * Masonry availability is validated before it can be enabled. * Local reset actions restore responsive values back to the active theme defaults. ### Accessibility and localization * Inspector controls are keyboard accessible and labeled for screen readers. * Strings are translation-ready via the `responsive-columns` text domain. ## Screenshots * [[ * Responsive Columns panel for the core Columns block. * [[ * Query Loop grid with tablet and mobile column controls. * [[ * Masonry toggle with inline validation guidance. ## Installation 1. Upload the plugin folder to `/wp-content/plugins/` or install Responsive Columns from the WordPress plugin directory. 2. Activate the plugin. 3. Select a Columns block or a Query Loop using the grid layout, then open the **Responsive Columns** panel in the sidebar. ## FAQ ### Does it work with reusable blocks and patterns? Yes. Settings are stored as native block attributes, so they remain with reusable blocks, synced patterns, and template parts. ### Will layouts break if I uninstall the plugin? No. WordPress ignores the extra attributes after the plugin is removed, so content falls back to the default responsive behavior. ### Does it depend on a specific theme? No. The plugin extends native core blocks and keeps the active theme in charge of layout styles and spacing tokens. ## Reviews There are no reviews for this plugin. ## Contributors & Developers “Responsive Columns” is open source software. The following people have contributed to this plugin. Contributors * [ Specia1ne ](https://profiles.wordpress.org/specia1ne/) [Translate “Responsive Columns” into your language.](https://translate.wordpress.org/projects/wp-plugins/responsive-columns) ### Interested in development? [Browse the code](https://plugins.trac.wordpress.org/browser/responsive-columns/), check out the [SVN repository](https://plugins.svn.wordpress.org/responsive-columns/), or subscribe to the [development log](https://plugins.trac.wordpress.org/log/responsive-columns/) by [RSS](https://plugins.trac.wordpress.org/log/responsive-columns/?limit=100&mode=stop_on_copy&format=rss). ## Changelog #### 1.3.0 * Added one shared breakpoint switcher for Columns and Gap controls, including Desktop. * Added responsive gap inheritance with per-breakpoint overrides and clearer helper text. * Added smarter local reset actions for columns and gap controls inside the inspector. * Refined the inspector layout, labels, and section spacing for a cleaner editing flow. * Added bundled translations and proper PHP/JS localization loading for editor strings. #### 1.2.0 * Hardened front-end gap sanitization with safer CSS value validation. * Improved theme gap detection for `theme.json` preset and custom CSS variable formats. * Fixed editor preview selectors so responsive styles target only supported blocks. * Improved Masonry stability during image loading, resize events, and dynamic content updates. * Registered shared front-end styles per supported block instead of loading them globally. * Cleaned up project metadata for ongoing maintenance and future releases. #### 1.1.1 * Reset responsive settings now restores gap values directly from the active theme. * New blocks initialize with the correct default gap from the theme or a reliable fallback (`24px`). * Column and row gaps stay synchronized consistently when linked. * Editor controls now display real pixel values based on the theme rather than placeholders. * Added a validation layer that only enables Masonry for valid Query Loop grid layouts. #### 1.1.0 * Reworked the HTML filter to use `WP_HTML_Tag_Processor` instead of regex. * Hardened asset loading by reading script dependencies from `index.asset.php` with graceful fallbacks. * Optimized Masonry with clamped gap values, rate-limited resize handling, and observer cleanup. * Improved accessibility text for gap sliders and Masonry controls. #### 1.0.0 * Initial public release. ## Meta * Version **1.3.0** * Last updated **13 hours ago** * Active installations **40+** * WordPress Version ** 6.4 or higher ** * Tested up to **6.9.4** * PHP Version ** 7.4 or higher ** * Language * [English (US)](https://wordpress.org/plugins/responsive-columns/) * Tags * [block-editor](https://en-nz.wordpress.org/plugins/tags/block-editor/)[columns](https://en-nz.wordpress.org/plugins/tags/columns/) [css grid](https://en-nz.wordpress.org/plugins/tags/css-grid/)[gutenberg](https://en-nz.wordpress.org/plugins/tags/gutenberg/) [responsive](https://en-nz.wordpress.org/plugins/tags/responsive/) * [Advanced View](https://en-nz.wordpress.org/plugins/responsive-columns/advanced/) ## Ratings No reviews have been submitted yet. [Your review](https://wordpress.org/support/plugin/responsive-columns/reviews/#new-post) [See all reviews](https://wordpress.org/support/plugin/responsive-columns/reviews/) ## Contributors * [ Specia1ne ](https://profiles.wordpress.org/specia1ne/) ## Support Got something to say? Need help? [View support forum](https://wordpress.org/support/plugin/responsive-columns/) ## Donate Would you like to support the advancement of this plugin? [ Donate to this plugin ](https://specia1ne.com)