內容簡介
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"]
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
