每月僅需 600 元起便能享有快速、安全及穩定的主機空間

如何以更自由的方式設計網站的頁首與頁尾,擺脫佈景主題的限制?(含建議做法與省錢技巧)

如何擺脫佈景主題的限制,以更自由的方式設計網站的頁首與頁尾?(含建議做法與省錢技巧)

/ 閱讀時間 5 分鐘 

最後更新時間 : 2023 年 8 月 16 日

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

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

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

認識頁首區域

頁首區域

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

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

  1. 透明頁首:按照字面上的意思理解是指頁首的樣式為透明狀態。
  2. 固定頁首:顧名思義是指你的頁首固定在網頁上方,即使向下捲動位置仍然保持不變。

全方位學 WordPress – 從架站到整合行銷 2.0 課程所教的 Astra 佈景主題為例,透明頁首是免費功能;固定頁首則是需要購買 Astra Pro 才能解鎖,不過課程有教你透過免費的方式實現。

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

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

Astra 頁首編輯器
▲ Astra 頁首編輯器
Blocksy 頁首編輯器
▲ Blocksy 頁首編輯器
Kadence 頁首編輯器
▲ Kadence 頁首編輯器

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

Elementor Pro 主題編輯器頁首範本
Elementor Pro 主題編輯器頁首範本

※ 省錢技巧:如果你想使用 Elementor 編輯網站的頁首,但又不想購買 Elementor Pro那麼可以透過 Elementor Header & Footer Builder 這款免費的外掛處理

個人偏好
我是比較傾向透過佈景主題製作頁首,因為效能較好且比較容易掌握,建議初學者先從此種方式開始學習。

認識頁尾區域

頁尾區域

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

至於頁尾的種類有哪些,原則上只有一種,頂多在外觀方面做變化,像是滾動視差的效果,詳細的操作步驟請洽 [頁尾區域:頁尾進階的操作技巧] 單元,有進一步說明。

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

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

▲ Astra 頁尾編輯器
▲ Blocksy 頁尾編輯器
▲ Kadence 頁尾編輯器

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

Elementor Pro 主題編輯器頁尾範本

※ 省錢技巧:如果你想使用 Elementor 編輯網站的頁尾,但又不想購買 Elementor Pro那麼可以透過 Elementor Header & Footer Builder 這款免費的外掛處理

個人偏好
我是比較傾向透過佈景主題製作頁尾,因為效能較好且比較容易掌握,建議初學者先從此種方式開始學習。
佈景主題頁首頁尾編輯器Elementor 主題編輯器
自由度
效能
掌握度
是否有提供範本沒有

這篇文章對您是否有幫助?

0 / 5

Your page rank:

不滿意現有網站的速度嗎?😥

我們提供的 WordPress 網站代管服務能讓你的網站快如閃電,進而提升使用者體驗與 SEO 排名。

全方位學 WordPress – 從架站到整合行銷 2.0

這是一門 WordPress 架站與 SEO 行銷課程,學完後便能擁有更全面的架站技能並且透過課程所教的行銷操作手法與資源,讓你的網站獲得更多曝光的機會,進而帶來收益。

在〈如何擺脫佈景主題的限制,以更自由的方式設計網站的頁首與頁尾?(含建議做法與省錢技巧)〉中有 2 則留言

    1. wei

      可以,Elementor Header & Footer Builder 已內建多種頁首常見的小工具,包含網站標誌、導覽選單及購物車…等等,所以你並不需要使用 Elementor Pro 或另尋其他的外掛。

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *


購物車

聯絡我們

請填寫以下表單,我們將盡速與您聯繫

聯絡資訊
需求確認


驅動

關於我們

驅動數位行銷成立於 2019 年,提供個人或企業在網路上的各種行銷解決方案,主要的服務項目包含:網頁設計、網站代管以及搜尋引擎最佳化。與其他網頁設計公司不同之處在於,我們是以獲得更多流量、名單、銷售與轉介紹為導向。

PRO 360 專家檔案