前言介紹
- 這款 WordPress 外掛「SV Sticky Menu」是 2017-06-21 上架。
- 目前有 10 個安裝啟用數。
- 上一次更新是 2017-09-11,距離現在已有 2792 天。超過一年沒更新,安裝要確認版本是否可用。以及後續維護問題!
- 外掛最低要求 WordPress 4.0 以上版本才可以安裝。
- 尚未有人給過這款外掛評分。
- 還沒有人在論壇上發問,可能目前使用數不多,還沒有什麼大問題。
外掛協作開發者
andreysv |
外掛標籤
top | menu | fixed | sticky | transiton |
內容簡介
這是一個小而功能強大的外掛,可以將橫向頂部菜單在滾動時固定在頂部。外掛支援動態響應式內容,可以動態停止和恢復功能。在轉換時可以隱藏其他物件,例如固定菜單可能會呈現不同的外觀。
固定物件的標識基於 CSS 選擇器。
功能
在固定菜單時可以排除特定物件。這樣可以在不同狀態下創建不同的菜單顯示方式。
在固定菜單中,您可以添加帶有鏈接的標誌圖像。
創建了一系列動畫來實現從一個狀態轉換到另一個狀態,您可以在設置中選擇這些動畫。
在設置中,您可以更改固定菜單的背景顏色,進一步區分其兩種狀態。在設置中,您還可以指定固定菜單的陰影是否存在以及陰影的顏色。這將使網站看起來更具有立體感。
設置列表
CSS 選擇器類或 ID - 主要字段設置 CSS 標準中的類名標識符。在默認情況下,主題“Twenty Ten”或“Twenty Fourteen”中使用“.navbar”。
用於隱藏對象的 CSS 選擇器 - 設置用於隱藏菜單吸附時所需的物件的 CSS 標準中的類(es)的標識符。
設置背景顏色 - 啟用背景顏色的複選框。
固定對象的背景顏色 - 如果啟用,則可以選擇背景顏色的控件。
選項卡 - 固定菜單的不透明度。
最小媒體寬度 - 設置響應主題中停用黏貼菜單的媒體寬度字段。
選擇過渡效果 - 從列表中選擇過渡類型的欄位。現在外掛支援五種過渡方式:滑動、淡入淡出、縮放、旋轉、斜切和自定義。對於自定義過渡,外掛包括文件plugins/sv-sticky-menu/css/style.css。該文件包含一些預設過渡效果,但您也可以添加自己的過渡效果。
開始位置 - 用於滑動過渡的欄位,指示開始滑動的位置,默認值為-55像素。
過渡時間 - 設置過渡時間的欄位,默認值為0.4秒。
對象的 Z 軸索引 - 在某些情況下,菜單可能被隱藏在其他物件下面,這意味著菜單的 Z 軸索引太低。默認情況下,此字段的值為99。
顯示陰影 - 啟用菜單陰影的複選框。
影子顏色 - 如果已啟用,則可選擇影子顏色的控件。
影子透明度 - 輸入影子不透明度的控件。
顯示標誌 - 啟用黏貼菜單中的標誌的複選框。
標誌圖像 - 從媒體庫中選擇標誌圖像的控件。
標誌高度 - 設置標誌圖像高度的控件。
標誌 URL - 設置標誌 URL 的控件。
已測試的主題
該外掛已在以下幾種主題上進行過測試:
* Twenty Ten 2.3
* Twenty Fourteen 2.0
* Storefront 2.2.3
* Bluestreet 1.2.2
* Rara Academic 1.0.8
* Bakes And Cakes 1.1.1
* Wallstreet 1.7.7.4
已測試的瀏覽器
PC Chrome
PC Firefox
PC Opera
PC IE11
原文外掛簡介
Small but functional plugin for transforming horizontal top menu to fixed on top when scrolling. Plugin supports dynamic responsive content, dynamicly stop and restore functionality. Can hide other objects when converting, i.e. the sticked menu can look different.
Identification of sticked object based on CSS selector.
Features
The ability to exclude objects when the menu is sticked. This makes it possible to create a different display of menus in different states.
In the sticked menu, you can add a logo image with a link.
To transform from one state to another have been created a series of animations that you can select in the settings.
In the settings, you can change the background color for a sticked menu, which will further distinguish its two states. Also in the settings you can specify the presence and color of a shadow for a sticked menu. This will give the site a more three-dimensional look.
Settings list
CSS Selector class or id – Main field for set the identifier of class name in CSS standard. By default in themes ‘Twenty Ten’ or ‘Twenty Fourteen’ used ‘.navbar’.
CSS Selector for hiding objects – Field for set the identifier(s) of class(es) in CSS standard for objects that need hide while menu is sticky.
Set background color – Checkbox for activating the background color.
Background color of sticky object – The control for selecting the background color if it is activated.
Opacity – Opacity of the sticked menu.
Minimum media width – Field for set media width for deactivating sticking menu in responsive themes.
Select transition – Field for selecting transition type from the list. Now plugin support five transition: Slide, Fade, Scale, Rotate, Skew and Custom. For Custom transition plugin includes file plugins/sv-sticky-menu/css/style.css. As examples this file has some preset transitions but you can include yours own.
Start position – Field used for Slide transition and indicated start sliding position. By default starting position is -55 pixels.
Transition time – Field to set the time of transition. By default 0.4 second.
Z-index of object – In several cases menu can hide benease other objects. Thet’s mean that z-index menu is to low. By default this field has value 99.
Show shadow – Checkbox for activating the menu shadow.
Shadow color – The control for selecting the shadow color if it is activated.
Shadow opacity – The control for input of the shadow opacity.
Show logo – Checkbox for activating the logo in the sticked menu.
Logo image – The control for selecting the logo image from media library.
Logo height – The control for set the logo image height.
Logo URL – The control for set the logo URL.
Themes where plugin was tested
The plugin has been tested with several themes:
* Twenty Ten 2.3
* Twenty Fourteen 2.0
* Storefront 2.2.3
* Bluestreet 1.2.2
* Rara Academic 1.0.8
* Bakes And Cakes 1.1.1
* Wallstreet 1.7.7.4
Tested on
PC Chrome
PC Firefox
PC Opera
PC IE11
各版本下載點
- 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「SV Sticky Menu」來進行安裝。
(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。
1.0.0 | 1.0.1 | 1.0.2 | 1.0.3 | 1.0.4 | 1.0.5 | trunk |
延伸相關外掛(你可能也想知道)
Sticky Menu & Sticky Header 》這款 WP Sticky Menu (或 Sticky Header) On Scroll 外掛能讓你在往下滾動並滑動到頂部時,讓任何頁面上的元素保持固定位置。通常會用於讓導覽列固定在頁面上...。
JetSticky For Elementor 》JetSticky 是一款外掛,可讓使用 Elementor 建立的區段和欄位具有固定效果,在頁面向上或向下滾動時總是保持在視線中。, 當您需要將標題和區塊固定在畫面上時...。
Sticky Side Buttons 》這個簡單的按鈕創建工具讓您可以創建一個或多個浮動按鈕,當使用者滾動時,這些按鈕會固定在網站的側邊。, 它可以用來黏貼以下資訊:, , 電話號碼, 電子郵件...。
Ocean Stick Anything 》這是一個簡單的外掛程式,可以讓你輕鬆地停駐任何你想要的內容。, 這個外掛程式需要安裝OceanWP主題。。
Sticky Social Icons 》「Sticky Social Icons」是一款最佳、也許唯一能夠將社群媒體圖示顯示在您網站側邊的外掛程式之一。您可以選擇您喜愛的社群媒體圖示,在網站中展示它們。您還...。
Oceanwp sticky header 》簡單易用的固定標題安裝, 啟用外掛後,固定標題就會立即開始運作。, 如何停用固定標題?, 您可以從設置頁面中的管理員選單下方的「外掛」中停用外掛。, 是否...。
WP Sticky Sidebar – Floating Sidebar On Scroll for Any Theme 》WP Sticky Sidebar 外掛可以讓您的浮動側邊欄一直顯示,當使用者滾動網頁時,它將永久可見。預設側邊欄的最大問題是只有在使用者能看到側邊欄區域時,才能使...。
Sticky Posts – Switch 》這個外掛為文章管理列增加了一欄,讓你可以輕易地將文章標記為置頂狀態。, 文章置頂 (Sticky Posts) 是 WordPress 僅適用於文章的功能,透過這個外掛,你可以...。
Sticky Block for Gutenberg Editor 》概述, Gutenberg黏貼區塊可以添加到任何文章或頁面中,當滾動頁面時,當它到達頁面頂部時就會固定在那裡。可將任何其他的區塊(段落,圖像等)添加到黏貼區塊...。
Floating Button 》d get help with any issues you may encounter by visiting the Floating Button plugin support page: https://wordpress.org/support/plugin/floating-but...。
Dashboard Sticky Notes 》Dashboard Sticky Notes 外掛新增了在儀表板中加入便簽的功能。您可以指定便簽的內容(一般或是側邊欄)、優先級(高或低)和對象(使用者角色或使用者自身)...。
WPC Sticky Add To Cart for WooCommerce 》使用「置頂加入購物車」功能是提升電商網站用戶體驗的最常見方法之一。這樣可以在瀏覽商店時準備更便捷和更快速的結帳流程。許多研究已經顯示,使用「置頂加...。
Sticky Anything 》使用這個外掛可以讓網站上的任何元素都可以固定在頁面上,像是側邊欄、標題、呼籲等等。我們使固定過程變得超簡單!, 關鍵點, 在一個頁面上固定多個元素。在...。
Seamless Sticky Custom Post Types 》此外掛沒有任何設置或自訂功能。將自訂文章類型設為置頂就像對普通文章一樣,這些文章ID將包含在 get_option('sticky_posts') 結果中。, 請注意,為了盡可能...。
Expire Sticky Posts 》這是一個簡單的外掛程式,可讓您在文章上設定到期日期。一旦文章過期,它將不再固定在頂部。, 如果您發現漏洞或有建議或改進要提交,此外掛程式可在Github上...。