คู่มือการพัฒนาปลั๊กอิน WooCommerce แบบกำหนดเอง: สร้างร้านค้าออนไลน์เฉพาะของคุณ

ในสภาพแวดล้อมการค้าอิเล็กทรอนิกส์ที่มีการแข่งขันสูงในปัจจุบัน ร้านค้า WooCommerce มาตรฐานมักไม่สามารถตอบสนองความต้องการทางธุรกิจทั้งหมดได้ ไม่ว่าจะเป็นกระบวนการชำระเงินที่ปรับแต่งเอง กฎการคำนวณค่าขนส่งพิเศษ หรือการบูรณาการที่ลึกซึ้งกับระบบของบุคคลที่สาม ต่างต้องการการขยายฟังก์ชันหลักของร้านค้า นี่คือคุณค่าของการพัฒนาโปรแกรมเสริมที่กำหนดเอง ด้วยการเขียนโปรแกรมเสริมของคุณเอง WooCommerce คุณจะได้ควบคุมอย่างเต็มที่ สร้างประสบการณ์ช็อปปิ้งที่ไม่เหมือนใคร และสร้างกำแพงทางธุรกิจที่ลอกเลียนแบบได้ยาก

การกำหนดค่าสภาพแวดล้อมการพัฒนาโปรแกรมเสริม WooCommerce

ก่อนเริ่มการพัฒนาใด ๆ สภาพแวดล้อมการพัฒนาท้องถิ่นที่มั่นคงและแยกได้เป็นสิ่งจำเป็น นี่ไม่เพียงแต่จะปกป้องข้อมูลออนไลน์ของคุณ แต่ยังช่วยในการดีบักและทดสอบได้ง่ายอีกด้วย

สร้างสภาพแวดล้อม WordPress ในเครื่อง

แนะนำให้ใช้เครื่องมืออย่าง Local by Flywheel, XAMPP หรือ MAMP เพื่อสร้างสภาพแวดล้อมในเครื่องอย่างรวดเร็ว ตรวจสอบให้แน่ใจว่าสภาพแวดล้อมของคุณตรงกับ WooCommerce ข้อกำหนดขั้นต่ำ: PHP 7.2 หรือสูงกว่า, MySQL 5.6 หรือสูงกว่า, และ WordPress เวอร์ชันล่าสุด หลังจากติดตั้ง WordPress แล้ว, ติดตั้งและเปิดใช้งาน WooCommerce ปลั๊กอินจากไดเรกทอรีปลั๊กอินทางการ และทำตามขั้นตอนการตั้งค่าเริ่มต้น การนำเข้าข้อมูลตัวอย่างจะเป็นประโยชน์อย่างมากสำหรับการพัฒนา

แนะนำให้อ่าน คู่มือฉบับสมบูรณ์สำหรับการพัฒนาและเพิ่มประสิทธิภาพเว็บไซต์ E-commerce ด้วย WooCommerce。

สร้างโครงสร้างพื้นฐานของปลั๊กอิน

หนึ่ง WooCommerce ปลั๊กอิน ต้องเป็นปลั๊กอิน WordPress มาตรฐาน ภายใน wp-content/plugins/ สร้างโฟลเดอร์ใหม่ในไดเรกทอรี เช่น my-custom-woocommerceในโฟลเดอร์นั้น ให้สร้างไฟล์หลักของปลั๊กอิน โดยทั่วไปจะตั้งชื่อตามชื่อปลั๊กอิน เช่น my-custom-woocommerce.php。

UltaHost WordPress โฮสติ้ง

การรับประกันคืนเงินภายใน 30 วัน, แบนด์วิธและฐานข้อมูลไม่จำกัด, การป้องกัน DDoS ฟรี, ซื้อ 3 ปีลดราคา 50%

เข้าถึงหน้าเว็บ

ไฟล์หลักนี้ต้องมีส่วนหัวข้อมูลมาตรฐานของปลั๊กอิน WordPress ต่อไปนี้เป็นตัวอย่างพื้นฐาน:

