[WordPress] 外掛分享： Better Block Editor (BBE)

WordPress 外掛 Better Block Editor (BBE) 的封面圖片。

前言介紹

  • 這款 WordPress 外掛「Better Block Editor (BBE)」是 2025-10-28 上架。
  • 目前有 4000 個安裝啟用數。
  • 上一次更新是 2026-02-11，距離現在已有 14 天。
  • 外掛最低要求 WordPress 6.8 以上版本才可以安裝。
  • 外掛要求網站主機運作至少需要 PHP 版本 7.4 以上。
  • 有 8 人給過評分。
  • 論壇上目前有 4 個提問，問題解答率 75% ，不低，算是個很有心解決問題的開發者團隊了！

外掛協作開發者

dreamtheme |

外掛標籤

animation | templates | responsive | block-editor | page builder |

內容簡介

總結：Better Block Editor 在原生 WordPress 編輯器中新增了響應式佈局控制、懸停效果、捲動動畫和現成的網站模板。它不是另一個頁面建構工具，也不會取代核心區塊或增加冗餘——BBE僅在需要時添加缺失的設置。它與您當前的區塊主題和外掛程式兼容，因此您現有的內容將保持完整。

1. Better Block Editor 與現有的 WordPress 核心區塊與外掛程式兼容嗎？
- 是的，BBE與您當前的區塊主題和外掛程式兼容，因此您現有的內容將保持完整。

2. Better Block Editor 提供哪些亮點設置？
- Responsive Settings for Row、Stack、Grid、Columns、Button、Navigation 和 text (Heading、Paragraph) 區塊──選擇斷點，然後在該斷點調整方向、間距和對齊方式。
- Responsive Visibility for any block──設定預設可見狀態並在選定斷點更改。
- Prevent Shrinking for elements set to Fixed or Fit-content sizes──保持小螢幕上的複雜佈局完整。
- Animation on Scroll──可配置的動畫效果、緩解、持續時間和延遲。
- Hover colors for Button and Navigation。

3. 在哪裡可以找到免費的現成網站模板？
- Business: https://templates.wpbbe.io/business/
- Brewery: https://templates.wpbbe.io/brewery/
- Life Coach: https://templates.wpbbe.io/life-coach/
- Bakery: https://templates.wpbbe.io/bakery/
- 更多模板即將推出。

原文外掛簡介

Better Block Editor (BBE) adds responsive layout controls, hover effects, on-scroll animations, and ready-to-use site templates to Block Editor. It’s not another page builder. It doesn’t replace core blocks or add bloat — BBE just adds the missing settings where needed. It works with your current block theme and plugins, so your existing content stays intact.
Highlights

Responsive Settings for Row, Stack, Grid, Columns, Button, Navigation, and text (Heading, Paragraph) blocks — choose a breakpoint, then adjust orientation, spacing, and alignment at that breakpoint.
Responsive Visibility for any block — set the default visibility state and change it at a chosen breakpoint.
Prevent Shrinking for elements set to Fixed or Fit-content sizes — keeps complex layouts intact on small screens.
Animation on Scroll — configurable animation effect, easing, duration, and delay.
Hover colors for Button and Navigation.
Pre-made Sites and Partial Import — bring over a full site or a single page/section; assets import automatically.
One-click customization for imported content — set primary, secondary, and neutral colors; BBE creates a balanced palette in one click.
Native Block Editor integration — no lock-in, lightweight, GPL, and free.

Free pre-made site templates

Business — https://templates.wpbbe.io/business/
Brewery — https://templates.wpbbe.io/brewery/
Life Coach — https://templates.wpbbe.io/life-coach/
Bakery — https://templates.wpbbe.io/bakery/
More templates coming soon.

How it works
Import a template and make it yours in minutes with the one-click customization tool. Mix pages and sections from different templates with Partial Import. Create a professional website in hours — not weeks!
Features

Responsive Settings for Row and Stack — change orientation (convert Row ↔ Stack), justification, vertical alignment, and spacing at a chosen breakpoint. This panel is key to controllable responsive behavior in Block Editor sites.
Prevent Shrinking — available when a block’s width/height is set to Fit content or Fixed; prevents fixed-size elements from collapsing on small screens.
Responsive Visibility for any block — set the default visibility state (visible/hidden) and change it at a chosen breakpoint.
Responsive Settings for Grid — replaces the core Stack on mobile with a dedicated panel to choose the stacking breakpoint and adjust spacing at that breakpoint.
Improved Stack on mobile for Columns — choose the breakpoint and optionally reverse the column order at that breakpoint.
Navigation overlay menu — replaces the fixed Mobile option with Responsive; pick the exact breakpoint when navigation collapses to a menu icon (useful for headers).
Hover color for Navigation — add hover color controls for menu and submenu items.
Responsive Settings for Button — control the orientation of inner buttons (stack or reverse), plus justification and vertical alignment at a chosen breakpoint.
Hover colors for Button — set text, background, and border colors on hover.
Responsive Settings for Post Template (Grid view) — stack posts and adjust spacing at a chosen breakpoint.
Animation on Scroll for any block — subtle reveal on scroll with configurable effect, easing, duration, and delay.
Responsive text alignment — add alignment controls at a chosen breakpoint for Heading, Paragraph, and select text-based blocks.
SVG Icon block + sanitized SVG upload — place SVG icons anywhere; control size, color, hover color, and linking.
Breakpoints — edit built-in breakpoints and add or remove custom breakpoints.

