[WordPress] 外掛分享: Red Eyes Froggy Buttons

首頁外掛目錄 › Red Eyes Froggy Buttons
WordPress 外掛 Red Eyes Froggy Buttons 的封面圖片
⚠ 此外掛已下架 — 不再更新維護,建議勿安裝。
10+
安裝啟用
尚無評分
414 天前
最後更新
問題解決
WordPress 4.0.1+ v1.4.1 上架:2023-02-27

內容簡介

Red Eyes Froggy Buttons 是一款免費但附帶部分功能的外掛程式 (Fremium plugin)。這表示您可以使用免費版本,並享受所有的功能,沒有任何限制。付費版本目前正在開發中。稍後會有更多相關資訊。

透過 Red Eyes Froggy Buttons 外掛程式,您可以輕鬆地向您的按鈕、鏈接等加上 CSS3 滑鼠懸停效果。您可以設定要影響程式的元素。

設置頁面分成兩個主要區域。

總體設置區

總體設置區中您可以選擇

在每個按鈕、鏈接、提交輸入框 (input of type "submit") 和按鈕輸入框 (input of type "button") 中套用效果

除菜單中的按鈕和鏈接以外,在每個按鈕、鏈接、提交輸入框和按鈕輸入框中套用效果

在按鈕、鏈接、提交輸入框和按鈕輸入框中套用效果,但不影響普通鏈接

除菜單中的按鈕以外,在按鈕、鏈接、提交輸入框和按鈕輸入框中套用效果,但不影響普通鏈接

僅在特定類別中使用效果

此外,您甚至可以排除一個或多個類別。

效果設置區

設置頁面的效果設置區中,您可以

從 25 個效果中選擇要使用的效果

設定基本顏色 (第二個顏色會自動計算以確保背景與文字之間的最佳對比度)

設置按鈕寬度

設置按鈕高度

設置邊框寬度

設置邊框半徑

設置動畫持續時間

如果效果需要,則會提供更多控制陰影的選項

鳴謝設置區

還有第三個區域,鳴謝設置區,您可以在其中找到原始 CSS 代碼的鏈接,通常保存在 CodePen 上。

付費版本的外掛程式

Red Ryes Froggy Button Premium 還在開發中,不久後即將推出。
在這個付費版本中,
– 將為每個效果創建一個 shortcode,因此您可以在同一頁面上放置甚至帶有不同效果的按鈕
– 額外提供 26 個效果
– 您可以選擇使用自動顏色模式,讓外掛程式完成所有工作,或選擇完整的顏色控制並手動設置:
– 背景顏色
– 滑鼠懸停時的背景顏色
– 文字顏色
– 滑鼠懸停時的文字顏色
– 邊框顏色
– 滑鼠懸停時的邊框顏色
– 陰影顏色 (如果效果需要)

外掛標籤

開發者團隊

⬇ 下載最新版 (v1.4.1) 或搜尋安裝

① 下載 ZIP → 後台「外掛 › 安裝外掛 › 上傳外掛」
② 後台搜尋「Red Eyes Froggy Buttons」→ 直接安裝(推薦)
📦 歷史版本下載

原文外掛簡介

Red Eyes Froggy Buttons is the only one plugin which allows you to easily add css3 hover effects to your buttons, links etc. without writing css code by yourself. You can choose between 25 hover effects in the free version and 26 more effects in the Premium version.
More effects will be added in the future and more controls over the different aspects of each effect will be added as well.
All the CSS code used by this plugin is freely available on the web. Although in many cases I had to make important changes, I’m not a CSS expert and I don’t want to take any credit for the CSS code used here. The goal of this plugin is to make that code easy to use and customize from within the WordPress admin section, trying to make it dynamic and self-adaptable to the different styles used by WordPress theme authors.
Every effect can be customized directly in the plugin settings page, using intuitive and easy to use controls. In the Premum version, get a more granular control over the colors to use for text, borders and background in normal and hover states.
In addition, the Premium version allows you to use shortcodes. The magic of this feature is that you can use a different effect for each button you put in your web page! In fact the shortcode will load only the css stylesheet which contains the rules for that specific effect.
Free features

set the elements the effects will be applied to:

every button, link, input of type “submit” and input of type “button”
every button, link, input of type “submit” and input of type “button” except button and links in your menus
buttons, links, inputs of type “submit” and inputs of type “button” but not to he nornmal links
buttons, links, inputs of type “submit” and inputs of type “button” but not to he nornmal links except button in your menus

apply effects only to a specific class
set one or more excluded class(es) the effect won’t be applied to
all elements with the class “norefbutton” will be automatically ignored by the plugin
choose among the 25 effects available
set the main color for your buttons: a second color will be automatically calculated by the plugin
set the button min width
set the button min height
set the border width
set the border radius
set the Animation duration
if required by the effect, some more controls to set shadows will become available

Premium features

26 more effects
ability to set colors automatically (as in the free version) or manually. In this case you can set

different text colors in normal and hover states
different border colors in normal and hover states
different background colors in normal and hover states

shortcodes: you can use them together with the automatic mode or as an alternative to it. Using shortcodes allows you to use different effects for different buttons on the same web page

The Credits section
Here you can find the names of the CSS authors and the links to their original CSS code.

延伸相關外掛

文章
Filter
Apply Filters
Mastodon