WordPress中使用Elementor製作網站Footer

文章最後更新於2025-10-22

跟使用Elementor製作網站的Header一樣,製作網站的Footer也類似,也是有兩種方法。

  1. 使用Elementor Pro專業版製作網站Footer
  2. 使用Elementor免費版+ Elementor Header & Footer Builder這個WordPress外掛程式製作網站Footer

使用Elementor Pro專業版製作網站Footer

我們安裝了Elementor Pro之後,點擊“Templates” –> “Theme Builder”

進入到以下介面,我們滑鼠移動至左側的“Footer”,點擊“+”號。

然後進入到Elementor的視覺化編輯頁面。

這個其實跟普通的點擊「Edit with Elementor」進來的頁面一樣,差別是從這裡面進去會跳出一個彈框讓我們選擇模板:

選擇合適的Footer模板,然後點選「Insert」插入。

但如果需要使用模板,需要我們將網域跟Elementor帳號關聯起來,如果沒有的話,註冊一個即可。

註冊成功並關聯網站之後,我們就可以成功插入Footer了。

如果你不需要使用模板,我們也可以從零開始搭建,就直接關掉這個介面,也不需要關聯我們的Elementor帳號。

不管是基於模板的樣式上還是從零搭建,我們都可以透過拖曳的方式添加小部件,同時點擊小部件打開小部件的選項卡來調整樣式。

或點擊容器來調整容器之間的間距和寬度,使其符合你的審美觀。

設計完以後,點選右上角的Publish旁邊的下箭頭,點選「Display Conditions」。

這個選項是讓我們選擇在什麼情況下展示該Footer。

我們在這裡設定整站展示,那麼就點選“Add Conditions”,選擇“Include”–>“Entire Site” 即可將該Footer套用至全站。

關掉該窗口,然後點擊右上角的Publish,即可發布。

使用Elementor免費版+Elementor Header & Footer Builder製作網站Footer

在外掛程式市場中搜尋並安裝Elementor Header & Footer Builder外掛程式。

啟用後,透過「Appearance」 –> “Elementor Header & Footer Builder” –> “ADD NEW”新網站的Footer。

我們設定Type of Template為“Footer”,Display On 設定為“Entire Website”。點選“Save Draft”儲存設定。

最後點選「Edit with Elementor」進入到視覺化編輯介面。

我們新建一個Flexbox容器(Container),然後透過設定容器佈局、拖曳添加小工具、調整樣式來製作自己的網站Footer

Elementor Header & Footer Builder的這個插件給我們一些免費的小部件來製作Footer。

找到你所需要的小部件,拖曳至右側容器內。

設計完以後,點選右上角的Publish旁邊的下箭頭,點選「Display Conditions」。

這個選項是讓我們選擇在什麼情況下展示該Footer。

我們這裡還是設定整站展示,那麼就點選“Add Conditions”,選擇“Include”–>“Entire Site” 即可將該Footer套用到全站。

關掉該窗口,然後點擊右上角的Publish,即可發布Footer。

返回頂端
Generic selectors
Exact matches only
Search in title
Search in content
Post Type Selectors