{"id":233054,"date":"2025-05-14T13:36:56","date_gmt":"2025-05-14T13:36:56","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/responsive-columns-block-editor\/"},"modified":"2025-10-27T12:08:55","modified_gmt":"2025-10-27T12:08:55","slug":"responsive-columns","status":"publish","type":"plugin","link":"https:\/\/kea.wordpress.org\/plugins\/responsive-columns\/","author":23289986,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_crdt_document":"","version":"1.1.1","stable_tag":"1.1.1","tested":"6.8.5","requires":"6.4","requires_php":"7.4","requires_plugins":null,"header_name":"Responsive Columns","header_author":"Specia1ne","header_description":"Adaptive column counts, X\/Y gaps and optional Masonry layout for core\/Columns and Query Loop (Grid).","assets_banners_color":"","last_updated":"2025-10-27 12:08:55","external_support_url":"","external_repository_url":"","donate_link":"https:\/\/specia1ne.com","header_plugin_uri":"https:\/\/wordpress.org\/plugins\/responsive-columns\/","header_author_uri":"https:\/\/specia1ne.com\/","rating":0,"author_block_rating":0,"active_installs":50,"downloads":656,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1.0.0":{"tag":"1.0.0","author":"specia1ne","date":"2025-05-14 13:43:14"},"1.1.0":{"tag":"1.1.0","author":"specia1ne","date":"2025-10-26 08:36:56"},"1.1.1":{"tag":"1.1.1","author":"specia1ne","date":"2025-10-27 12:08:55"}},"upgrade_notice":{"1.1.1":"

This patch improves theme gap detection, default handling, and Masonry reliability while keeping existing layouts visually unchanged.<\/p>","1.1.0":"

This update improves code safety, performance, accessibility, and build stability without changing any existing functionality.<\/p>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3293306,"resolution":"128x128","location":"assets","locale":""},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3293306,"resolution":"256x256","location":"assets","locale":""}},"assets_banners":[],"assets_blueprints":{},"all_blocks":[],"tagged_versions":["1.0.0","1.1.0","1.1.1"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3293306,"resolution":"1","location":"assets","locale":""},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3293306,"resolution":"2","location":"assets","locale":""},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3293306,"resolution":"3","location":"assets","locale":""}},"screenshots":{"1":"Four-column grid on desktop with Responsive Columns panel open.","2":"Two-column tablet view showing adjusted breakpoints.","3":"Single-column mobile view after resizing slider."},"jetpack_post_was_ever_published":false},"plugin_section":[],"plugin_tags":[148857,854,173822,148076,606],"plugin_category":[],"plugin_contributors":[242271],"plugin_business_model":[],"class_list":["post-233054","plugin","type-plugin","status-publish","hentry","plugin_tags-block-editor","plugin_tags-columns","plugin_tags-css-grid","plugin_tags-gutenberg","plugin_tags-responsive","plugin_contributors-specia1ne","plugin_committers-specia1ne"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/responsive-columns\/assets\/icon-128x128.png?rev=3293306","icon_2x":"https:\/\/ps.w.org\/responsive-columns\/assets\/icon-256x256.png?rev=3293306","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/responsive-columns\/assets\/screenshot-1.png?rev=3293306","caption":"Four-column grid on desktop with Responsive Columns panel open."},{"src":"https:\/\/ps.w.org\/responsive-columns\/assets\/screenshot-2.png?rev=3293306","caption":"Two-column tablet view showing adjusted breakpoints."},{"src":"https:\/\/ps.w.org\/responsive-columns\/assets\/screenshot-3.png?rev=3293306","caption":"Single-column mobile view after resizing slider."}],"raw_content":"\n

\n

See exactly how many columns appear on every device.<\/strong> Responsive Columns extends the core Columns block and the Query Loop (grid) template with precise controls for four breakpoints, X\/Y gap management, and an optional Masonry layout.<\/p>\n<\/blockquote>\n\n

Key features<\/h3>\n\n
    \n
  • Four responsive breakpoints.<\/strong> Fine-tune Desktop, Tablet landscape, Tablet portrait, and Mobile column counts (1\u20136 columns).<\/li>\n
  • Theme-aware gaps.<\/strong> Uses your theme's block gap as a starting point and lets you override horizontal and vertical spacing independently.<\/li>\n
  • One-click Masonry for Query Loop (Grid).<\/strong> No jQuery, automatically reflows posts as your content changes.<\/li>\n
  • Native block experience.<\/strong> Works directly inside core\/Columns and core\/Post Template (grid) so patterns, reusable blocks, and theme.json continue to work.<\/li>\n
  • Lightweight.<\/strong> Modern ES modules (~4 kB compressed) and CSS custom properties. Editor assets load only when needed.<\/li>\n<\/ul>\n\n

    How it works<\/h3>\n\n

    The plugin adds a has-s1-rc-columns<\/code> class and a handful of CSS custom properties:<\/p>\n\n

    --s1-rc-columns-mobile-portrait\n--s1-rc-columns-mobile-landscape\n--s1-rc-columns-tablet-portrait\n--s1-rc-columns-tablet-landscape\n--s1-rc-columns-desktop \/* auto-added for Masonry \/\n--s1-rc-gap-x \/ horizontal \/\n--s1-rc-gap-y \/ vertical, falls back to X *\/\n<\/code><\/pre>\n\n
    Your theme's layout styles stay in control \u2014 Responsive Columns only adjusts grid-template-columns<\/code> and gap values inside media queries. Disable or uninstall the plugin and the columns fall back to WordPress defaults without leaving orphan styles behind.<\/p>\n\n
    Editor experience<\/h3>\n\n
      \n
    • Inspector panel with device icons, tooltips, and numeric inputs for precise values.<\/li>\n
    • Theme gap detection with a reset button to restore defaults in one click.<\/li>\n
    • Gap linking lets you mirror vertical spacing or split it into a custom row gap.<\/li>\n
    • Masonry toggle explains prerequisites (Query Loop + Grid layout with a desktop column count).<\/li>\n<\/ul>\n\n
      Accessibility & localisation<\/h3>\n\n
        \n
      • All UI controls are keyboard accessible and include human-readable labels.<\/li>\n
      • Strings are translation ready via the responsive-columns<\/code> text domain and JSON translation support.<\/li>\n<\/ul>\n\n\n
          \n
        1. Upload the plugin folder to \/wp-content\/plugins\/<\/code> or search \u201cResponsive Columns\u201d in Plugins \u2192 Add New<\/em>.<\/li>\n
        2. Activate the plugin.<\/li>\n
        3. Select a Columns<\/strong> block or Query Loop \u2192 Grid<\/strong>, open the sidebar, and expand the Responsive Columns<\/strong> panel.<\/li>\n<\/ol>\n\n\n
          \n
          Does it work with Reusable Blocks and Patterns?<\/h3><\/dt>\n
          Yes. Responsive settings are saved as native block attributes and persist across reusable blocks, synced patterns, and template parts.<\/p><\/dd>\n
          Will my layout break if I uninstall the plugin?<\/h3><\/dt>\n
          No. Extra attributes are ignored by core blocks once the plugin is removed. Your content reverts to the default responsive behaviour (stacking on smaller screens).<\/p><\/dd>\n\n<\/dl>\n\n\n
          1.1.1<\/h4>\n\n
            \n
          • Fixes & Defaults:<\/strong>
            \n\u201cReset responsive settings\u201d now restores gap values directly from the active theme (theme.json<\/code>).
            \nNew blocks initialize with the correct default gap from the theme or a reliable fallback (24px<\/code>).<\/p><\/li>\n
          • UX Improvements:<\/strong>
            \nColumn and row gaps now stay synchronized consistently when linked (X \u2194 Y).
            \nEditor controls always display real pixel values based on the theme rather than placeholders.<\/p><\/li>\n
          • Masonry Guard:<\/strong>
            \nAdded a responsive validation layer that only enables Masonry for valid Query Loop grid layouts.
            \nThe toggle now includes clear inline guidance and automatic reset behavior when prerequisites are not met.<\/p><\/li>\n<\/ul>\n\n
            1.1.0<\/h4>\n\n
              \n
            • Security & Stability:<\/strong>
              \nReworked the HTML filter to use WP_HTML_Tag_Processor<\/code> instead of regex, ensuring safe and predictable markup updates.
              \nHardened asset loading \u2014 scripts now read dependencies and versions directly from index.asset.php<\/code> with graceful fallbacks.<\/p><\/li>\n
            • Quality & Performance:<\/strong>
              \nOptimized front-end Masonry with clamped gap values, rate-limited resize handling, and automatic observer cleanup to prevent layout thrashing.
              \nStreamlined attribute updates in the editor inspector, reducing redundant renders and simplifying logic.<\/p><\/li>\n
            • Accessibility & i18n:<\/strong>
              \nAdded clearer screen-reader descriptions for gap sliders and improved help text for Masonry controls.
              \nVerified full localization support.<\/p><\/li>\n<\/ul>\n\n
              1.0.0<\/h4>\n\n
                \n
              • Initial public release \u2014 breakpoints, gap controls, and Masonry option.<\/li>\n<\/ul>","raw_excerpt":"Adaptive column counts, gap controls, and Masonry layouts for core Columns and Query Loop blocks \u2014 no custom blocks required.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/233054","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=233054"}],"author":[{"embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/specia1ne"}],"wp:attachment":[{"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=233054"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=233054"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=233054"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=233054"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=233054"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/kea.wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=233054"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}