Adds column order and direction controls for mobile layouts in the WordPress block editor.
Mai Column Order enhances the WordPress block editor by adding responsive column ordering capabilities. This plugin allows you to:
- Reverse the direction of all columns on mobile views
- Change the order of individual columns on mobile views
- Maintain desktop layouts while customizing mobile experiences
Perfect for creating responsive layouts where content needs to appear in a different order on smaller screens.
- Upload the plugin files to the
/wp-content/plugins/mai-column-orderdirectory, or install the plugin through the WordPress plugins screen directly. - Activate the plugin through the 'Plugins' screen in WordPress
- Use the Column block settings sidebar to configure column order and direction for mobile views
After installation:
- Add or edit a Columns block in the WordPress editor
- Select the parent Columns block to enable direction reversal for mobile views
- Select individual Column blocks to set their order on mobile using the sidebar controls
- Preview your page to see the responsive ordering in action
Yes! Select the parent Columns block and toggle "Reverse direction on mobile" in the sidebar.
Select the individual Column block and use the "Order on mobile" control in the sidebar. Lower numbers appear first, higher numbers appear last.
- Column order controls in the block editor sidebar
- Mobile direction controls for column groups
This plugin adds custom attributes and styles to core Column and Columns blocks. It uses CSS order properties and flex-direction to achieve responsive reordering without affecting the semantic HTML structure.
For developers, the plugin:
- Adds custom attributes to core blocks
- Implements responsive CSS using modern CSS features
- Uses React components for the block editor interface