Requirements & Compatibility

WordPress 6.8 or later
Uses the native Block Editor (Gutenberg)
Works with block themes; does not target third-party page builders

Privacy
This plugin does not collect personal data from site visitors. It uses standard Block Editor controls and optional template imports. Site owners should review their own analytics/embeds for compliance.
License
Better Block Editor is distributed under the GPLv2 or later. You are free to use it on personal and commercial sites.
Resources

Official website — https://wpbbe.io/
User Guide — https://docs.wpbbe.io/

各版本下載點

  • 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
  • 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Better Block Editor (BBE)」來進行安裝。

（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。

1.0.0 | 1.0.1 | 1.1.0 | 1.2.0 | 1.2.1 | 1.2.2 | trunk | 1.0.1.1 | 1.0.1.2 |

延伸相關外掛（你可能也想知道）

  • Blocks Animation: CSS Animations for Gutenberg Blocks 》Blocks Animation 可以讓您以優雅的方式，為所有的 Gutenberg 區塊添加 CSS 動畫。, Blocks Animation 的用戶介面非常原生且直觀，您甚至不會注意到它已經被...。
  • Greenshift – animation and page builder blocks 》, 高度優化的網站建構工具, 您是否想建構高品質的動畫和網頁，但卻因常見的頁面建構工具表現低落而感到困擾？Greenshift 將為您解決這個問題。, 此外插件也不...。
  • UiCore Animate – Free Animations, Transitions, and Interactions Addon for Elementor & Gutenberg blocks 》總結: 「UiCore Animate」可以在「Elementor」中輕鬆創建引人入勝的部件動畫，不需要花費太多時間，亦不會降低品質。, 以下是使用繁體中文製作的問題與答案:,...。
  • Animation Addons for Elementor – GSAP Powered Elementor Addons & Website Templates 》**摘要:**, , "Animation Addons for Elementor" 是一款專為 WordPress 和 Elementor 使用者設計的網頁動畫建構外掛，提供35種元素和獨特功能，讓...。
  • Loading Page with Loading Screen 》使用 Loading Page with Loading Screen 外掛功能：, → 顯示正在載入頁面的百分比的螢幕, → 載入完成後以動畫顯示頁面內容, → 提高 WordPress 的效能, → 允許...。
  • Animations for Blocks 》輕量級插件，可以為塊狀編輯器塊添加額外的檢查器控件，使得在滾動過程中，一旦塊可見就可以對其進行動畫。這些控件可用於選擇動畫類型（淡入淡出，翻轉，滑...。
  • LottieFiles 》LottieFiles for WordPress 提供您超過 50,000 個免費的 Lottie 動畫，您可以輕鬆地在您的網站上嵌入這些動畫。添加動畫快速簡單：只需要將您選擇的動畫拖放...。
  • Ghost Kit – Page Builder Blocks, Motion Effects & Extensions 》Gutenberg 區塊和 WordPress 頁面建構外掛程式, , ★★★★★, , Ghost Kit 是 WordPress 的強大頁面建構體驗。Ghost Kit 提供大量的 Gutenberg 區塊、模板和擴充...。
  • Maintenance & Coming Soon Redirect Animation 》這個超輕量的外掛主要是為開發人員、設計師和網站管理員而設計的，他們需要讓客戶在公開前預覽網站，或在進行重大更新時暫時隱藏網站。, 任何擁有 WordPress ...。
  • Animentor – Lottie & Bodymovin for Elementor 》這是一個非官方的 WordPress 外掛，可在 Elementor 頁面建構器 中增加 Lottie 小工具。, 特點, , 直觀的使用者介面，所有內容皆可透過小工具控制項直接於 Ele...。
  • Animated Headline 》Animated Headline 是一個使用簡碼展示帶有動畫效果標題文字的 WordPress 外掛程式，使用方便。只需使用 Animated Headline 簡碼即可。, 範例：, [animated-h...。
  • Animate on Scroll 》使用熱門的 AOS JS 庫，透過新增 class names 完成任何元素的滾動動畫效果。, 此外掛可協助您簡單接合 AOS JS 庫，以新增任何滾動動畫效果至 WordPress 網站...。
  • LottieFiles – JSON Based Animation Lottie & Bodymovin for Elementor 》這是一個 Elementor 外掛，可使用 Lottie 動畫將創意佈局應用到您的網站，並使用較小的 JSON 檔案。, , 基於 JSON 的動畫嘗試測試環境, , 請參閱以下演示頁面...。
  • AOS Animation for SiteOrigin Page Builder 》此插件可為 SiteOrigin Page Builder 中的任何小工具和行添加可自定義的動畫。此插件基於免費的 AOS 動畫庫。您可以設定：, – 動畫類型。, – 持...。
  • Confetti 》, 透過區塊或短代碼，您可以在網站的任何位置添加有趣的彩帶效果。可從六種效果風格中選擇！, 短代碼：[confetti], 訪問我們的網站了解更多資訊, 升級到高級...。

文章
Filter
Mastodon