[WordPress] 外掛分享： Tippy

前言介紹

  • 這款 WordPress 外掛「Tippy」是 2008-07-04 上架。 目前已經下架不再更新，不建議安裝使用。
  • 目前有 1000 個安裝啟用數。
  • 上一次更新是 2013-11-06，距離現在已有 4197 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
  • 外掛最低要求 WordPress 2.5 以上版本才可以安裝。
  • 有 21 人給過評分。
  • 論壇上目前有 1 個提問，問題解答率 0%

外掛協作開發者

columcille |

外掛標籤

popup | tooltip |

內容簡介

f is set, the header of the tooltip will become a link with the specified URL.

Overall, this plugin provides a lot of flexibility in terms of customizing and configuring tooltips and popups in your WordPress posts. With a variety of options for positioning, animation, and appearance, users can create unique and engaging content for their audience.

原文外掛簡介

This plugin allows users to create custom popups or tooltips in their posts. The style and behavior of the tooltip are highly configurable through CSS and through the WordPress dashboard.
Shortcode Attributes
The following options can all be included as attributes in your shortcode. Default values, when applicable, are shown in parenthesis. Multiple possible values are listed in parenthesis with the default first.
Note that even though some of the attributes have changed from older versions, the old attributes should continue to work. You will not need to update shortcodes that use the old names.

autoshow (false/true): If true, the tooltip or tooltips will automatically show when the page loads.
showtitle (false/true): Whether or not to use the title attribute in links. Good for accessibility, bad for visibility.
hoverpopup (true/false): If true, tooltip displays when hovering over the link. If false, tooltip displays when the link is clicked.
showdelay (100): Adds a slight delay before displaying the tooltip to prevent popping up tooltips when the mouse moves across the page.
showspeed (200): How long it takes in ms for the tooltip to fade in.
hidespeed (200): How long it takes in ms for the tooltip to fade out.
autoclose (true/false): Whether or not the tooltip should automatically close after a delay.
hidedelay (1000): How long it takes in ms before the tooltip begins to auto fade out.
container: By default, the tooltip is placed in the DOM right where you set it but if you want to use Tippy for specific positioning, you can change its parent element by specifying a CSS selector here.
position (link/mouse/css position value): Specifies where the tooltip should be positioned. If set to link or mouse, the x and y values are automatically determined.
top: Useful when position set to fixed, absolute, or relative.
bottom: Useful when position set to fixed, absolute, or relative.
left: Useful when position set to fixed, absolute, or relative.
right: Useful when position set to fixed, absolute, or relative.
offsetx (10): Set a default horizontal offset for the tooltip position. Useful when position set to link or mouse.
offsety (10): Set a default vertical offset for the tooltip position. Useful when position set to link or mouse.
width: Specify a width for the tooltip. The default is set in jquery.tippy.css.
height: Specify a height for the tooltip. The default is set in jquery.tippy.css.
draggable (false/true): Allow visitors to drag the tooltip around. Useful when autoclose is false. Requires jQuery UI.
dragheader (true/false): If draging is enabled and this is set to true, tooltip will only be draggable from the header bar. If false, visitors can drag from any part of the tooltip.
anchor: Optional CSS selector specifying the link element that will trigger Tippy.
title: Sets the text shown on the link and in the header.
swaptitle: Alternate title to use when the visitor hovers over the link.
img: Tippy can be used with images rather than text; set img to the url of an image to display Tippy on an image.
swapimg: Like swaptitle, swapimg switches to an alternate image when a visitor hovers over the link.
href: If href is set, the Tippy link will point to this url.
target: Specifies the link target for the Tippy link.
showheader (true/false): Whether or not the tooltip should show a header.
headertitle: By default, the header is set to the tooltip title. With headertitle, you can set specific text for the title.
headerhref: If headerhref is set, the tooltip header text will be a link pointing to this url.
showclose (true/false): Whether or not the tooltip have a close link. Usefor for mobile devices or when autoclose is false.
closetext (‘close’): The text to display for the close link.
calcpos (‘parent/document’): Calculate the tooltip link position relative to its parent or to the whole document.
alttrigger: Specify an element to use as additional triggers for the tooltip. Be sure to include . or # – ie: .triggerClass or #triggerId.

各版本下載點

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

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

2.0.1 | 2.0.2 | 2.0.3 | 3.0.0 | 3.0.1 | 3.0.2 | 3.0.3 | 3.0.4 | 3.0.5 | 3.1.0 | 3.1.1 | 3.1.2 | 3.2.0 | 3.3.0 | 3.3.1 | 3.3.2 | 3.3.3 | 3.4.0 | 3.4.1 | 3.5.0 | 3.5.1 | 3.5.2 | 3.6.0 | 3.6.1 | 3.6.2 | 3.6.3 | 3.6.4 | 3.7.0 | 3.7.1 | 3.7.2 | 3.7.3 | 3.7.4 | 3.7.5 | 3.8.0 | 3.8.1 | 3.9.0 | 3.9.1 | 3.9.2 | 4.0.0 | 4.0.1 | 4.0.2 | 4.1.0 | 4.1.1 | 4.1.2 | 4.1.3 | 4.1.4 | 4.2.0 | 4.2.1 | 4.2.2 | 4.3.0 | 5.0.0 | 5.0.1 | 5.0.2 | 5.1.0 | 5.1.1 | 5.1.2 | 5.2.0 | 5.2.1 | 5.2.2 | 5.3.0 | 5.3.1 | 5.3.2 | 6.0.0 | 6.0.1 | 6.0.2 | 6.0.3 | 6.0.4 | 6.0.5 | 6.0.6 | 6.0.7 | 6.1.0 | 6.1.1 | 6.1.2 | 6.1.3 | 6.2.0 | 6.2.1 | trunk |

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

文章
Filter
Mastodon