WordPress 自訂文章類型(post type)模板樣式｜產品型錄、房屋物件型錄、作品集、電影目錄

什麼是自訂文章類型 ( post type ) 模版樣式？

預設的 WordPress 的文章類型有文章 ( post )、頁面 ( page ) 等，使用 WordPress 布景主題時，主題會為這些文章類型 ( post type ) 設定既有的模版樣式，而不需要重新設計模版，直接套用主題就能有美觀的樣式。

但這些樣式有時並不完全符合使用者的需求，像是在「房屋物件銷售目錄」、「產品型錄」、「作品集」、「電影目錄」等，想要客製特別的外觀呈現時，這時就會需要透過新增文章類型 ( post type ) 並客製模版外觀樣式來解決。

舉例來說，下面的圖片就是以自訂文章類型 ( post type ) 模版樣式的方式處理，包含要顯示幾張圖片、顯示哪些資訊、內容如何排版等。

如何自訂文章類型 ( post type ) 模版樣式？

以往要自訂文章類型 ( post type ) 模版樣式，會需要編寫 PHP 的方式進行。現在則可以使用有提供視覺化編輯、所見即所得的主題或編輯器進行客製，需要使用的外掛包含

1.自訂文章類型 ( post type ) 與自訂欄位類型 ( custom field ) 外掛：比較知名的像是 ACF ( Advanced custom field )、Metabox、Crocoblock ( Jet engine ) 等。

預設的 WordPress 文章類型只有提供文章標題、文章內容 ( Gutenberg )、分類、標籤、精選圖片等欄位，但如果需要更多欄位，例如在先前提到的房屋物件模版中 ( 如上圖 )，會有物件圖庫、售價、地址等資訊，就會需要使用到此類自訂欄位類型 ( custom field ) 外掛，告訴 WordPress 系統有這些資訊欄位需要儲存，以及設定要在哪些文章類型之下，附加需要的欄位內容。

2.支援自訂欄位功能的主題或頁面編輯器

當在 WordPress 後台儲存這些自訂欄位的資訊，需要使用支援自訂欄位 ( custom field ) 與客製文章類型 ( post type ) 樣式功能的主題或編輯器，將系統儲存的資料動態 ( dynamic ) 呼叫出來。

8種支援自訂欄位、客製文章類型樣式功能的布景主題 / 編輯器

以下將列出目前比較知名、且支援自訂欄位、客製文章類型樣式功能的布景主題 / 編輯器。

容易操作的主題 / 編輯器

• Hello Elementor主題 + Elementor 頁面編輯器
  官方教學指引：Create a single page template
  
• Elementor 頁面編輯器 + Crocoblock 附加外掛
  官方教學指引：How to Create Archive and Single Templates for Custom Post Type

容易操作但介面較複雜的主題 / 編輯器

• Blocksy 主題 + Stackable / Elementor 頁面編輯器
  官方教學指引：Custom Single Templates with Blocksy Pro
  
• Kadence 主題 + Kadence block
  非官方教學指引：How to Create a Product Page – Using Meta Box + Kadence
  
• Breakdance 主題 / 頁面編輯器
  非官方教學指引：How to Create a Product Page – Using Meta Box and Breakdance

需要有 CSS 知識輔助，才容易上手的主題 / 編輯器

• Bricks builder 主題 / 頁面編輯器
  非官方影片教學指引：Advanced Custom Fields & Bricks Builder For Beginners
  
• Oxygen 頁面編輯器
  官方教學指引：Templating Overview
  
• Greenshift FSE 主題 + Greenshift 頁面編輯器
  官方教學指引：How to build dynamic websites on WordPress and Greenshift, from digital shop to booking site