WooCommerce 新增自訂義頁籤及內容

WooCommerce 商品頁下方預設有一個頁籤的設計,有網頁設計經驗的對這設計並不陌生,可以像一般電商平台一樣用來放尺寸表、退換貨說明、購物條款等附加內容,可說是一個很實用的功能。

但到後台的商品編輯頁面,遍尋不著新增頁籤及內文的介面,本文將介紹如何在商品頁中透過程式碼新增自訂義頁籤及內文

WooCommerce 新增自訂義頁籤及內容
/**
 * WooCommerce Add Custom Tabs And Content
 * @see https://v123.tw/woocommerce-add-custom-tabs
 * @author v123.tw
 */
add_filter('woocommerce_product_tabs', 'v123_woo_custom_product_tabs');
function v123_woo_custom_product_tabs($tabs)
{
	$tabs['you_tab_name'] = [
		'title'     => "Custom Product Tab",
		'priority'  => 10,
		'callback'  => 'v123_woo_custom_product_content'
	];
	return $tabs;
}
// Tab Content
function v123_woo_custom_product_content($name, $tab)
{
	echo '<h2>Description</h2>';
	echo '<p>Custom description tab.</p>';
}

上方為新增自定義頁籤的範例,可將上方程式碼貼到主題根目錄下方的 functions.php 中,就可多出一個頁籤拉

WooCommerce 新增自訂義頁籤及內容

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料