ZenBlocks

外掛說明

ZenBlocks extends the WordPress block editor (Gutenberg) with custom blocks and advanced styling controls. Design responsive, professional buttons and UI elements — without writing any code.

Button Basic Block

Create fully customizable buttons with granular control over every visual aspect:

  • Colors & Backgrounds — Solid color, gradient, or image backgrounds with hover state support
  • Typography — Font family, size, weight, line height, and letter spacing
  • Layout — Width, height, padding, and margin with fine-grained control
  • Borders — Width, style, color, and independent corner radius
  • Icons — 1,500+ built-in icons with size, color, and position options
  • Hover Effects — Separate styling for hover state with smooth transitions
  • 32 Design Presets — Start from professionally designed templates and customize freely

Responsive Design

Every setting supports 4 breakpoints (PC / Tablet L / Tablet / Mobile) so your buttons look great on all devices. Customize values per device or let them cascade automatically.

Performance

ZenBlocks generates optimized CSS per page — only the styles you actually use are loaded on the frontend. No bloated global stylesheets.

Pro Features (Optional)

Additional features such as animations, thumbnails, and background video are available through a separate plugin (ZenBlocks Pro) from zenblockswp.com.

Source Code

This plugin includes compiled JavaScript and CSS files in the build/ directory. The original uncompiled source code is included in the src/ directory of this plugin.

To build from source:

  1. Install Node.js (v18 or later)
  2. Run npm install in the plugin root directory
  3. Run npm run build to generate the production files in build/

The build process uses @wordpress/scripts (webpack-based).

External services

This plugin includes an optional media search feature that connects to third-party image and video APIs. These services are only used when the user configures API keys in the plugin settings and actively searches for media within the block editor. No data is sent to these services during normal frontend usage.

Unsplash

Used for searching and importing free-to-use images in the block editor.

Pexels

Used for searching and importing free images and videos in the block editor.

Pixabay

Used for searching and importing free images and videos in the block editor.

Openverse

Used for searching and importing CC0-licensed images in the block editor.

ZenBlocks Pro Services (zenblockswp.com)

Used for retrieving Pro upgrade pricing information on the plugin settings page.

Icon Libraries (bundled, no external requests)

This plugin bundles SVG icon data from the following open-source icon libraries. All icon data is included locally within the plugin files — no external HTTP requests are made to any of these services at any time (neither in the editor nor on the frontend). The URLs listed below are the project homepages and license references for attribution purposes only.

適用於區塊編輯器

這個外掛提供 1 個可供 Gutenberg/區塊編輯器使用的區塊。

  • Button Basic

安裝方式

  1. Upload the zenblocks folder to the /wp-content/plugins/ directory.
  2. Activate the plugin through the Plugins menu in WordPress.
  3. Open the block editor and add blocks from the ZenBlocks Elements category.

常見問題集

What are the minimum requirements?

WordPress 6.0 or higher, PHP 7.4 or higher.

Does this plugin work without Pro?

Yes. Core block functionality is available in the free version.

Where can I manage plugin settings?

Go to Settings > ZenBlocks in wp-admin.

使用者評論

這個外掛目前沒有任何使用者評論。

參與者及開發者

以下人員參與了開源軟體〈ZenBlocks〉的開發相關工作。

參與者

〈ZenBlocks〉外掛目前已有 1 個本地化語言版本。 感謝全部譯者為這個外掛做出的貢獻。

將〈ZenBlocks〉外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

變更記錄

1.1.0

  • Enhanced Pro feature protection with dual-layer security (PHP filter + CSS separation)
  • Improved free version CSS output (reduced bundle size by removing Pro-only animation styles)

1.0.1

  • Added hover state indicator in toolbar and layer z-index settings
  • Added band border panel with responsive controls
  • Added block inserter preview and search keywords
  • Added auto YouTube thumbnail as poster and autoplay notice in editor
  • Added Dutch (nl_NL) locale and translation build automation
  • Improved media/video selector UI with icon-only buttons
  • Improved design preset UI and PRO badge presentation
  • Fixed preset PRO badge detection, hover preview, and border toggle issues
  • Fixed video poster behavior and translation loading for shared components
  • Fixed Plugin Check compliance issues
  • Removed all debug console statements from source files

1.0.0

  • Initial release of ZenBlocks.