Block Gallery – Gutenberg 相片圖庫區塊



請注意,Block Gallery 已不再繼續開發,建議改用內建精美且功能完整圖庫區塊的 CoBlocks 外掛。Block Gallery 中的每一個區塊,都會透過區塊轉換方式轉換成對應的 CoBlocks 圖庫區塊。

Block Gallery 是一款美觀、適合攝影師、藝術家、作家及內容行銷人員使用的圖庫區塊套件。Block Gallery 是 WordPress 最聰明、功能最強大、也是最出色的相片圖庫外掛。

Good news! Block Gallery was selected as this year’s winner in the Best Solution category of the Automattic Design Awards at WordCamp US 2018. 🔥🔥

A short demo of Block Gallery

Unrivaled, in every way

The first of its kind, Block Gallery offers an unrivaled drag and drop gallery building experience in Gutenberg. Drop your images in your choice of photo gallery block, customize display settings, hit publish.

Unparalleled capabilities

An innovative transform system lets you instantly change your photos galleries into another form. Go from a fullscreen masonry gallery to a casual carousel, with just a single click. You won’t find another Gutenberg gallery plugin with this kind of capability. Guaranteed.

Highly responsive

Our Gutenberg gallery blocks are second-to-none, featuring fullscale responsive support. And with fine controls for mobile and desktop styles, you can set custom styling for each gallery.

A Super-fast experience

We’ve built a highly interactive and intuitive experience with a focus on speed and ease of use. Drag. Drop. Transform. Style.

Included Gallery Gutenberg Blocks

  • Masonry Gallery – (demo)
  • Fullscreen Stacked Gallery – (demo)
  • Carousel Slider – (demo)

Works with CoBlocks

If you enjoy Block Gallery, check out CoBlocks, a suite of page builder WordPress blocks and tools for the Gutenberg editor — also built by Rich. It’s fantastic!


  • Masonry Grid block
  • Carousel Slideshow block
  • Stacked Fullwidth block
  • Offset Grid block (Pro Only - coming soon)
  • Auto Height Slider block (Pro Only - coming soon)


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

Block Gallery - Photo Gallery Gutenberg Blocks
Block Gallery - Photo Gallery Gutenberg Blocks
Block Gallery - Photo Gallery Gutenberg Blocks


  1. Upload the block-gallery folder to your /wp-content/plugins/ directory or alternatively upload the file via the plugin page of WordPress by clicking ‘Add New’ and selecting the zip from your computer.
  2. Install and activate the Gutenberg WordPress plugin (if pre WordPress 5.0).
  3. Activate the Block Gallery WordPress plugin through the ‘Plugins’ menu in WordPress.


How do I start using Gutenberg?

To get the full experience of the next-generation WordPress block editor, you’ll need a Gutenberg-ready WordPress theme, like Tabor or Stash. Then install the Gutenberg WordPress plugin. That’s it! 💥

What themes work with Block Gallery

Most WordPress themes that have baked in Gutenberg support will work with Block Gallery. If you’re looking for exceptional themes, check out my theme catalogue at ThemeBeans.

Is Block Gallery free?

Yes! Block Gallery’s core features are absolutely free.

Where can I ask for help?

Please reach out via the official support forum on


2020 年 5 月 2 日
I tried this plugin and it worked straight away just the way i wanted it to. Very satisfied with it, thanks a lot to the developer(s) !
2020 年 1 月 23 日
Developers well done! Keep the course in the same direction.
閱讀全部 74 則使用者評論


以下人員參與了開源軟體〈Block Gallery – Gutenberg 相片圖庫區塊〉的開發相關工作。


Block Gallery – Gutenberg 相片圖庫區塊 外掛目前已有 5 個本地化語言版本。 感謝全部譯者為這個外掛做出的貢獻。

