如何在沒有代碼的情況下創建自定義 WordPress 側邊欄
已發表: 2022-02-02您想學習如何在沒有代碼的情況下創建自定義 WordPress 側邊欄嗎?
精心設計的側邊欄可改善用戶體驗並為他們提供更好的導航。 但是使用默認的 WordPress 設置自定義側邊欄並不總是那麼簡單。 編碼更加困難。
在這篇文章中,我們將向您展示如何通過幾個簡單的步驟在 WordPress 中添加側邊欄。
為什麼要添加自定義 WordPress 側邊欄
邊欄提供了一種簡單而有效的方式來顯示您希望訪問者看到的重要信息。 在許多 WordPress 網站中,通常使用側邊欄來提供相關帖子、社交媒體頁面和 optin 表單的快速鏈接。
這有助於確保為用戶提供最佳用戶體驗,並允許您將訪問者指向您希望他們看到的站點區域。 因此,側邊欄使您能夠提高頁面瀏覽量、停留時間、參與度和轉化率。
儘管許多 WordPress 主題都帶有現成的側邊欄,但它們並沒有提供您通過某些 WordPress 插件獲得的那種簡單的視覺自定義。
SeedProd 是用於創建具有輕鬆拖放功能的側邊欄的最佳 WordPress 插件。 因此,我們將使用 SeedProd 向您展示如何在沒有任何代碼的情況下在 WordPress 中添加側邊欄。
如何在沒有代碼的情況下創建自定義 WordPress 側邊欄
要了解如何在 WordPress 中添加側邊欄,只需按照以下步驟操作:
- 安裝 SeedProd
- 選擇主題模板
- 自定義您的 WordPress 側邊欄
- 在側邊欄中添加聯繫表單
- 在 WordPress 側邊欄中添加最近的帖子
- 從側邊欄中刪除項目
- 保存更改並發布側邊欄
開始吧。
1. 安裝 SeedProd
首先,您需要在您的站點上安裝 SeedProd。 如果您不知道如何安裝它,請參閱本教程以了解如何安裝 WordPress 插件。
要訪問 SeedProd 的 WordPress 主題構建器功能(您需要創建一個側邊欄),您需要購買 SeedProd Pro 許可證。 當您購買並使用 SeedProd 創建帳戶後,請登錄您的帳戶區域並導航到“下載”選項卡。 在這裡,您將找到您的許可證密鑰。 複製它(我們稍後將需要它)。

從您的 WordPress 儀表板,導航到SeedProd »設置。 在此屏幕上,您應該會看到您的許可證密鑰字段。 在此處粘貼許可證密鑰,然後單擊“驗證”按鈕。

現在您的站點上設置了 SeedProd,讓我們使用一些模板來簡化側邊欄創建任務。
2. 選擇主題模板
在您的 WordPress 管理區域中,單擊SeedProd » Theme Builder。

這是主儀表板,您可以在其中控制所有不同主題元素的設置,包括側邊欄。
現在,單擊橙色主題按鈕。

SeedProd 為不同類型的企業和組織提供各種主題,包括營銷機構、餐館、抵押貸款經紀人等。 您可以選擇最適合您業務的主題,然後自定義側邊欄,直到它看起來完全符合您的要求。

對於這個例子,我們將使用 Starter 主題,它非常適合簡單的網站。 當您選擇主題時,您的主題構建器區域現在將自動填充構成主題的所有基本部分。

您可以根據需要啟用和禁用每個不同的部分。 由於在我們的示例中我們只打算為博客頁面使用側邊欄,因此我們只會啟用側邊欄和博客索引、存檔、搜索、部分。
使用已發布標題下的切換按鈕,我們禁用了主題的其他部分並將側邊欄保留為YES狀態。

現在,我們已經準備好開始自定義側邊欄了。
3. 自定義你的 WordPress 側邊欄
要開始自定義 WordPress 側邊欄,請將光標懸停在 SeedProd 主題構建器儀表板中的側邊欄選項上,然後單擊編輯設計。

這將打開主題生成器界面。 Starter 主題側邊欄默認啟用搜索欄、類別和社交媒體圖標。

