[WordPress] 外掛分享： WP Colorbox

前言介紹

  • 這款 WordPress 外掛「WP Colorbox」是 2014-01-09 上架。
  • 目前有 7000 個安裝啟用數。
  • 上一次更新是 2024-11-12，距離現在已有 172 天。
  • 外掛最低要求 WordPress 3.0 以上版本才可以安裝。
  • 有 23 人給過評分。
  • 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。

外掛協作開發者

naa986 |

外掛標籤

image | photo | gallery | colorbox | lightbox |

內容簡介

WordPress Colorbox 外掛是一個簡單的 Lightbox 工具，適用於 WordPress。它使用受歡迎的 jQuery ColorBox 庫，允許用戶在 Lightbox 中彈出內容。用戶還可以在不離開頁面的情況下查看特定媒體文件的較大版本。

特點

美麗的 Lightbox 彈出樣式
彈出自己的 Lightbox 鏈接的靈活性
在 Lightbox 中彈出自訂 / HTML 內容
從文本 / 圖像鏈接觸發 Lightbox
與 WordPress 多站點兼容
將 Lightbox 添加到 YouTube 或 Vimeo 視頻鏈接
為支持所有主要瀏覽器的您的站點啟用 Lightbox 功能
在您的站點的任何地方（文章、頁面、主頁等）使用簡單的短碼，以在 Lightbox 中彈出媒體文件
將 Lightbox 效果應用於插入 WordPress 帖子/頁面中的圖像
使用 iframe 在 Lightbox 中打開外部頁面
適用於移動設備的響應式 Lightbox 彈出窗口。當在較小的屏幕上時，它也完美適合。

如何使用 WP Colorbox

在 Lightbox 中彈出圖像

創建一個新的文章/頁面，使用以下短碼來創建文本/圖像鏈接，當單擊時將觸發 Lightbox：

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="單擊此處以彈出圖像"]

此處，url 是您希望在 Lightbox 中打開的媒體文件的鏈接，hyperlink 是錨文本/圖像。

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg"]

在 Lightbox 中彈出 YouTube 視頻

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="單擊此處以彈出 YouTube 視頻"]

在 Lightbox 中彈出 Vimeo 視頻

[wp_colorbox_media url="http://www.youtube.com/embed/1284237" type="vimeo" hyperlink="單擊此處以彈出 Vimeo 視頻"]

在 Lightbox 中顯示標題

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" title="疊加圖像" type="image" hyperlink="單擊此處以彈出圖像"]

為圖像指定替代文本

[wp_colorbox_media url="http://example.com/wp-content/uploads/images/overlay.jpg" title="疊加圖像" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg" alt="縮略圖像描述"]

應用自定義 CSS

您可以在短碼中指定自己的 CSS 類，以自定義文本/圖像鏈接。

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="單擊此處以彈出 YouTube 視頻" class="custom_class"]

可以用空格分隔多個 CSS 類。例如：

