EffortLess Columns to Carousel

The plugin adds a Carousel panel to the block sidebar of the core Columns block. When "Display as carousel" is switched on, the front-end output of that block changes from a grid to a horizontally scrolling row using CSS scroll-snap. A small JavaScript file adds arrows, dots, keyboard navigation and optional autoplay. The plugin does not add a new block, so existing content is not changed and switching the option off restores the normal columns. The CSS and JavaScript files are loaded only on pages that contain a Columns block with the carousel switched on. Settings (Carousel panel in the block sidebar)

• Display as carousel - Off by default. Turns the block into a carousel.
• Slides per view (desktop) - 1 to 6, default 3. Applies above 781px wide.
• Slides per view (tablet) - 1 to 6, default 2. Applies from 601px to 781px.
• Slides per view (mobile) - 1 to 6, default 1. Applies at 600px and below.
• Autoplay - Off by default. Advances one slide at a time. Pauses while the pointer or keyboard focus is inside the carousel. Not used when the visitor's system requests reduced motion.
• Delay (ms) - Shown when autoplay is on. 1000 to 30000, default 4000. Autoplay stops for good once the visitor uses the arrows, dots or keyboard, or touches or drags the slides.
• Show arrows - On by default. Previous and next buttons.
• Show dots - On by default. One button per scroll position.
• Loop - Off by default. When on, the next button on the last position returns to the first, and previous on the first goes to the last. Autoplay always returns to the first slide after the last.

1. Upload the plugin folder to /wp-content/plugins/ or install the zip under Plugins > Add New.
2. Activate the plugin under Plugins.
3. Edit a page and add a Columns block with several columns.
4. Select the Columns block, open the block sidebar and expand the Carousel panel.
5. Switch on "Display as carousel", choose the options, then update the page.

A short help page is available under Settings > Columns Carousel. The plugin has no global settings.

1.0.8

• Added bundled translation files: a template (.pot) and translations for Spanish, Traditional Chinese, Korean, French, Japanese, German, Italian and Brazilian Portuguese. The JavaScript strings of the editor script are included in the template.

1.0.7

• Fix: the gap between slides now matches the gap the theme applies to the Columns block.
• Fix: with both arrows and dots switched off, the scrollbar stays visible so mouse users can still scroll.
• Fix: keyboard focus stays on an arrow button when it reaches the first or last slide.
• Fix: on classic themes, the carousel stylesheet loads in the page head for the current post, so the columns no longer flash as a grid first.
• Fix: Columns blocks with a background colour keep their inner padding when slides snap into place.

1.0.6

• Fix: the "Carousel" label in the editor no longer takes up a column slot in the block's row, and it is now translatable.
• Fix: touching or dragging the slides ends autoplay, so it no longer moves the row under a swiping visitor.
• Fix: arrows and dots are hidden when every column already fits in view.
• Fix: arrow and dot styles hold up against theme button styles (sizes, shadows, hover colours).
• Fix: arrows are centred on the slides rather than on the slides plus the dots.
• Fix: the scrollbar stays visible when JavaScript is not running, so mouse users can still scroll.
• Fix: a carousel is never set up twice on the same block.
• Fix: a negative column gap is ignored; a gap of 0 and preset spacing values are accepted.
• Change: arrows and dots show a visible focus outline for keyboard users.

1.0.5

• Fix: right-to-left layouts: arrows, arrow glyphs and keyboard direction are mirrored.
• Fix: autoplay pauses while the carousel is offscreen or the browser tab is hidden.
• Fix: fast repeated clicks on the arrows keep advancing during a smooth scroll.

1.0.4

• Fix: slide text colour is no longer forced to dark grey, which made text unreadable on dark themes.
• Fix: alignment classes (wide, full, left, right, center) on the Columns block are kept when the carousel wraps it.
• Fix: the gap between slides now follows the block's own gap setting and the theme default.
• Fix: autoplay no longer stays paused on touch screens after a tap.
• Fix: the first slide position ignores the block's padding.
• Change: autoplay stops once the visitor uses the arrows, dots or keyboard.
• Change: arrow and dot labels are translatable.
• Change: the "Carousel" label in the editor is now shown inside the editor canvas.
• Change: the help page uses the screen ID returned by WordPress.

1.0.3

• Change: plugin author name updated.

1.0.2

• Update: Tested up to WordPress 7.1.

1.0.1

• Fix: carousel settings were not saved with the post, so the carousel, arrows and dots did not appear on the front end.
• Fix: carousel layout now overrides the core Columns mobile stacking styles.
• Fix: slides-per-view detection when columns have a large gap.

1.0.0

• Initial release.