Title: BNE Gallery Extended
Author: Kerry
Published: <strong>2016 年 3 月 29 日</strong>
Last modified: 2024 年 11 月 19 日

---

搜尋外掛

![](https://ps.w.org/bne-gallery-extended/assets/banner-772x250.jpg?rev=1381536)

![](https://ps.w.org/bne-gallery-extended/assets/icon-256x256.png?rev=1417492)

# BNE Gallery Extended

 由 [Kerry](https://profiles.wordpress.org/bluenotes/) 開發

[下載](https://downloads.wordpress.org/plugin/bne-gallery-extended.1.2.2.zip)

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

 [技術支援](https://wordpress.org/support/plugin/bne-gallery-extended/)

## 外掛說明

The default WordPress [gallery] shortcode only displays your images in a traditional
column grid. BNE Gallery Extended adds a new option called “display” allowing you
to also show the images as a 3D carousel or masonry grid.

When adding a new image gallery or editing an existing gallery in your page, a new
option will show on the gallery settings to either set the display to 3D Carousel,
Masonry, or Default Grid. The default grid is what you have been used to and is 
the default behavior of WordPress. 3D Carousel adds a jquery rotation to your images
and Masonry is similar to the default grid but allows different sizes and stacks
them. The Masonry grid will also automatically reduce the number of columns for 
tablet and mobile screens.

To use with the block editor, use a classic editor block, then use the media button
on that block’s toolbar to add your legacy media gallery.

## 螢幕擷圖

 * [[
 * Display Options in the WP Gallery Window
 * [[
 * 3D Carousel Display
 * [[
 * Masonry Display
 * [[
 * Traditional Grid

## 安裝方式

 1. Upload “bne-gallery-extended” folder to the “wp-content/plugins/” directory
 2. Activate the plugin through the “Plugins” menu in WordPress
 3. A new option will be added to the WP gallery modal window to select the display
    type. Otherwise add display=”carousel” or display=”masonry” to the [gallery] shortcode.

## 常見問題集

### Display as a 3D carousel

Add display=”carousel” or display=”carrousel” to the [gallery] shortcode. Example:[
gallery display=”carousel” ids=”2,5,22,13,2″]

### Display as Masonry Grid

Add display=”masonry” to the [gallery] shortcode. Use “columns” to set the number
of columns within the grid and “gutter” to set the distance between each image. 
The number of columns will reduce based on screen size. Example: [gallery display
=”masonry” gutter=”4″ ids=”2,5,22,13,2″]

### New Shortcode attributes added to [gallery]

display

 * Options: carousel or masonry
 * Description: Sets the display type for the WordPress [gallery] shortcode.
 * Example: [gallery display=”carousel” gutter=”4″ ids=”2,5,22,13,2″] or [gallery
   display=”masonry” ids=”2,5,22,13,2″]

caption

 * Options: true or false (default: false)
 * Description: shows the image caption below the centered image.
 * Example: [gallery display=”carousel” caption=”true” ids=”2,5,22,13,2″]

gutter

 * Options: Any numerical value, ex: 5 or 3. (default: 5)
 * Description: Masonry only – sets the distance surrounding each image in the grid
   layout. If you use a high number, this may negatively impact the column sizes
   on mobile. Stay between 5 and 15 for best results.
 * Example: [gallery display=”masonry” gutter=”4″ ids=”2,5,22,13,2″]

responsive

 * Options: true or false. (default: true)
 * Description: Masonry only – When used, the number of columns will reduce based
   on the window width or viewport. For example, 6+ columns will go down to 5 columns
   at < 1200 viewport, 5+ columns down to 4 columns at < 980 viewport, 4+ columns
   down to 3 at < 768 viewport, and finally 3+ columns down to 2 at < 480 viewport
   and smaller.
 * Example: [gallery display=”masonry” responsive=”true” columns=”6″ ids=”2,5,22,13,2″]

autoplay

 * Options: Any numerical value, ex: 4000 or 2000. (default: none)
 * Description: Carousel only – Sets the carousel to play automatically. The number
   represents the time each image is focused on in milliseconds (4000 is equal to
   4 seconds).
 * Example: [gallery display=”carousel” autoplay=”4000″ ids=”2,5,22,13,2″]

## 使用者評論

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

### 󠀁[Nice!](https://wordpress.org/support/topic/nice-4260/)󠁿

 [ragnarfredrik](https://profiles.wordpress.org/ragnarfredrik/) 2022 年 2 月 24 
日

Thanks for this easy to use and great working plugin! Please keep it updated and
alive 😉

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

### 󠀁[Nice plugin for WP 5.2](https://wordpress.org/support/topic/nice-plugin-for-wp-5-2/)󠁿

 [Toxic](https://profiles.wordpress.org/avk-1/) 2019 年 9 月 2 日

This plugin perfectly works with WP 5.2.

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

### 󠀁[Simply Superb](https://wordpress.org/support/topic/simply-superb-29/)󠁿

 [tiansmith](https://profiles.wordpress.org/tiansmith/) 2018 年 12 月 8 日

Well that’s how plugin’s should be made, excellent work!

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

### 󠀁[Perfection!](https://wordpress.org/support/topic/perfection-51/)󠁿

 [Tibow](https://profiles.wordpress.org/pyho/) 2018 年 8 月 29 日

Hey, I tried a lot of plugins to make WordPress built-in Gallery look like a Masonry
style. You can be proud to hear that your work is the best i tested for my projects.
Thanks a lot 5 stars for you and in fav for me!

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

### 󠀁[Good plugin](https://wordpress.org/support/topic/good-plugin-2599/)󠁿

 [v1ao](https://profiles.wordpress.org/v1ao/) 2018 年 1 月 8 日

Simple and good

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

### 󠀁[AMAZING](https://wordpress.org/support/topic/amazing-1612/)󠁿

 [ppauloff](https://profiles.wordpress.org/ppauloff/) 2017 年 11 月 8 日

this is really useful and simple plugin, amazing possibilities! (and the guy behind
it’s really really awesome and helpfull, a real good man) an absolute must-have!
thanks again

 [ 閱讀全部 13 則使用者評論 ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/)

## 參與者及開發者

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

參與者

 *   [ Kerry ](https://profiles.wordpress.org/bluenotes/)

[將〈BNE Gallery Extended〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/bne-gallery-extended)

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

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

## 變更記錄

#### 1.2.2 Nov 18, 2024

 * Security fix for XSS via the shortcode image ID’s attribute. My thanks to Peter
   Thaleikis for the discovery.
 * Note that this is a legacy plugin. Users should move towards the built in block
   editor gallery features.

#### 1.2.1 June 3, 20222

 * Fix PHP 8.0 warning.
 * Set images to use the “eager” loading attribute.

#### 1.2 December 15, 2020

 * Move roundabout inline js to use wp_add_inline_script()
 * Adjust JS to support jQuery v3.5+

#### 1.1.1 November 8, 2017

 * Fix: Adjust masonry caption if using the link option in [gallery] to respect 
   either file, none, or attachment.

#### 1.1 November 6, 2017

 * New: Captions are now available with the masonry display while the image is hovered.
 * New: Image titles are now included in the carrousel.
 * Enhancement: Caption meta title and caption fields are separated for greater 
   css customization.

#### 1.0.4 June 17, 2017

 * Notice: Now requires WP 4.5+
 * Fix: Masonry display items would sometimes overlap one another.
 * Enhancement: Move masonry inline js to the footer.
 * New: Add a loading indicator to masonry gallery

#### 1.0.3 May 15, 2016

 * Enhancement: Better calculation of columns with any gutter size for the masonry
   display.
 * New: Add autoplay option to carrousel by adding autoplay=”4000″ within the gallery
   shortcode. 4000 (in milliseconds) is equal to 4 seconds.
 * New: Option to disable masonry responsive columns by adding responsive=”false”
   to the gallery shortcode. Default behavior will reduce 6+ columns down to 5 columns
   at < 1200 viewport, 5+ columns down to 4 columns at < 980 viewport, 4+ columns
   down to 3 at < 768 viewport, and finally 3+ columns down to 2 at < 480 viewport
   and smaller.

#### 1.0.2 March 27, 2016

 * Clean up and adjust css.

#### 1.0.1 January 22, 2016

 * Add caption option for carousel

#### 1.0 December 17, 2015

 * First Public Release. *

## 中繼資料

 *  版本 **1.2.2**
 *  最後更新 **1 年前**
 *  啟用安裝數 **1,000+**
 *  WordPress 版本需求 ** 4.5 或更新版本 **
 *  已測試相容的 WordPress 版本 **6.7.5**
 *  語言
 * [English (US)](https://wordpress.org/plugins/bne-gallery-extended/)
 * 標籤
 * [Carousel gallery](https://tw.wordpress.org/plugins/tags/carousel-gallery/)[gallery](https://tw.wordpress.org/plugins/tags/gallery/)
   [masonry gallery](https://tw.wordpress.org/plugins/tags/masonry-gallery/)[wordpress gallery](https://tw.wordpress.org/plugins/tags/wordpress-gallery/)
 *  [進階檢視](https://tw.wordpress.org/plugins/bne-gallery-extended/advanced/)

## 評分

 5 星，滿分為 5 星

 *  [  13 個 5 星使用者評論     ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/?filter=5)
 *  [  0 個 4 星使用者評論     ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/?filter=4)
 *  [  0 個 3 星使用者評論     ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/?filter=3)
 *  [  0 個 2 星使用者評論     ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/?filter=2)
 *  [  0 個 1 星使用者評論     ](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/bne-gallery-extended/reviews/)

## 參與者

 *   [ Kerry ](https://profiles.wordpress.org/bluenotes/)

## 技術支援

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

 [檢視技術支援論壇](https://wordpress.org/support/plugin/bne-gallery-extended/)