如何使用插件在 WordPress 中製作粘性側邊欄

已發表: 2020-12-27

“這篇文章包含附屬鏈接;這意味著如果您通過此頁面上的鏈接購物,我們將獲得佣金”

帶燈泡的牆上的便簽

如果您是此博客的常客,或者即使這是您第一次訪問,您可能已經註意到博客側邊欄上的一些粘性元素?

其中之一是時事通訊訂閱表格。

有時,我會用我想展示的其他重要元素來替換它。 就像在黑色星期五交易期間一樣。 我在側邊欄上粘貼了黑色星期五的博客文章類別。

您可以使博客上的任何元素具有粘性,無論它是什麼。 它可以是博客導航菜單、側邊欄項目、頁腳菜單、浮動小部件等。

主要目標是使其始終對您的博客用戶可見。

無論是向上還是向下滾動,粘性元素都會保持在原位並始終可見。 這有助於吸引對粘性項目的更多關注,提高轉化率,提高參與度等。

但首先,特別是對於初學者,讓我們定義什麼是粘性側邊欄? 為什麼你需要在側邊欄上粘貼你的博客元素?

什麼是 WordPress 中的粘性側邊欄?

WordPress 中的粘性側邊欄或固定側邊欄是在用戶上下滾動網站網頁時保持可見或保持在某個位置的側邊欄元素。

它可以提高號召性用語的參與率,提高轉化率,並改善整體用戶體驗。

例如,粘性側邊欄可確保用戶快速訪問您的重要消息。

用戶無需滾動回頂部以單擊所需的側邊欄菜單,而是可以快速找到側邊欄項目並單擊真正重要的內容,而無需向上滾動頁面。

為什麼要在博客上實現 Sticky SideBar?

在上一節中,我已經談到了在您的網站上實施粘性側邊欄的好處。 但值得在這裡走得更遠一點。

作為一個在他的博客上有過粘性側邊欄實踐經驗的人,我可以從我自己的經驗中告訴你更多它的好處。

首先,無論您在博客上添加什麼元素,任何訪問您網站的人都可以隨時看到該元素。

有了這個,您將更多地關注該特定元素。 所以你必須優先考慮你需要做的事情。

此外,當用戶訪問您的網站時,您希望確保他們能夠快速訪問您最重要的信息/頁面/內容等。您可以通過將這些重要元素粘在頁面上來實現這一點。

這有助於提高用戶參與度、提高轉化率、提高知名度等……

但是,我不建議在同一個網站位置設置太多的粘性元素。 例如,在側邊欄上,最大推薦應該是兩個粘性元素。

如果您有太多的粘性元素在同一個地方爭奪注意力,那麼您最重要的信息不會獲得更好的轉化率。

我只有搜索框和博客時事通訊訂閱表格粘在這個博客的側邊欄上。

博客時事通訊訂閱表單是側邊欄上最重要的元素。 正如你所看到的,我確保它在那個地方得到了整體的關注。

這是因為構建電子郵件列表位於優先級列表的頂部。

如何使用 WordPress 插件製作粘性側邊欄

與其他博客平台相比,WordPress 的優勢之一是能夠在不知道如何編碼的情況下快速啟用您想要的博客功能。

無論您想向 WordPress 博客添加什麼功能,都有一個插件。 您只需要安裝、激活和啟用/配置設置。

這就是使 WordPress 成為當今世界領先的內容管理系統的原因。 一個龐大的開發者社區很好地支持它。

WordPress 插件使您可以非常輕鬆地在您的博客上粘貼任何元素。 不需要編碼知識。 您只需要安裝和激活。

但是,為該任務找到合適的 WordPress 插件可能是一種乏味的搜索體驗。 您可能會花費數小時尋找合適的插件。

所以我打算在這裡做的是省去你的猜測。

今天有很多 Sticky Sidebar WordPress 插件,但我發現My StickySidebar WordPress 插件非常易於使用和配置。

我的 StickySidebar WordPress 插件可讓您在幾分鐘內輕鬆設置粘性側邊欄元素。 您可以使用 My Sticky Sidebar 插件在 WordPress 中創建一個粘性浮動側邊欄小部件。

它使過程變得簡單,即使對於初學者也是如此。

安裝我的 StickySidebar 插件

設置粘性側邊欄項目需要做的第一件事是安裝插件。 之後,你激活它......

這是 WordPress.org 插件存儲庫上 MyStickySidebar 的鏈接。 從 WordPress.org 或您的 WordPress 管理區域下載插件。

安裝激活後,需要打開設置頁面配置插件。

我的 Sticky Sidebar WordPress 插件設置頁面

您需要找到兩個 CSS 元素類或 ID。

您要使其具有粘性的邊欄元素,以及邊欄元素中包含的容器元素類或 id。

在側邊欄元素 CSS 類或 ID 字段中,您需要輸入要使其具有粘性的側邊欄元素類或 ID。

如果您選擇查看頁面源代碼以查找側邊欄元素 CSS 類或 ID,則可能會很乏味。 您可以通過頁面源代碼找到它,但是通過源頁面查找類 id 需要一些技術技能。

但是,您可以在這篇文章中了解如何查找 CSS 類或 id。

找到 CSS 類或 id 後,您需要在字段中輸入值,如上圖所示。

然後向下滾動頁面以單擊“保存”按鈕。

其他設置

您可能需要查看其他設置,例如頁邊距的頂部和底部。 您可以在此處定義 Pixel 中的頂部和底部邊距。

此外,如果用戶的屏幕寬度小於 xxx 像素,您可以將規則設置為禁用。

My Sticky Sidebar WordPress 插件設置頁面 2

添加自定義 CSS 樣式

如果您使用的是付費版本的 MyStickySidebar,您可以編輯 CSS、添加或完全創建自定義 CSS。

如果您擅長編碼並且知道自己在做什麼,這些額外的功能會很有用。

可以選擇在選定頁面上禁用 MyStickySidebar。 這是為了以防您不希望某些頁面上的粘性側邊欄。

在對默認設置進行任何更改後,請記住始終點擊頁面下方的保存按鈕。

My Sticky Sidebar WordPress 插件設置頁面 3

結論…

您可能希望在側邊欄上設置粘性元素的原因有很多。 不管是什麼,請確保您不會中斷博客上的用戶體驗。

如果做得好,粘性側邊欄應該可以改善用戶體驗,並將您的重要信息帶到觀眾視野的最前面和中心。

我的 Sticky Sidebar 是最好的免費 WordPress Sticky 插件之一,您可以使用它來實現您的目標。