iT邦幫忙

0

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

  • 分享至 

  • xImage
  •  

使用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檔案中

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

第二種:使用CodeSnippet

  1. 安裝+啟用「CodeSnippet」外掛
  2. 點擊「Add New」,創建新的程式碼
  3. 將上面那段程式碼貼入
  4. 選擇「Run snippet everywhere」
  5. 點擊「Save Changes and Activate」
  6. 完成+檢查

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

它具有以下五大優點:

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

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


我是温唯,我持續學習 WordPress架站 ,也持續撰寫相關的 學習筆記 ...

來找我玩嘛!
我的網站|這裏記錄了許多關於WordPress的學習日記
Instagram|這裡全都是我的假掰照片
facebook|這裡是我和讀者聊天打屁的地方


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言