將 Block Gallery – Gutenberg 相片圖庫區塊 外掛本地化為台灣繁體中文版


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



  • New: Block Gallery now supports WordPress 5.1 and Gutenberg 5.0
  • Tweak: Add Block Gallery color to icons within the block inserter


  • Tweak: Use the MediaUploadCheck component to make sure the current user has upload permissions
  • Fix: Resolve lodash/isEmpty issue with the npm start command [thanks @mtekk]
  • Fix: Resolve issue where image radius styles were not applied to child captions [thanks @wido]


  • New: Add toggles for turning image captions on/off for each block
  • New: Add new “none” Caption Style option
  • New: Add new options for slider autoplay times up to 10 seconds [thanks @batracy]
  • Fix: Resolve translatable placeholder issue in the Slider Settings panel [thanks @morganestes]
  • Fix: Resolve translatable invalid HTML issue in the Carousel block [thanks @morganestes]
  • Fix: Resolve issue where the Carousel autoplay speed was not functioning properly [thanks @morganestes]
  • Fix: Resolve PHP 5.4.16 compatibility issue [thanks @ndcadmin]
  • Tweak: Adjust Stacked Inspector interface


  • Fix: Resolve issue where block assets were not loading on the blogroll


  • New: Add minor style touch-ups for the default Twenty Nineteen WordPress theme


  • Tweak: Remove Gutenberg check

1.1.0, December 04, 2018

  • New: Add ability to transform Image blocks to Block Gallery blocks
  • New: Add “:” prefix transforms using each blocks’ name – i.e. “:masonry”,
  • New: Load frontend assets only on pages that need them
  • New: Add translation strings in /languages/block-gallery.pot
  • New: Add support for the WP 5.0 wp_set_script_translations() function
  • New: Add styling for the core Twenty Seventeen theme
  • New: Add styling for the core Twenty Sixteen theme
  • New: Add styling for the core Twenty Fifteen theme
  • New: Add styling for the core Twenty Fourteen theme
  • New: Add styling for the core Twenty Twelve theme
  • New: Add styling for the core Twenty Eleven theme
  • New: Add block-gallery-translations.php for referencing PHP translatable strings
  • Tweak: Improve grid size responsiveness for the Masonry block
  • Tweak: Hide the GalleryUpload component if not selected
  • Tweak: Improve Flickity focus styles for better theme compatibility


Tweak: Use better specificity for figcaption margins
Tweak: Add inherit color for caption link hovers


  • Tweak: Remove unnecessary style dependancies


  • Tweak: Indicate uploading using a spinner
  • Tweak: Adjust figcaption margin for better theme compatibility


  • Tweak: Adjust mobile styles for the block inspector controls UI
  • Tweak: Adjust UI of SizeControl controls
  • Tweak: Adjust pickRelevantMediaFiles
  • Tweak: Hide shadow controls if Stacked block is fullwidth
  • Tweak: Improve default caption style for Carousel
  • Tweak: Tweak mobile styles for Carousel block arrows
  • Tweak: Adjust height of Stacked image uploader


  • Tweak: Ensure the last figcaption in the Stacked Block is styled appropriately
  • Tweak: Update styling of feedback notice
  • Tweak: Improve language of the gallery instructions for placeholders
  • Tweak: Tweak icon placement in the placeholder label
  • Tweak: Remove caption color that was overriding theme styles
  • Tweak: Use register_block_type to check if the block editor is live
  • Tweak: Improve UI of the ResponsiveTabsControl component
  • Tweak: Add tab navigation support for gallery images
  • Tweak: Tweak editor styles for captions


  • Fix: Resolve issue with the Stacked block shadow attribute


  • New: Add support for adding a primary caption to the Carousel block
  • New: Add font size option for the Stacked gallery block
  • Tweak: Improve UI of the slider arrows within the editor
  • Tweak: Improve help language of the Slider Settings panel for better context and understanding
  • Tweak: Improve UI of the ResponsiveTabsControl component
  • Tweak: Add slider controls to global transforms
  • Fix: Improve display of fullwidth images in the Stacked gallery block
  • Fix Improved reliablity of the Stacked block when triggering fullwidth imagery
  • Fix: Improve display of carousel arrows


  • Tweak: Improve figcaption display
  • Tweak: Improve block category registration
  • Tweak: Add icon to the block category for Gutenberg 4.2+
  • Fix: Color palette colors properly render in the editor


  • New: Improve block registration


  • Initial release on Enjoy!