[WordPress] 外掛分享： Epitome Gallery

前言介紹

  • 這款 WordPress 外掛「Epitome Gallery」是 2015-12-06 上架。
  • 目前有 10 個安裝啟用數。
  • 上一次更新是 2015-12-04，距離現在已有 3438 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
  • 外掛最低要求 WordPress 3.5 以上版本才可以安裝。
  • 尚未有人給過這款外掛評分。
  • 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。

外掛協作開發者

freddessaint2 |

外掛標籤

layout | slider | columns | gallery | subtitle |

內容簡介

Epitome Gallery 旨在為原生 WordPress 圖庫帶來新的可能性。從 Gallery 設定側邊欄的 Edit Gallery 面板中，您會發現新的選擇圖庫類型和可選應用自定義類別的欄位。可用的圖庫類型如下：Slider、Featured Slider、Callout。您可以像往常一樣管理圖庫（選擇、排序、描述）。Epitome Gallery 可以根據簡單的 WordPress 圖庫創建複雜的佈局。

當保存時，外掛會在 WordPress 圖庫短碼中添加自定義屬性。第一個屬性是 epitome_type="name"，定義圖庫的類型（如果類型設置為默認值，此屬性是可選的）。第二個屬性是可選的 epitome_class="name"，包含一個或多個要應用的類名。

圖庫類型

Slider – 將 WordPress 圖庫轉換為交互式滑塊。在文章內容中運作良好。
Featured Slider – 與 Slider 相同，但提供標題、說明和/或描述。作為精選內容出現在文章頂部時運作良好。
Callout – 將 WordPress 圖庫轉換為包含帶有標題、說明和/或描述的圖像列的一組列。不需要使用列短碼或構建器，只需使用此類型的圖庫即可建立此類佈局。

JavaScript

Epitome Gallery 使用一個 jQuery 編寫的 JavaScript 文件來處理滑塊。您可以使用它來自定義自己的滑塊。參數如下：

`javascript

pauseTime: 3000, // 2 張幻燈片之間的延遲 pauseOnHover: true, // 暫停幻燈片 autoSlide: false, // 自動啟動幻燈片 startSlide: 1, // 開始時的初始幻燈片編號 width: 640, // 像素或“自動”、“視口”等高度 height: 360, // 像素或“自動”、“視口”等預取 prefetch: true, // 載入相鄰的幻燈片 sitOnTop: false, // 當單擊幻燈片時，在頂部滾動 prevText: “Prev”, // 上一個按鈕的方向標籤 nextText: “Next”, // 下一個按鈕的方向標籤 directionNav: true, // 顯示方向按鈕（箭頭在幻燈片邊緣） paginationNav: true, // 顯示分頁按鈕（點在幻燈片底部） prevHandle: null, // 點擊上一個按鈕時的回調函數 nextHandle: null, // 點擊下一個按鈕時的回調函數 itemHandle: null, // 篩選點元素的回調函數 beforeChange: null, // 幻燈片變更之前啟動操作的回調函數 afterChange: null, // 幻燈片變更後啟動操作的回調函數 resize: null // 當捕捉到窗口調整事件時的回調函數。 `

用法

您可以在您的主題的主要 JavaScript 文件中替換 Epitome Gallery 初始化的預設事件。通過自定義事件和用於此主題的自定義參數來實例化 EpitomeSlider JavaScript 對象。這類似於 WordPress 函數 do_action()。這非常重要，應將此事件聲明在 ready 事件之外。

`javascript

$(document).on(‘epitome_slider_init’, function(e) { // 實例化常規滑塊 $(‘.gallery.slider[data-type=”regular-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘auto’ }); // 實例化精選滑塊 $(‘.gallery.slider[data-type=”featured-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘viewport’ }); }); `

原文外掛簡介

Epitome Gallery aims to bring new possibilites to the native WordPress gallery. From the Edit Gallery panel in the Gallery Settings sidebar, you will find new fields for selecting the gallery type and optionaly applying a custom class. Available gallery types are the following: Slider, Featured Slider, Callout. You manage your gallery (selection, sorting, description) as usual. Epitome Gallery is great to create complex layouts based on a simple WordPress gallery.
When saving, the plugin add custom attributes in the WordPress gallery shortcode. The first one is epitome_type="name" that define the type of gallery (optional if the type is set to default). The second one is optional epitome_class="name" and contains one or more class names to apply.
Gallery types

Slider – Transform a WordPress gallery to a interactive slider. Works fine in the body of an article.
Featured Slider – Same as Slider, but provides titles, caption and/or description. Works fine at the top of an article as a featured content.
Callout – Transfom a WordPress gallery to a set of columns containing images with title, caption and/or description. No need to use a column shortcode or a composer, just use this type of gallery for building this kind of layout.

JavaScript
Epitome Gallery use a JavaScript file (coded with jQuery) to handle the slider. You can use to customize your own slider. Parameters are the following:
`javascript
pauseTime: 3000, // Delay between 2 slides pauseOnHover: true, // Pause slider on hover autoSlide: false, // Start sliding automatically startSlide: 1, // Initial slide number at start width: 640, // In pixel, or keyword ‘auto’, ‘viewport’ height: 360, // In pixel, or keyword ‘auto’, ‘viewport’ prefetch: true, // Load adjacent slides sitOnTop: false, // Scroll at the top on slider when clicking on it prevText: “Prev”, // Direction of previous button label nextText: “Next”, // Direction of next button label directionNav: true, // Display direction button (arrows at the egdge of slider) paginationNav: true, // Display pagination button (dots at bottom of slider) prevHandle: null, // Callback function when clicking previous button nextHandle: null, // Callback function when clicking next button itemHandle: null, // Callback function to filter dot elements beforeChange: null, // Callback function to launch action before a slide changes afterChange: null, // Callback function to launch action after a slide changes resize: null // Callback function when catching a window resize event. `
Usage
You can replace the default event initialized by the Epitome Gallery in the main JavaScript file of your theme. Instanciate the EpitomeSlider JavaScript object through a custom event and with custom parameters used for this theme. This is similar to the WordPress function do_action(). That’s important to declare this event outside a ready event.
`javascript
$(document).on(‘epitome_slider_init’, function(e) { // Instanciate for a regular slider $(‘.gallery.slider[data-type=”regular-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘auto’ }); // Instanciate for a featured slider $(‘.gallery.slider[data-type=”featured-slider”]’).EpitomeSlider({ width: ‘auto’, height: ‘viewport’ }); }); `

各版本下載點

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

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

最新版本

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

文章
Filter
Apply Filters
Close
Mastodon