[wp_colorbox_media url="http://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="單擊此處以彈出 YouTube 視頻" class="custom_class custom_class2"]

有關詳細文檔，請訪問 WordPress Colorbox 插件頁面。

推薦閱讀

WordPress Colorbox 文檔
我自己的免費 WordPress 外掛

原文外掛簡介

WP Colorbox plugin is a simple lightbox tool for WordPress. It allows users to pop up content in lightbox using the popular jQuery ColorBox library. They can also view the larger version of a particular media file without leaving the page.

Features

Beautiful lightbox popup style
Flexiblity of creating your own lightbox link
Pop up custom/HTML content in lightbox
Trigger lightbox from either a text/image link
Add lightbox to a YouTube or Vimeo video link
Enable lightbox functionality on your site which supports modern browsers
Use a simple shortcode to pop up a media file in lightbox
Apply lightbox effect on images inserted into WordPress post/page
Open external page in lightbox using iframe
Responsive lightbox popup which works on mobile devices. Also it fits perfectly on smaller screens.

How to Use WP Colorbox
Pop up image in lightbox
Create a new post/page and use the following shortcode to create a text/image link which will trigger lightbox once clicked:
[wp_colorbox_media url="https://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="click here to pop up image"]

here, url is the link to the media file that you wish to open in lightbox and hyperlink is the anchor text/image.
[wp_colorbox_media url="https://example.com/wp-content/uploads/images/overlay.jpg" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg"]

Pop up YouTube video in lightbox
[wp_colorbox_media url="https://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video"]

Pop up Vimeo video in lightbox
[wp_colorbox_media url="https://www.youtube.com/embed/1284237" type="vimeo" hyperlink="click here to pop up vimeo video"]

Show Title in lightbox
[wp_colorbox_media url="https://example.com/wp-content/uploads/images/overlay.jpg" title="overlay image" type="image" hyperlink="click here to pop up image"]

Specify an Alternate Text for an Image
[wp_colorbox_media url="https://example.com/wp-content/uploads/images/overlay.jpg" title="overlay image" type="image" hyperlink="http://example.com/wp-content/uploads/images/thumb.jpg" alt="Thumbnail image description"]

Apply Custom CSS
You can specify your own CSS class in the shortcode to customize a text/image link.
[wp_colorbox_media url="https://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video" class="custom_class"]

Multiple CSS classes can be separated with a space. For example:
[wp_colorbox_media url="https://www.youtube.com/embed/nmp3Ra3Yj24" type="youtube" hyperlink="click here to pop up youtube video" class="custom_class custom_class2"]

For detailed documentation please visit the WordPress Colorbox plugin page

各版本下載點

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

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

1.0 | 1.0.1 | 1.0.9 | 1.1.0 | 1.1.1 |

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

  • Firelight Lightbox 》Easy FancyBox WordPress外掛為您的網站提供靈活美觀的光箱解決方案，幾乎適用於網站上的所有媒體連結。Easy FancyBox使用更新的傳統FancyBox jQuery擴展版本...。
  • Simple Lightbox 》Simple Lightbox 是一個非常簡單且可自定義的燈箱，在您的 WordPress 網站上添加它非常容易。, 功能, 自定義燈箱行為的選項位於外觀 > Lightbox 管理員菜...。
  • Responsive Lightbox & Gallery 》提供完整的 WordPress 相簿外掛所需一切, Responsive Lightbox and Gallery 外掛是一個全功能的 WordPress 相簿外掛，擁有強大的拖放相簿生成器和 Lightbox ...。
  • Lightbox & Modal Popup WordPress Plugin – FooBox 》FooBox是第一個嚴肅考慮響應式佈局的燈箱。它不僅會將圖片縮放以在手機上呈現更好的效果，還會重新排列按鈕控制，使其在縱向或橫向的方向上都展現出色的外觀...。
  • WP Featherlight – A Simple jQuery Lightbox 》WP Featherlight 是一個 WordPress 外掛，可為您的WordPress 網站添加一個極簡、高效、響應式 jQuery 燈箱。在其核心，WP Featherlight是一個用於 Featherlig...。
  • LightPress Lightbox 》這個外掛讓你保留了超棒的 Lightbox 2功能，卻移除了Prototype框架和Scriptaculous效果庫的大部分體積。, Warren Krewenki將Lightbox移植到了jQuery，而這個...。
  • Gallery Blocks with Lightbox. Image Gallery, (HTML5 video , YouTube, Vimeo) Video Gallery and Lightbox for native gallery 》區塊, SimpLy Gallery Blocks 是一個友善易用的相片庫外掛，內含一系列進階選項以建立響應式的圖片、影片和音訊相片庫。, 相簿, 將數個相片庫合併成一個，並...。
  • FancyBox for WordPress 》本外掛能讓FancyBox輕鬆整合到您的部落格：上傳，啟用，完成。您也能選擇進行更多的設置。, 您幾乎可以對Fancybox lightbox的所有屬性進行自定義：邊框、邊緣...。
  • WP Lightbox 2 》WP Lightbox 2是一款WordPress燈箱工具，可為您的網站圖像添加響應式燈箱效果，並在WordPress博客上為相冊/圖庫照片創建燈箱效果。, 只需要安裝並放心，此外...。
  • Advanced Responsive Video Embedder for Rumble, Odysee, YouTube, Vimeo, Kick … 》這是最佳的 WordPress 影片外掛嗎？支援幾乎你所能想像的一切，同時保持易用性和簡單性。這很可能是你需要的唯一一個外掛，來處理 WordPress 網站上的影片嵌...。
  • Video PopUp 》最受歡迎的 WordPress 影片輕盒外掛程式, 影片彈出外掛程式讓您輕鬆地設置影片輕盒彈出視窗。支援 YouTube、Vimeo、SoundCloud 和 MP4 自行托管的影片，您還...。
  • Lightbox with PhotoSwipe 》這個外掛在 WordPress 中整合了擴展版的 PhotoSwipe 4 或官方發行的 PhotoSwipe 5。發布或頁面中所有連結的圖像將使用 PhotoSwipe 顯示，而不管它們是圖片庫...。
  • Lightbox Gallery 》重要性：, 從 0.7.1 版本開始，插件目錄的版權規定導致默認顯示方式更改為 Colorbox。如果您希望使用 Lightbox 取代 Colorbox，您需要從設置頁面獲取腳本。, ...。
  • jQuery Colorbox 》查看最新的 WordPress 外掛優惠。, 一个用于 WordPress 的 Colorbox/Lightbox 外掛。, jQuery Colorbox 提供了 11 个不同的主题可供选择。请查看我的网站。, ...。
  • Lightbox for Gallery & Image Block 》這個 WordPress 外掛為標準 WordPress 圖庫及圖像區塊新增了一個簡單輕量的 Lightbox，它可以偵測文章是否包含圖庫或圖像區塊，然後載入並啟動 baguetteBox.j...。

文章
Filter
Apply Filters
Close
Mastodon