在WooCommerce商城開發中,短代碼(Shortcode)是快速插入動態內容和功能的核心工具。以下是一些高頻使用的短代碼及實際開發場景示例,涵蓋商品展示、購物車和結賬流程、用戶中心等模塊:
1.商品展示類短代碼
場景1:首頁展示“新品上架”
// 在首頁模板或古騰堡區塊中添加
[recent_products limit="8" columns="4" orderby="date" order="DESC"]
擴展:搭配on_sale=”true”可篩選促銷商品。
場景2:分類頁展示特定分類商品
// 僅顯示“電子產品”分類下的商品,每頁12個
[products category="electronics" limit="12" columns="4" paginate="true"]
場景3:自定義商品列表(通過SKU)
// 手動指定多個SKU的商品
[products skus="SKU001,SKU002,SKU003" orderby="sku"]
2.購物車和結賬流程
場景1:獨立購物車頁面]
// 在自定義頁面(如 `/cart`)中插入
[woocommerce_cart]
注意:需確保WooCommerce設置中已分配該頁面為購物車頁。
場景2:迷你購物車(側邊欄/彈窗)
// 在主題的小工具區域或彈窗模板中
[woocommerce_mini_cart]
場景3:結賬頁面
// 在 `/checkout` 頁面中插入
[woocommerce_checkout]
擴展:通過woocommerce_checkout_fields鉤子自定義字段。
3.用戶中心與訂單
場景1:用戶訂單歷史
// 在“我的賬戶”頁面或會員中心
[woocommerce_my_account]
擴展:通過woocommerce_account_menu_items鉤子添加自定義標簽(如“我的積分”)。
場景2:追蹤訂單
// 在訂單追蹤頁面
[woocommerce_order_tracking]
4.促銷與動態內容
場景1:限時促銷倒計時
// 結合短代碼和自定義字段(需開發)
[sale_countdown product_id="123" expiry="2025-08-30"]
實現:通過add_shortcode()注冊自定義短代碼,讀取商品促銷截止時間。
場景2:會員專屬折扣提示
// 在商品詳情頁顯示會員價(需開發)
[member_price product_id="123" role="premium_member"]
5.高級應用:自定義短代碼開發
示例:顯示當前用戶的最近瀏覽商品
// 在 functions.php 中注冊短代碼
add_shortcode('recently_viewed_products', function($atts) {
$atts = shortcode_atts(['limit' => 4], $atts);
$viewed_products = wc_get_recently_viewed_products();
if (empty($viewed_products)) return '暫無瀏覽記錄';
$product_ids = array_slice($viewed_products, 0, $atts['limit']);
return do_shortcode('[products ids="' . implode(',', $product_ids) . '" columns="4"]');
});
// 使用方式:[recently_viewed_products limit="6"]
6.注意事項
性能優化:避免在循環中直接使用短代碼(如do_shortcode()),改用WC_Shortcodes::products()類方法。
樣式沖突:通過woocommerce_shortcode_products_query鉤子修改查詢參數,確保與主題兼容。
Gutenberg兼容:使用register_block_type()將短代碼轉換為古騰堡區塊(如WooCommerceBlocks插件)。
通過以上短代碼,開發者可以快速搭建商城核心功能,同時結合自定義開發實現復雜業務邏輯。