讓WooCommerce的訂單通知信裡面的商品名稱附帶商品網址的程式碼

woocommerce woocommerce 教學 code snippet woocommerce程式碼訂單通知信裡面加入商品網址

温唯 2020-11-22 23:41:29 ‧ 1212 瀏覽

使用WooCommerce架設購物網站，預設的訂單通知信裡面，「商品名稱」都是「純文字」呈現，並不會加入「商品網址」。
像下圖這樣：

如此一來，當訪客收到訂單通知信，想要再回去看所購買的「商品頁面」，就會比較麻煩。
此外，對於店家來說，也可能喪失了訪客回頭的機會。

如果能將「商品網址」也添加到「訂單通知信」裡面的「商品名稱」中，不但方便訪客再回到店裡，也能增加下一次訪客回店消費的機會。

添加之後就會像下圖這樣，「商品名稱」呈現出「可以點選」的網址，點擊之後會連回「該商品頁面」：

將商品網址自動加入訂單通知信的程式碼

/**
 * 名稱：將商品網址自動帶入訂單通知信
 * 操作方式：將整段程式碼複製貼上到主題的function.php檔案中，或者是CodeSnippet外掛中
 * 提供者：miriammibao.com
 * 相容：與WooCommerce Version 4.7.0 測試沒問題
 */
add_filter( 'woocommerce_order_item_name', 'miriammibao_product_title_with_link', 10, 2 );
function miriammibao_product_title_with_link( $item_name, $item ) {

    $_product = wc_get_product( $item['variation_id'] ? $item['variation_id'] : $item['product_id'] );

    $link = get_permalink( $_product->get_id() );

    return '<a href="'. $link .'"  rel="nofollow">'. $item_name .'</a>';
}

操作方式：

有2種，我自己更喜歡使用「CodeSnippet」

第一種：將上面的程式碼複製貼上到主題的`function.php`檔案中

找到function.php檔案
function.php檔案位於主機資料夾裡面的public_html（俗稱根目錄）>wp-content>themes>目前使用的子主題，進去之後就能找到名為function.php的檔案
下載function.php檔案到電腦裡。
多複製一份當作備份，避免檔案修改後出錯。
打開檔案＋貼上程式碼，接著儲存。
上傳修改後的檔案，並且覆蓋原始檔案。
完成＋檢查

第二種：使用CodeSnippet

安裝＋啟用「CodeSnippet」外掛
點擊「Add New」，創建新的程式碼
將上面那段程式碼貼入
選擇「Run snippet everywhere」
點擊「Save Changes and Activate」
完成＋檢查

我非常推薦「CodeSnippet」這套外掛。

它具有以下五大優點：

倘若經常需要客製化CSS或JS樣式、php hook或者是添加程式碼到head或foot，有這套外掛，一切搞定。
不用再為了要添加「Google追蹤碼」或「Adsense程式碼」，又得安裝另一個外掛。
最重要的是，不用再擔心「換主題」之後，之前寫入到舊主題的function.php檔案的程式碼還得搬來搬去。
每個程式碼都有自己的檔案，管理上一目了然，還可以紀錄每一段程式碼的使用說明。不用總是在亂七八糟的function.php檔案裡面找資料。
可以一鍵「啟用」或「停用」指定的程式碼，非常方便。
不用為了要修改某一段程式碼，還得先下載>再修改>再上傳回去。
它會自動幫「程式碼」的基本架構偵錯，避免錯誤的程式碼結構導致網站崩潰。

它的介面就長下圖這樣，左邊有個「藍色按鈕」，左右切換就能「一鍵啟用」或「一鍵停用」指定的程式碼：