WooCommerce 是一款非常靈活的電子商務 WordPress 外掛，喜歡它的原因很多，除了漂亮的介面、人性化的後臺、很少的資料表等等，還有一個重要的原因是修改功能比較方便，比如修改 WooCommerce 的預設模版。

WooCommerce 提供兩種修改模版的方法，一個是透過鉤子函式，這也是 WordPress 中最常見的修改方式；另一個方法是 「覆蓋」 模版。

覆蓋這種方式在 WordPress 外掛中也比較常見，中心思想是如果使用者在主題目錄下放置了一個和某外掛模版檔名稱相同的檔案，某外掛就會先呼叫這個檔案。

WooCommerce 也支援這種方式，下面具體介紹。

WooCommerce 的預設模版檔案位於外掛的 templates 目錄 （/wp-content/plugins/WooCommerce/templates） 下，開啟模版檔案，可以發現裡面有很多 hooks（eg. do_action('WooCommerce_before_main_content'); ），所以修改模版應該遵循以下原則：

  • 可以用 hooks 完成的修改，儘量使用 hooks
  • 針對某個檔案有大量的修改，或者僅使用 hooks 無法完成修改，則使用模版覆蓋的方式

透過這兩種方式所做的修改都不會在升級時丟失。

例一：修改 My Account 頁面

  1. 在當前主題目錄下建立 WooCommerce 目錄
  2. 在 WooCommerce 目錄下再建立一個 myaccount 目錄
  3. 把 plugins/WooCommerce/templates/myaccount/my-account.php 檔案複製到 yourtheme/WooCommerce/myaccount/目錄下，對應關係如下 
    plugins/WooCommerce/templates/myaccount/my-account.php

    =>

    yourtheme/WooCommerce/myaccount/my-account.php
  4. 這時主題下的 my-account.php 擁有更高的優先順序，會覆蓋外掛目錄下的 my-account.php，修改這個檔案即可。

例二：覆蓋所有模版

覆蓋所有模版，需要把所有模版檔案複製到主題中，並保留目錄結構。也就是要把

plugins/WooCommerce/templates/

這個目錄下所有檔案複製到

yourtheme/WooCommerce/

WooCommerce 模版目錄結構

WooCommerce 官方檔案中列出了模版的目錄結構，請移步檢視。