專注於架設企業網站,分享WordPress教學和Elementor教學

如何使用Elementor Pro製作文章列表頁範本(視頻)

更新日期:2024-07-26
本系列教學

正版分銷:

90元/1個網站/2年

最先進的WordPress頁面編輯器,能夠快速創建高端的、完美的網站。 適合任何主題,任何頁面,任何設計。
加入讀者學習群
我用的頁面編輯器
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我

你是否想定製博客文章的列表頁,但主題又不支援修改? 有了Elementor Pro外掛,我們便可以突破主題的限制。 讓我們一步步演示給你看~

用Elementor Pro外掛,還能省付費主題的錢,譬如我直接用Hello Elementor免費主題,直接用Elementor Pro導入範本庫的文章列表範本頁(下方有視頻),或者自己製作文章列表頁範本。

如果你購買了付費主題,又習慣用Elementor編輯器,最好先看看主題的介紹中是否寫明支援Elementor編輯器,通常付費主題都會提供Blog Grid等博客/文章列表頁,譬如下圖是一個製造商類付費主題的博客列表範本。

blog archive template

接下來,我們進入正題

製作文章列表頁範本

下方是文字版教學

首先,點擊左側菜單template> add new,選擇範本類型為archive,輸入名稱,點擊 create template進入

elementor pro archive template

然後,在範本庫中找一個你喜歡的或接近你喜歡的範本,點擊Insert插入按鈕

elementor pro archive template 2

待導入完成後,請根據需要調整頁面上的元素塊的各項設置,下面的幾篇教學應該對你有用:

接下來,當調整完頁面細節后,請點擊左下角的update按鈕,設置display condition(範本頁的展示條件),如下圖所示,通常選擇all archives即可; 如若你希望不同的列表頁採用不同的範本,那麼可以創建多個範本,每個範本選擇不同的展示條件。

elementor pro archive template 3
  • all archives:表示適合所有類型的文章列表,包含以下所有類型,這是最常用的條件選項
  • author archive:表示按作者維度的文章列表頁範本,以作者來區分文章,通常也用不上,所以不用為它單獨做範本
  • date archive:表示按日期維度的文章列表頁範本,通常也用不上,所以不用為它單獨做範本
  • search results:表示搜尋結果頁,可以單獨設計範本,也可以不單獨設計
  • 文章Post archive:由於wordpress中還可以自定義文章類型,而wordpress只默認只提供我們通常見到的「文章」的文章類型,於是便有了這個;
  • categories 分類目錄:若你的文章有多個分類目錄,每個分類目錄想用不同的範本,那就選擇它
  • direct categories(分類目錄) of:功能同上,只是適用於子目錄

最後,設置完display options后,點擊save&close按鈕即可生效,此時,你可以訪問任一分類目錄頁面,就能看到實際效果。

額外補充,通常網站也會製作一個單獨的Blog頁面,放置所有分類下的文章,但這個Blog頁面也需要你製作,你也可以採用接下來的辦法調用你剛才製作的文章範本。

如果你還沒製作Blog頁面,那麼請在wordpress的「頁面」功能中,添加一個空白頁面,命名為Blog;

然後進入左側菜單setting > reading頁面,將Your homepage displays中的Posts page選擇為你剛才製作的Blog。 (請參見下圖的數位2處)

如何使用Elementor Pro製作文章列表頁範本(視頻)

常見問題

1.如何去除文章列表頁標題的前方的archive字樣?

請將標題元素的設置中的include context關掉。

include context

2.為何我的範本設置正確但不生效

請查看是否創建了多個archive範本導致了衝突,如若是,則將不需要的範本刪除或設置為草稿。

3.為何樣式不生效

請查看是否使用了緩存外掛程式,譬如wp rocket、W3 Total Cache、SG Optimizer、WP Super Cache等外掛程式,如若是,請在外掛程式中執行清緩存功能,如若網站還未上線,可以先禁用外掛程式,待網站製作完成後再開啟緩存外掛程式,注意有些緩存外掛程式可能會破壞網站,記得及時備份網站哦~

点赞

0 / 5 0

Your page rank:

Picture of 外貿建站技術姐Bonnie
外貿建站技術姐Bonnie

Bonnie是LOYSEO的創始人,在建站領域有著超過14年的經驗,熱愛能將想法變為現實的WordPress,更是Elementor的忠實使用者~

LOYSEO
讓我的客戶網站GTmetrix測分A\A的主機Cloudways
黑五優惠前4個月6折, 戳上方按鈕註冊即可自動帶入優惠碼BFCM2024
所贈主題外掛程式價值>$49
主機送Astra Pro不限網站1年
gmail.comsina.com邮箱,注册易通过
遇到問題,聯繫我