Shopping Cart

購物車內沒有任何商品。

快速、安全及穩定的主機空間能提升網站 SEO 排名與使用者體驗

如何擺脫佈景主題的限制,以更自由的方式設計網站的頁首與頁尾?

不論是 AstraBlocksy 還是 Kadence 佈景主題都有內建頁首與頁尾編輯器,你可以在外觀自訂器中以所見即所得的方式新增各種元素,像是選單、按鈕及社群圖示。

但是有些時候,你可能不滿足佈景主題有限的設定選項,想要突破既有的框架,以更自由的方式設計頁首頁尾。

因此,本篇文章會介紹一款免費的外掛,它能讓你使用 Elementor 編輯器自訂頁首和頁尾,即使沒有透過 Elementor Pro 也能實現。

認識頁首區域

頁首區域是網頁版面配置的四大區域之一,位置處在頁面的最上方,一般來說不會因為換頁而消失,除非你刻意停用。

至於頁首的種類有哪些,主要有透明頁首與固定頁首兩種,如下:

  1. 透明頁首:按照字面上的意思理解是指頁首的背景為透明狀態。
  2. 固定頁首:顧名思義是指你的頁首固定在網頁上方,即使向下捲動畫面,頁首的位置仍然保持不變。
全方位學 WordPress – 從架站到整合行銷 2.0

Astra 佈景主題為例,透明頁首是免費功能;固定頁首則要購買 Astra Pro 才能解鎖。但其實有免費方法可以實現,細節會在付費課程中說明。

如何製作頁首?(2 種方法)

製作頁首的方法主要有 2 種,第一種方法是透過佈景主題內建的頁首編輯器,目前市場上主流的 3 個佈景主題 (AstraBlocksyKadence) 都有這項功能,完全免費,不需要付費擴充。

另一種方法是使用 Elementor Pro 主題編輯器製作,預設提供 30+ 頁首範本讓你使用,相當多元。

重點筆記
  1. 省錢技巧:如果你想使用 Elementor 編輯網站的頁首,但又不想購買 Elementor Pro,可以使用 Elementor Header & Footer Builder 這款免費外掛。
  2. 個人建議:我比較傾向透過佈景主題製作「頁首」,因為效能較好且比較容易掌握,建議初學者先從此種方式開始學習。

認識頁尾區域

頁尾區域也是網頁版面配置的四大區域之一,位置處在頁面的最下方,與頁首相同都不會因為換頁而消失,除非你刻意停用。

至於頁尾的種類有哪些,原則上只有一種,頂多在外觀方面做變化,像是滾動視差的效果,細節會在付費課程中說明。

如何製作頁尾?(2 種方法)

方法一:只要你所選用的佈景主題有頁首編輯器,原則上也都會有頁尾編輯器。以 AstraBlocksyKadence 佈景主題為例,頁尾編輯器已內建且不需要付費就能取得。

方法二:如果你使用的佈景主題沒有頁尾編輯器,那麼不妨試試 Elementor Pro 主題編輯器,它能以較彈性的方式製作頁尾,預設提供 30+ 頁尾範本讓你選擇,非常多樣。

重點筆記
  1. 省錢技巧:如果你想使用 Elementor 編輯網站的頁首,但又不想購買 Elementor Pro,可以使用 Elementor Header & Footer Builder 這款免費外掛。
  2. 個人建議:我比較傾向透過佈景主題製作「頁尾」,因為效能較好且比較容易掌握,建議初學者先從此種方式開始學習。

製作頁首頁/尾方式的比較

佈景主題頁首頁/尾編輯器Elementor 主題編輯器
自由度
效能
掌握度
是否有提供範本沒有
加入 Facebook 社團

文章瀏覽次數:14

SEO 服務

不滿意現有網站的流量嗎?網站排名始終無法超越進爭對手?如果你有這些煩惱,歡迎參考本站提供的 SEO 服務。

需要你的支持

如果你在本站有學習到東西,歡迎提供反饋,以便我們確認方向正確。當我們收到資料後,會另外幫你免費宣傳。你的支持是我們繼續創作的動力!

內容檢查清單

如果你想讓網站的內容更具競爭力,除了透過 SEO 外掛輔助外,也建議搭配我們所製作的內容檢查清單,內含 17 個檢查項目及 42 個最佳做法。此外,還會教你如何將檢查清單新增至 WordPress 網站上。

全方位學 Wordpress – 從架站到整合行銷 2.0
  • 講者 24 小時內親自回覆問題,安心有保障
  • 優先推薦免費工具,幫你省荷包
  • 只推自己正在用的付費工具,不會為了傭金讓你繞遠路,真實誠懇
  • 注重效能,畢竟這會影響使用者體驗與 SEO 排名
  • 數 10 種學習資料,非常豐富
  • N 個獨家資源
  • 定期分享最新資訊
  • 300+參考指引
  • 內容 & 範本資料庫 (獨創)
  • AI 驅動,有效提高工作效率
喜歡請分享!
wei
wei

協助中小企業提升網站在搜尋結果頁上的能見度,以便獲取更多流量進而增加成交機率。

開啟目錄