但是您可以向側邊欄添加更多元素或用其他元素替換現有元素。 在左側窗格中,您會發現大量可以拖放到右側區域的塊,這是側邊欄的實時預覽。
下面,我們將向您展示如何執行一些常見的側邊欄自定義,但這些都是可選步驟。
在側邊欄中添加聯繫表單
在此示例中,我們將向您展示如何將簡單的聯繫表單添加到您的側邊欄。 但首先,請確保您已安裝 WPForms。 如果您需要這方面的幫助,請參閱有關安裝 WPForms 的文檔。
WPForms 自動與 SeedProd 集成。 因此,您使用 WPForms 創建的任何表單都可以使用 SeedProd 作為一個塊添加到您的側邊欄中。
為此,只需在“塊”選項卡下的搜索欄中輸入“聯繫表格”。 然後,將聯繫表格塊拖放到您想要放置在側邊欄上的位置。


將表單放在側邊欄後,單擊 WPForms 塊以打開表單選項。 從這裡,您可以添加一個已經創建的表單,甚至可以通過按下+New Form按鈕來創建一個新表單。
我們將通過單擊“選擇表單”下拉菜單並從列表中選擇一個來使用我們已經使用 WPForms 創建的表單。

這就是表格的樣子。

如果您需要編輯表格,請單擊編輯所選表格。 這將在同一窗口中打開 WPForms 構建器,您可以進行所需的更改,而無需離開主題構建器屏幕。

除此之外,您可以通過轉到“高級”選項卡來自定義表單的設計。 在這裡,SeedProd 提供了用於更改表單的樣式、屬性、間距和設備可見性的選項。
例如,如果您想在移動設備上查看您的網站時隱藏側邊欄,只需單擊“設備可見性”菜單,然後切換“在移動設備上隱藏”按鈕。

接下來,我們將向您展示如何在博客的側邊欄中添加最近的帖子。
在 WordPress 側邊欄中添加最近的帖子
再次使用主題構建器的“塊”選項卡下的搜索字段並輸入“最近的帖子”。 現在,將“最近的帖子”塊拖放到您希望它顯示的區域。

當新博客文章發佈在您的網站上時,“最近的帖子”小部件會自動填充。
如果您在小部件位於構建器的右側時單擊它,您可以訪問設置,例如控制您希望顯示的帖子數量。

我們的示例測試站點上只有 3 個帖子。 但是,將 5 個最近的帖子包含在您的側邊欄上顯示是一個很好的經驗法則。
從側邊欄中刪除項目
使用 SeedProd 主題構建器,從側邊欄中刪除元素就像添加新項目一樣簡單。
在我們的示例中,我們將從側邊欄中刪除搜索欄塊。 完全由您決定要從側邊欄中刪除哪些部分。 我們只是為了演示而刪除了搜索欄。
通常,最好的做法是讓側邊欄保持簡單和集中,因此盡量不要在側邊欄中包含太多小部件。
要刪除塊,請將鼠標懸停,直到要刪除的塊周圍出現橙色輪廓,然後按垃圾桶圖標。

然後,您將看到確認刪除操作的提示。 按是,刪除它! 按鈕繼續。

這就是從側邊欄中刪除任何塊或元素所需的全部內容。
4. 保存更改並發布側邊欄
當您根據自己的喜好自定義側邊欄後,單擊右上角的保存按鈕。

現在,單擊十字按鈕退出主題生成器。

此操作會將側邊欄添加到您的博客頁面。 從前端打開您網站的博客頁面以查看您新創建的 WordPress 側邊欄。 (在此示例中,我們僅啟用了社交媒體圖標和聯繫表格)。

就是這樣! 您現在知道如何在 WordPress 中添加側邊欄並對其進行自定義以使其看起來符合您的喜好。
接下來,設置電子郵件子域
您想維護您的電子郵件聲譽並保持較高的送達率嗎? 在這種情況下,您應該考慮設置一個電子郵件子域。 請參閱我們的電子郵件子域指南,了解如何更好地管理您的電子郵件聲譽並設置電子郵件子域。
您可能還想了解電子郵件的可傳遞性及其重要性。 您可以查看我們關於提高電子郵件送達率的文章以了解更多詳細信息。
準備好修復您的電子郵件了嗎? 立即開始使用最好的 WordPress SMTP 插件。 WP Mail SMTP Elite 包括完整的白手套設置並提供 14 天退款保證。
如果本文對您有所幫助,請在 Facebook 和 Twitter 上關注我們以獲取更多 WordPress 提示和教程。
