前言介紹
- 這款 WordPress 外掛「Red Eyes Froggy Buttons」是 2023-02-27 上架。
- 目前有 10 個安裝啟用數。
- 上一次更新是 2025-01-29,距離現在已有 95 天。
- 外掛最低要求 WordPress 4.0.1 以上版本才可以安裝。
- 尚未有人給過這款外掛評分。
- 還沒有人在論壇上發問,可能目前使用數不多,還沒有什麼大問題。
外掛協作開發者
外掛標籤
CSS3 | buttons | hover effects |
內容簡介
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 個效果
– 您可以選擇使用自動顏色模式,讓外掛程式完成所有工作,或選擇完整的顏色控制並手動設置:
– 背景顏色
– 滑鼠懸停時的背景顏色
– 文字顏色
– 滑鼠懸停時的文字顏色
– 邊框顏色
– 滑鼠懸停時的邊框顏色
– 陰影顏色 (如果效果需要)
原文外掛簡介
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.
各版本下載點
- 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「Red Eyes Froggy Buttons」來進行安裝。
(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。
1.0.0 | 1.0.1 | 1.0.2 | 1.0.3 | 1.0.4 | 1.0.5 | 1.0.6 | 1.0.7 | 1.0.8 | 1.0.9 | 1.1.0 | 1.1.6 | 1.1.7 | 1.1.8 | 1.1.9 | 1.2.0 | 1.2.1 | 1.2.2 | 1.2.3 | 1.2.4 | 1.2.5 | 1.2.6 | 1.2.7 | 1.2.8 | 1.2.9 | 1.3.0 | 1.3.1 | 1.3.2 | 1.3.3 | 1.3.4 | 1.3.5 | 1.3.6 | 1.3.7 | 1.3.8 | 1.3.9 | 1.4.0 | 1.4.1 | trunk |
延伸相關外掛(你可能也想知道)
Image Hover Effects For WPBakery Page Builder 》圖像懸停效果 - WPBakery Page Builder 是一個令人驚嘆的外掛程式,可讓用戶在圖像上添加40多種帶標題的懸停效果。此附加元件為 Visual Composer 添加了20個...。
Easy Textillate 》這個外掛允許你在文章、頁面或網站元件中使用shortcode向任何文字添加動畫,你也可以使用PHP代碼直接將文字動畫添加到主題檔案中。, 這個外掛完全利用了Texti...。
Animated Blocks on Scroll 》這款WordPress外掛可在Gutenberg區塊上添加滾動式動畫。, 功能, , 從76種經過跨瀏覽器測試的CSS3動畫中選擇適合的,或者添加自定義動畫。, 在編輯器中預覽動...。
Tabs For WPBakery Page Builder (formerly Visual Composer) 》WPBakery Page Builder 的標籤唯一且首個插件, 這款 WPBakery Page Builder 的標籤插件非常簡單,它允許使用者將任何內容以不同的風格及配色方案放入標籤中。...。
Progress Bar 》此外掛只做一件事:建立一個簡單(但看起來不錯)的 CSS3 進度條,您可以使用自己的 CSS 进行樣式設計,並使用一個簡單的 shortcode 在任何地方使用。現在支...。
Page Transition 》Page Transition 是一個簡單易用的 WordPress 外掛程式,可使用 CSS3 動畫效果添加頁面轉換。讓您的網頁展現現代化的動畫效果。, 您可以為頁面進入和離開時分...。
Dynamic Word Spinner: CSS3 Animated Rotation 》CSS3 Rotating Words 可讓使用者添加多個詞語在一個句子中,並使用 CSS3 動畫效果隨機更換。, 您可以在一個句子中添加多個詞語,並在經過一段時間後更換成另...。
Standout CSS3 Buttons 》這款外掛參考Brian Gardner的博客文章,使用簡碼在您的網站上顯示時髦的CSS3梯度按鈕。, 您還可以在functions.php或插件中調用該外掛程序。可以選擇多種不同...。
Image Over Image For WPBakery Page Builder 》Image Over Image 是一個 WPBakery Page Builder 擴充套件,可以讓你在圖片上方加入一個圖片效果,當滑鼠移動過該圖片時,原有圖片便會被替換。此外,它還含...。
SvegliaT Buttons 》『SvegliaT Buttons』是一個簡單的 WordPress 外掛,可以透過 shortcode 在部落格中放置 CSS3 按鈕。, 您可以在 WordPress 中加入 shortcode,來展示好看且有...。
Easy Shortcode Buttons 》曾經想在您的網站上添加漂亮的下載連結嗎?需要添加號召行動的按鈕,但不想編寫程式碼?Easy Buttons 就是答案。這是將漂亮的按鈕添加到 WordPress 網站的最...。
Nice page transition 》這款 WordPress 外掛可以讓你選擇 6 種美麗的頁面轉場效果。 示範影片。你也可以在我的商店中查看其他 WordPress 專業外掛。。
Sliding Enquiry Form 》滑動詢價表單是一個簡單、易用且可完全自定義的 WordPress 外掛,可用於添加固定位置的彈出窗口,如頁腳左側、頁腳右側、左側或右側,並具有 CSS3 特效。, 使...。
HTML5 Slideshow Presentations 》屏幕展示外掛, , 使用本外掛,您可以利用 WordPress 原生工具建立簡報,而最好的部分是:完成後不需要上傳到 SlideShare。您可以隨時在自己的網站上分享/呈現...。
Amazing WPBakery Page Builder Addons 》這款外掛包含了超級實用的 WPBakery Page Builder 元素,擁有大量的選項,可以免費取得 WPBakery Page Builder 的所有功能,幫助您實現任何設計。, 您可以憑...。