<?php
/**
 * Plugin Name: My Custom WooCommerce
 * Plugin URI:  https://yourwebsite.com/
 * Description: 为 WooCommerce 商店添加自定义功能。
 * Version:     1.0.0
 * Author:      您的名字
 * Author URI:  https://yourwebsite.com/
 * License:     GPL v2 or later
 * Text Domain: my-custom-woocommerce
 * Domain Path: /languages
 * WC requires at least: 5.0.0
 * WC tested up to: 8.0.0
 */

// 防止直接访问
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

// 检查 WooCommerce 是否已激活
if ( ! in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {
    add_action( 'admin_notices', function() {
        ?>
        <div class="notice notice-error">
            <p>“ปลั๊กอิน ”My Custom WooCommerce" ต้องติดตั้งและเปิดใช้งาน WooCommerce ก่อน</p>
        </div>
        &lt;?php
    } );
    return;
}

จุดสำคัญคือการใช้ WC requires at least 和 WC tested up to ส่วนหัวเพื่อประกาศความเข้ากันได้กับ WooCommerce และตรวจสอบในโค้ดว่า WooCommerce เปิดใช้งานแล้วหรือไม่

วิธีการขยายหลัก: ตัวขอเกี่ยวการดำเนินการและตัวกรอง

WooCommerce จุดแข็งอยู่ที่ระบบขอเกี่ยวที่มีความสามารถในการขยายสูง การเข้าใจและใช้ตัวขอเกี่ยวการดำเนินการ (Actions) และตัวขอเกี่ยวตัวกรอง (Filters) ได้อย่างคล่องแคล่วเป็นหัวใจสำคัญของการพัฒนาที่กำหนดเอง

การใช้ตัวขอเกี่ยวการดำเนินการเพื่อเข้าไปเกี่ยวข้องในกระบวนการ

ตัวขอเกี่ยวการดำเนินการอนุญาตให้คุณ WooCommerce แทรกโค้ดของคุณเองในช่วงเวลาที่กำหนดของการดำเนินการ ตัวอย่างเช่น คุณต้องการดำเนินการที่กำหนดเองหลังจากผู้ใช้สั่งซื้อ (เช่น เรียกใช้ API ภายนอก)

แนะนำให้อ่าน คู่มือปฏิบัติจริงในการพัฒนา WordPress Plugin: สร้าง Plugin ฟังก์ชันแรกของคุณตั้งแต่เริ่มต้น。

คุณสามารถใช้ woocommerce_thankyou ฮุค ซึ่งจะถูกเรียกใช้งานในหน้าขอบคุณการสั่งซื้อ หรือใช้ woocommerce_checkout_order_processedซึ่งจะถูกเรียกใช้งานเมื่อการประมวลผลคำสั่งซื้อเสร็จสิ้น

add_action( 'woocommerce_checkout_order_processed', 'my_custom_order_action', 10, 3 );

function my_custom_order_action( $order_id, $posted_data, $order ) {
    // 获取订单对象（如果未提供）
    if ( ! $order instanceof WC_Order ) {
        $order = wc_get_order( $order_id );
    }

// 执行您的自定义逻辑，例如记录日志或发送请求
    $logger = wc_get_logger();
    $logger->info( '订单 #' . $order_id . ' 已创建，开始执行自定义任务。', array( 'source' => 'my-custom-plugin' ) );

// 调用外部 API 示例（伪代码）
    // $response = wp_remote_post( 'https://api.example.com/notify', $args );
}

ใช้ filter hook เพื่อปรับเปลี่ยนข้อมูล

ฟิลเตอร์ฮุคช่วยให้คุณสามารถปรับเปลี่ยน WooCommerce ข้อมูลที่ถูกส่งผ่าน ตัวอย่างเช่น คุณต้องการเพิ่มค่าธรรมเนียมคงที่ให้กับราคาสินค้าทั้งหมด

คุณสามารถใช้ woocommerce_product_get_price ตัวกรอง ฮุคนี้ทรงพลังมาก แต่ต้องใช้ด้วยความระมัดระวัง เพราะมันจะส่งผลต่อการแสดงราคาทั้งหมด

hosting.com 共享主机

高性能，配备 AMD EPYC CPU、NVMe SSD 存储和 LiteSpeed，全天候24小时、全天候的专家内部支持，高级安全措施，包括 SSL、暴力破解、恶意软件和 DDoS 防护，节省高达 73%

เข้าถึงหน้าเว็บ

add_filter( 'woocommerce_product_get_price', 'my_custom_price_adjustment', 10, 2 );

function my_custom_price_adjustment( $price, $product ) {
    // 只在前端购物车和商品页面应用，避免影响后台
    if ( is_admin() && ! defined( 'DOING_AJAX' ) ) {
        return $price;
    }

// 假设增加 5 元手续费
    $fee = 5;
    $new_price = $price + $fee;

return $new_price;
}

การกำหนดประเภทสินค้าและที่จัดเก็บข้อมูลแบบกำหนดเอง

WooCommerce รองรับสินค้าประเภทง่ายและสินค้าที่มีความหลากหลายตามค่าเริ่มต้น แต่บางครั้งคุณอาจต้องสร้างประเภทสินค้าใหม่ทั้งหมด เช่น “สินค้าจองล่วงหน้า” หรือ “สินค้าประเภทบริการ”

การลงทะเบียนประเภทสินค้าใหม่

การสร้างประเภทสินค้าใหม่เกี่ยวข้องกับหลายขั้นตอน ขั้นแรก คุณต้องลงทะเบียนประเภทนี้ ซึ่งมักจะทำใน init ระหว่างการโหลดแอคชันหรือปลั๊กอิน

add_action( 'init', 'register_my_custom_product_type' );

function register_my_custom_product_type() {
    class WC_Product_Custom extends WC_Product {
        public function __construct( $product ) {
            parent::__construct( $product );
            $this->product_type = 'custom';
        }

// 您可以在这里重写父类方法，或添加新方法
        public function get_type() {
            return 'custom';
        }

// 示例：自定义“添加到购物车”按钮文本
        public function add_to_cart_text() {
            return __( '预约服务', 'my-custom-woocommerce' );
        }
    }
}

จากนั้น คุณต้องเพิ่มประเภทนี้ลงในรายการเลือกประเภทสินค้าผ่านตัวกรอง

แนะนำให้อ่าน สร้างหน้าเว็บผลิตภัณฑ์ WooCommerce ที่ปรับแต่งได้อย่างง่ายดาย: จากพื้นฐานสู่ระดับมืออาชีพ。

add_filter( 'product_type_selector', 'add_custom_product_type_to_dropdown' );

function add_custom_product_type_to_dropdown( $types ) {
    $types['custom'] = __( '自定义服务', 'my-custom-woocommerce' );
    return $types;
}

เพิ่มฟิลด์ที่กำหนดเองสำหรับสินค้า

สำหรับประเภทผลิตภัณฑ์ใหม่ คุณมักต้องการข้อมูลเพิ่มเติมในฟิลด์ข้อมูล ซึ่งสามารถทำได้ผ่าน WooCommerce เมตาบ็อกซ์ข้อมูลสินค้า ใช้ woocommerce_product_options_general_product_data แอ็กชันเพื่อเพิ่มฟิลด์ และใช้ woocommerce_process_product_meta แอ็กชันเพื่อบันทึกข้อมูลเหล่านั้น

add_action( 'woocommerce_product_options_general_product_data', 'add_custom_product_fields' );

function add_custom_product_fields() {
    global $product_object;

echo '<div class="options_group show_if_custom">'; // `show_if_custom` 仅对“custom”类型显示

woocommerce_wp_text_input( array(
        'id'          =&gt; '_service_duration',
        'label'       =&gt; __( '服务时长 (小时)', 'my-custom-woocommerce' ),
        'desc_tip'    =&gt; true,
        'description' =&gt; __( '请输入完成此服务预计需要的小时数。', 'my-custom-woocommerce' ),
        'type'        =&gt; 'number',
        'custom_attributes' =&gt; array(
            'step' =&gt; '0.5',
            'min'  =&gt; '0.5'
        )
    ) );

echo '</div>';
}

// 保存字段
add_action( 'woocommerce_process_product_meta', 'save_custom_product_fields' );

function save_custom_product_fields( $post_id ) {
    $product = wc_get_product( $post_id );
    if ( $product-&gt;get_type() === 'custom' ) {
        $duration = isset( $_POST['_service_duration'] ) ? sanitize_text_field( $_POST['_service_duration'] ) : '';
        $product-&gt;update_meta_data( '_service_duration', $duration );
        $product-&gt;save_meta_data();
    }
}

โต้ตอบกับรถเข็นและขั้นตอนการชำระเงิน

รถเข็นและการชำระเงินเป็นส่วนสำคัญของอีคอมเมิร์ซWooCommerce ที่นี่มีฮุคจำนวนมากสำหรับการปรับแต่ง

โฮสติ้งแบบแชร์ของ InterServer

共享主机每月 $2.50 USD , 首月 $0.1 USD 优惠码 tryinterserver, 461个云应用脚本，一键安装。

เข้าถึงหน้าเว็บ

ปรับเปลี่ยนพฤติกรรมของสินค้าในรถเข็น

คุณสามารถทำได้โดย woocommerce_add_cart_item_data ตัวกรองจะแนบข้อมูลที่กำหนดเองเมื่อสินค้าถูกเพิ่มลงในตะกร้าสินค้า ตัวอย่างเช่น เพิ่มวันที่นัดหมายสำหรับสินค้า “บริการที่กำหนดเอง”

add_filter( 'woocommerce_add_cart_item_data', 'add_custom_data_to_cart_item', 10, 3 );

function add_custom_data_to_cart_item( $cart_item_data, $product_id, $variation_id ) {
    $product = wc_get_product( $product_id );
    if ( $product->get_type() === 'custom' && isset( $_POST['appointment_date'] ) ) {
        $cart_item_data['appointment_date'] = sanitize_text_field( $_POST['appointment_date'] );
        // 确保每个有不同预约日期的商品都被视为独立项目
        $cart_item_data['unique_key'] = md5( microtime() . rand() );
    }
    return $cart_item_data;
}

จากนั้นคุณสามารถใช้ woocommerce_get_item_data ตัวกรองเพื่อแสดงข้อมูลที่กำหนดเองเหล่านี้ในหน้าตะกร้าสินค้าและหน้าชำระเงิน

ฟิลด์ชำระเงินแบบกำหนดเอง

การเพิ่มหรือปรับเปลี่ยนฟิลด์การชำระเงินเป็นเรื่องที่พบบ่อยมาก ใช้ woocommerce_checkout_fields ตัวกรองสามารถนำไปใช้ได้อย่างง่ายดาย

add_filter( 'woocommerce_checkout_fields', 'add_custom_checkout_field' );

function add_custom_checkout_field( $fields ) {
    $fields['billing']['billing_custom_vat'] = array(
        'label'       => __( '增值税号', 'my-custom-woocommerce' ),
        'placeholder' => _x( '请输入您的公司税号', 'placeholder', 'my-custom-woocommerce' ),
        'required'    => false, // 根据业务需求调整
        'class'       => array( 'form-row-wide' ),
        'clear'       => true,
        'priority'    => 35, // 控制字段顺序
    );
    return $fields;
}

เพื่อบันทึกค่าของฟิลด์นี้ในคำสั่งซื้อ จำเป็นต้องใช้ woocommerce_checkout_update_order_meta action

add_action( 'woocommerce_checkout_update_order_meta', 'save_custom_checkout_field' );

function save_custom_checkout_field( $order_id ) {
    if ( ! empty( $_POST['billing_custom_vat'] ) ) {
        update_post_meta( $order_id, '_billing_custom_vat', sanitize_text_field( $_POST['billing_custom_vat'] ) );
    }
}

สรุป

WooCommerce การพัฒนาปลั๊กอินแบบกำหนดเองเป็นโครงการระบบที่เริ่มต้นจากการทำความเข้าใจโครงสร้างของมัน ตั้งแต่การตั้งสภาพแวดล้อมการพัฒนาที่ถูกต้อง การสร้างโครงปลั๊กอินตามมาตรฐาน ไปจนถึงการเจาะลึกระบบฮุก (การดำเนินการและตัวกรอง) เพื่อเข้าไปแทรกแซงหรือปรับเปลี่ยนกระบวนการหลัก ทุกขั้นตอนเป็นพื้นฐานในการสร้างฟังก์ชันเฉพาะตัว ด้วยการสร้างประเภทสินค้าและเมตาฟิลด์แบบกำหนดเอง คุณสามารถขยายโมเดลข้อมูลเพื่อตอบสนองความต้องการทางธุรกิจที่ซับซ้อนได้ สุดท้าย การเพิ่มการโต้ตอบและข้อมูลอย่างชาญฉลาดในกระบวนการรถเข็นและการชำระเงิน สามารถยกระดับประสบการณ์ผู้ใช้และประสิทธิภาพการดำเนินงานได้โดยตรง ปฏิบัติตามแนวทางปฏิบัติที่ดีที่สุดเสมอ เช่น การทดสอบอย่างเพียงพอ การรับประกันความปลอดภัยของโค้ด การดูแลเอกสารให้ดี และติดตาม WooCommerce และการอัปเดตของ WordPress หลัก เพื่อให้แน่ใจว่าปลั๊กอินที่คุณพัฒนามีความเสถียร มีประสิทธิภาพ และมีอายุการใช้งานที่ยาวนาน

คำถามที่พบบ่อย (FAQ)

พัฒนาปลั๊กอิน WooCommerce ต้องมีความรู้พื้นฐานใดบ้าง

การพัฒนาปลั๊กอิน WooCommerce ต้องมีพื้นฐานการเขียนโปรแกรม PHP ที่แข็งแกร่ง และคุ้นเคยกับแนวคิดการเขียนโปรแกรมเชิงวัตถุ (OOP) นอกจากนี้ ต้องมีความเข้าใจอย่างลึกซึ้งเกี่ยวกับกลไกหลักของ WordPress รวมถึงระบบฮุค (แอ็กชันและฟิลเตอร์) ประเภทโพสต์ที่กำหนดเอง เมตาดาต้า และโครงสร้างมาตรฐานของปลั๊กอินและธีม การรู้พื้นฐาน HTML, CSS และ JavaScript จะช่วยในการโต้ตอบส่วนหน้าบ้านด้วย

จะดีบั๊กปัญหาต่างๆ ในปลั๊กอิน WooCommerce ที่กำหนดเองได้อย่างไร

ขั้นแรก ตรวจสอบให้แน่ใจว่าได้เปิดใช้งานโหมดดีบักของ WordPress ในไฟล์ wp-config.php ในไฟล์เปิดใช้งาน WP_DEBUG 和 WP_DEBUG_LOGประการแรก บันทึกข้อผิดพลาดลงในไฟล์บันทึก ประการที่สอง ใช้ประโยชน์จาก WooCommerce ระบบบันทึกเหตุการณ์ในตัว ผ่าน wc_get_logger() ฟังก์ชันเพื่อบันทึกข้อมูลที่จุดสำคัญ สำหรับปัญหา front-end ให้ใช้เครื่องมือนักพัฒนาของเบราว์เซอร์ (คอนโซลและแผงเครือข่าย) เพื่อตรวจสอบ นอกจากนี้ สามารถปิดการใช้งานปลั๊กอินอื่น ๆ ชั่วคราวและเปลี่ยนไปใช้ธีมเริ่มต้น เพื่อแยกแยะความขัดแย้ง

ฉันแก้ไขตัวกรองราคา แต่ทำไมราคาในรายการสินค้าบนแอดมินก็เปลี่ยนไปด้วย?

นี่เป็นปัญหาที่พบบ่อย ตัวกรองที่เกี่ยวข้องกับราคาหลายตัวมีผลต่อทั้ง front-end และแอดมิน เพื่อหลีกเลี่ยงสถานการณ์นี้ คุณจำเป็นต้องจำกัดขอบเขตการทำงานผ่านการตรวจสอบเงื่อนไขในฟังก์ชันตัวกรอง โดยปกติจะใช้ is_admin() && ! defined( 'DOING_AJAX' ) มาเช็คว่าตอนนี้อยู่ในหน้าจอการจัดการหลังบ้านหรือไม่ และไม่ได้อยู่ในระหว่างการร้องขอ AJAX (เพราะการอัปเดตตะกร้าสินค้าเป็นต้น ทำผ่าน AJAX ซึ่งจำเป็นต้องคำนวณราคา) ในตัวอย่างก่อนหน้านี้เราได้แสดงวิธีการจัดการแบบนี้ไปแล้ว

ประเภทสินค้าที่กำหนดเองแสดงเป็น “สินค้าธรรมดา” ในคำสั่งซื้อ ควรทำอย่างไร?

นี่เป็นเพราะ WooCommerce เมื่อบันทึกภาพรวมของสินค้าในคำสั่งซื้อ โดยค่าเริ่มต้นอาจไม่สามารถระบุประเภทที่กำหนดเองของคุณได้อย่างถูกต้อง คุณต้องตรวจสอบให้แน่ใจว่าข้อมูลประเภทถูกส่งผ่านอย่างถูกต้องเมื่อเพิ่มสินค้าลงในตะกร้า ตรวจสอบของคุณ WC_Product_Custom คลาสได้รับการสืบทอดอย่างถูกต้องหรือไม่ WC_Product และตั้งค่า $this->product_typeนอกจากนี้ เมื่อดึงสินค้าจากคำสั่งซื้อWooCommerce อาจสร้างอินสแตนซ์พื้นฐาน WC_Product อ็อบเจ็กต์ เพื่อให้มั่นใจว่าการสร้างอินสแตนซ์ถูกต้อง คุณอาจจำเป็นต้องใช้ woocommerce_order_get_items ตัวกรองเพื่อแมปประเภทที่กำหนดเองของคุณ

จะมั่นใจได้อย่างไรว่าปลั๊กอินที่กำหนดเองของฉันจะเข้ากันได้กับการอัปเดต WooCommerce ในอนาคต

กุญแจสำคัญในการรักษาความเข้ากันได้คือการติดตามแนวทางปฏิบัติทางการพัฒนาเสมอ ใช้ WooCommerce API และ Hook ที่เปิดเผยสาธารณะ หลีกเลี่ยงการแก้ไขไฟล์หลักโดยตรงหรือการใช้คลาสและเมธอดที่ไม่ได้เปิดเผย ประกาศความเข้ากันได้อย่างถูกต้องในข้อมูลส่วนหัวของปลั๊กอิน WooCommerce เวอร์ชัน (WC tested up to). ทดสอบเป็นประจำบน WooCommerce รุ่นเบต้าหรือรุ่นล่าสุด ติดตาม WooCommerce บล็อกทางการของนักพัฒนาและบันทึกการอัปเดต เพื่อทำความเข้าใจฟังก์ชันที่กำลังจะถูกเลิกใช้และ API ใหม่