Title: Block Editor: Reverse Columns on Mobile
Author: Mickaël Larguier
Published: <strong>2025 年 1 月 15 日</strong>
Last modified: 2026 年 4 月 6 日

---

搜尋外掛

![](https://ps.w.org/block-editor-columns-reverse/assets/banner-772x250.png?rev=
3222810)

![](https://ps.w.org/block-editor-columns-reverse/assets/icon-256x256.png?rev=3222810)

# Block Editor: Reverse Columns on Mobile

 由 [Mickaël Larguier](https://profiles.wordpress.org/mickaellrg/) 開發

[下載](https://downloads.wordpress.org/plugin/block-editor-columns-reverse.1.0.12.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/block-editor-columns-reverse/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/block-editor-columns-reverse/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/block-editor-columns-reverse/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/block-editor-columns-reverse/#developers)

 [技術支援](https://wordpress.org/support/plugin/block-editor-columns-reverse/)

## 外掛說明

This plugin adds a “Reverse on Mobile” option to the Columns, Row, Stack and Media&
Text blocks in the WordPress Gutenberg block editor.

A common layout challenge: you have two columns on desktop, image on the right, 
text on the left. On mobile, they stack vertically, but the image ends up below 
the text. With this plugin, you can reverse the stacking order so the image appears
first, without touching your desktop layout.

Simply enable the “Reverse on Mobile” toggle in the block settings and the order
is automatically adjusted on small screens.

If this plugin saves you time, [buy me a coffee ☕](https://ko-fi.com/mickaellrg)
or [leave a ★★★★★ review](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/#new-post).
It really helps!

## 螢幕擷圖

[⌊Enabling and disabling the "Reverse on Mobile" option in the block settings panel.⌉⌊
Enabling and disabling the "Reverse on Mobile" option in the block settings panel
.⌉[

Enabling and disabling the “Reverse on Mobile” option in the block settings panel.

## 安裝方式

 1. Download the plugin.
 2. Unzip the downloaded file.
 3. Upload the `block-editor-columns-reverse` folder to the `/wp-content/plugins/` 
    directory.
 4. Activate the plugin through the ‘Plugins’ menu in WordPress.

## 常見問題集

### Which blocks are supported?

The `core/columns`, `core/group` (flex layouts), and `core/media-text` blocks are
supported.

### How do I enable the “Reverse on Mobile” option?

In the block editor, select a Columns, Row, Stack or Media & Text block, then go
to the block settings in the sidebar. You will see an option to “Reverse on Mobile”.

Note: For Row blocks, you must enable “Allow to wrap to multiple lines” in the Layout
settings for the reverse option to appear.

### What is the breakpoint for the mobile view?

The mobile view breakpoint is set at less than 782px, matching the one used for 
the `core/columns` block. When the screen width is 781px or smaller, columns will
reverse their order if the “Reverse on Mobile” option is enabled.

For the `core/media-text` block, the default breakpoint is 600px or below.

## 使用者評論

![](https://secure.gravatar.com/avatar/ab0448d926577f7cf9c23a99f92ae2f2ab398a348e25941b3b345805db029ca4?
s=60&d=retro&r=g)

### 󠀁[Great plugin, very useful](https://wordpress.org/support/topic/great-plugin-very-useful-62/)󠁿

 [Emilie LEBRUN](https://profiles.wordpress.org/emlebrun/) 2025 年 12 月 19 日

This plugin is exactly what I was looking for for my client’s website. It adds perfect
features to adapt blocks for mobile devices, making responsive design so much easier.
I recommend this plugin 3000%! Not only does it work flawlessly, but the plugin 
creator is helpful when you have questions. The excellent support combined with 
the plugin’s functionality makes this an absolute must-have. Definitely deserves
all 5 stars!

![](https://secure.gravatar.com/avatar/7706196e3cb8333028a6b10c57cfbb2713c9d158238c911d7ef79f3c6189922b?
s=60&d=retro&r=g)

### 󠀁[Exactly what I needed](https://wordpress.org/support/topic/exactly-what-i-needed-1002/)󠁿

 [chappers1972](https://profiles.wordpress.org/chappers1972/) 2025 年 8 月 20 日

I needed the facility to reverse columns on mobile devices. With a simple toggle,
it does exactly that.

![](https://secure.gravatar.com/avatar/c45f5391d19bb062b1789215ce8ee87e7dc68467069587f993dc2d0b707118c5?
s=60&d=retro&r=g)

### 󠀁[Does one thing, and does it right](https://wordpress.org/support/topic/does-one-thing-and-does-it-right-2/)󠁿

 [shustus](https://profiles.wordpress.org/shustus/) 2025 年 8 月 10 日

Simple & clean. Functionality should be part of the official wordpress release.

![](https://secure.gravatar.com/avatar/a3d65dbb7c58b7892c698cf0dc222f33f6cd231c13196f29a067dedd4d7e529c?
s=60&d=retro&r=g)

### 󠀁[Simple plugin that does what needs to be done](https://wordpress.org/support/topic/simple-plugin-that-does-what-needs-to-be-done/)󠁿

 [Bernhard Kau](https://profiles.wordpress.org/kau-boy/) 2025 年 6 月 15 日

A nice little plugin that only does what it needs to do. Very useful for anyone,
who does not want to implement a custom solution or write the CSS code with some
manually attached CSS class into their themes.

![](https://secure.gravatar.com/avatar/259f2926a5bcc854bc2cc17e5eac89e0e27d2712db6900665895a252959b204e?
s=60&d=retro&r=g)

### 󠀁[works great](https://wordpress.org/support/topic/works-great-9490/)󠁿

 [stasysd](https://profiles.wordpress.org/stasysd/) 2025 年 1 月 20 日

exactly as described: stacks columns on mobile view in reverse

 [ 閱讀全部 5 則使用者評論 ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/)

## 參與者及開發者

以下人員參與了開源軟體〈Block Editor: Reverse Columns on Mobile〉的開發相關工作。

參與者

 *   [ Mickaël Larguier ](https://profiles.wordpress.org/mickaellrg/)

[將〈Block Editor: Reverse Columns on Mobile〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/block-editor-columns-reverse)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/block-editor-columns-reverse/)、
查看 [SVN 存放庫](https://plugins.svn.wordpress.org/block-editor-columns-reverse/)，
或透過 [RSS](https://plugins.trac.wordpress.org/log/block-editor-columns-reverse/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/block-editor-columns-reverse/)。

## 變更記錄

#### 1.0.12

 * Fixed: Columns block reverse effect was not visible in the editor due to Gutenberg
   adding `is-nowrap` class internally.
 * Support for 7.0.X.

#### 1.0.11

 * Fixed: Column content overflow when padding is set on columns.

#### 1.0.10

 * Fixed: Stack blocks now correctly reverse only on mobile, desktop layout remains
   unaffected.

#### 1.0.9

 * Improved performance: CSS is now loaded only on pages using the reverse feature.
 * Support for 6.9.X.

#### 1.0.8

 * Fixed: Group Row blocks with wrap disabled (nowrap) no longer display the “Reverse
   on mobile” option in settings.
 * Fixed: Group Row blocks with wrap enabled now use `wrap-reverse` to correctly
   reverse elements when they wrap to multiple lines.
 * Fixed: Horizontal alignment (left/right/center/space-between) is now preserved
   when Row blocks wrap.

#### 1.0.7

 * Support for 6.8.X.

#### 1.0.6

 * Refactor responsive styles.
 * Add support for `core/media-text` breakpoint (<= 600px).

#### 1.0.5

 * Removed the ‘Reverse on mobile’ option in `core/group` when the layout is undefined.

#### 1.0.4

 * Fix: Resolved the issue where ‘Reverse on mobile’ always stacked elements on 
   mobile, even when ‘Stack on mobile’ was turned off.
 * Separated CSS for front-end and editor.

#### 1.0.3

 * Added support for `core/media-text` block.
 * Removed the option when the group block is in the default constrained layout.

#### 1.0.2

 * Improvements to avoid potential conflicts with third-party code.

#### 1.0.1

 * Support for 6.7.X.
 * Update text domain for i18n consistency.

#### 1.0.0

 * Initial release of the plugin.

## 中繼資料

 *  版本 **1.0.12**
 *  最後更新 **2 個月前**
 *  啟用安裝數 **500+**
 *  WordPress 版本需求 ** 5.3 或更新版本 **
 *  已測試相容的 WordPress 版本 **7.0**
 *  PHP 版本需求 ** 7.0 或更新版本 **
 *  語言
 * [English (US)](https://wordpress.org/plugins/block-editor-columns-reverse/)
 * 標籤:
 * [block](https://tw.wordpress.org/plugins/tags/block/)[columns](https://tw.wordpress.org/plugins/tags/columns/)
   [gutenberg](https://tw.wordpress.org/plugins/tags/gutenberg/)[responsive](https://tw.wordpress.org/plugins/tags/responsive/)
   [reverse](https://tw.wordpress.org/plugins/tags/reverse/)
 *  [進階檢視](https://tw.wordpress.org/plugins/block-editor-columns-reverse/advanced/)

## 評分

 5 星，滿分為 5 星

 *  [  5 個 5 星使用者評論     ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/?filter=5)
 *  [  0 個 4 星使用者評論     ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/?filter=4)
 *  [  0 個 3 星使用者評論     ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/?filter=3)
 *  [  0 個 2 星使用者評論     ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/?filter=2)
 *  [  0 個 1 星使用者評論     ](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/block-editor-columns-reverse/reviews/)

## 參與者

 *   [ Mickaël Larguier ](https://profiles.wordpress.org/mickaellrg/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/block-editor-columns-reverse/)

## 贊助

想要支援這個外掛的發展嗎？

 [ 贊助這個外掛 ](https://ko-fi.com/mickaellrg)