[WordPress] 外掛分享： Really Simple Popup

前言介紹

  • 這款 WordPress 外掛「Really Simple Popup」是 2013-03-31 上架。
  • 目前有 500 個安裝啟用數。
  • 上一次更新是 2014-12-03，距離現在已有 3805 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
  • 外掛最低要求 WordPress 3.5.1 以上版本才可以安裝。
  • 有 10 人給過評分。
  • 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。

外掛協作開發者

huntlyc | daganlev |

外掛標籤

popup | fancybox |

內容簡介

一個簡單易用、採用fancybox風格的彈出視窗外掛。

此外掛可作用於你網頁內所有帶有Anchor Tag的圖片。若在同一頁面有多張圖片，此外掛會自動建立一個小型圖庫，讓你可透過按鈕或鍵盤上下頁瀏覽。進階使用者也可以輕鬆地在彈出視窗內開啟Iframe和HTML內容。

進階使用者
基本使用

要在圖片上啟用彈出視窗，請在該圖片的Anchor Tag中加入class：“hs-rsp-popup”。

進階使用

若要停用圖庫功能或令某張圖片不啟用彈出視窗，只需在其Anchor Tag上加上class: no-hsrsp-popup
要在彈出視窗中開啟Iframe內容，請將Iframe的src設定為href，並在Anchor Tag內部加上class：“iframe hs-rsp-popup”
要在彈出視窗中顯示HTML內容，請使用兩個Anchor Tag。首先，在href中加入欲顯示內容的元素ID，接著使用class：“hiddendiv hs-rsp-popup”。

範例

要彈出某張圖片，請在該圖片的Anchor Tag內加上class：“hs-rsp-popup”
例如: image

若要使用Iframe，請設定Iframe的src，然後在Anchor Tag內部加上class “iframe”，再結合 class “hs-rsp-popup” 使用:
觀看這個

你還可以使用此方法顯示HTML內容。若欲顯示本地內容，只需在href中輸入該元素的ID:
點擊這裡
Hello, World!

若欲顯示遠端內容，只需在href中輸入網頁的連結，例如：
點擊這裡

設定彈出視窗大小（圖片/Iframe）

你可以在連結中使用以下HTML5 Data Attribute 設定視窗大小： data-popupheight="100" data-popupwidth="300"，這些值的單位為像素。

例如：

注意：為了使此功能生效，你必須使用data-popupwidth和data-popupheight這兩個屬性。

原文外掛簡介

Simple, easy to use, fancybox style popup.
Works for all images in your page that are in anchor tags. If it finds more than one, it will create a small gallery you can navigate through with the buttons or your keyboard. Advanced users can open iframes and html content in it fairly easily.
Avanced users
Basic use
Anchor class for popup: “hs-rsp-popup”
Advanced use

disable gallery feature and popup for image by adding this class: no-hsrsp-popup
anchor classes for iframe popup “hs-rsp-popup iframe”
anchor classes for html popup “hs-rsp-popup hiddendiv”

Examples
To popup an image give the anchor tag around the image this class: “hs-rsp-popup”
Example: image
For an iframe, set the srct of the iframe and use the class “iframe” combined with “hs-rsp-popup”:
Watch this
You can also use this to show html content. For local content just use the id of the element for the href:
click here
Hello, World!
For remote content, link to the page, for example:
click here
Setting Popup Size (image/iframe)
You can use the following html5 data attributes in your link to set the size: data-popupheight="100" data-popupwidth="300" These values are in pixels.
For Example:

Note: for this to work, you have to use both the data-popupwidth and data-popupheight attributes.

各版本下載點

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

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

1.0 | 1.0.1 | 1.0.2 |

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

文章
Filter
Apply Filters
Close
Mastodon