Beschrijving
Stop guessing how many columns will show on a phone.
Responsive Columns lets you set an exact column count for four breakpoints right inside the core block inspector.
Key features
- Desktop / Tablet-Landscape / Tablet-Portrait / Mobile
Pick 1 – 6 columns for each breakpoint. - Theme-aware gaps
Reads--wp--style--block-gap, lets you tweak Gap X and Gap Y without hard-coding pixels. - Masonry layout for Query Loop (Grid) — one click, zero jQuery.
- Works with core/Columns and core/Post Template (Query Loop Grid).
- Lightweight — one helper class, pure CSS variables; editor JS ≈ 3 kB.
How it works
The plugin adds one class has-s1-rc-columns and these CSS variables:
--s1-rc-columns-mobile-portrait
--s1-rc-columns-mobile-landscape
--s1-rc-columns-tablet-portrait
--s1-rc-columns-tablet-landscape
--s1-rc-columns-desktop /* auto-added for Masonry /
--s1-rc-gap-x / horizontal /
--s1-rc-gap-y / vertical, falls back to X */
Your theme keeps its own display:grid / flex rules —
only grid-template-columns and gaps are overridden inside media queries.
Deactivate the plugin and everything gracefully falls back to the default block behaviour.
Schermafdrukken
Four-column grid on desktop with Responsive Columns panel open. 
Two-column tablet view showing adjusted breakpoints. 
Single-column mobile view after resizing slider.
Installatie
- Upload the folder to
/wp-content/plugins/or search “Responsive Columns” in Plugins Add New. - Activate the plugin.
- Select any Columns block (or Query Loop Grid), open the sidebar and find the “Responsive Columns” panel.
FAQ
-
Does it work with Reusable Blocks and Patterns?
-
Yes. Settings are stored as native block attributes, so patterns and reusable blocks keep their responsive values.
-
Will my layout break if I uninstall the plugin?
-
No. The extra attributes are simply ignored and columns revert to the default “stack on mobile”.
Beoordelingen
Er zijn geen beoordelingen voor deze plugin.
Bijdragers & ontwikkelaars
“Responsive Columns” is open source software. De volgende personen hebben bijgedragen aan deze plugin.
Bijdragers
Vertaal “Responsive Columns” naar jouw taal.
Interesse in ontwikkeling?
Bekijk de code, haal de SVN repository op, of abonneer je op het ontwikkellog via RSS.
Changelog
1.0.0
- Initial public release — breakpoints, Gap X / Y and Masonry option.