WooCommerce

WordPress用の無料ECプラグイン。WordPressの柔軟性とeコマース機能を組み合わせ。

CMSeコマースWordPressPHPプラグインオープンソースREST API
ライセンス
GPL v3
言語
PHP
料金
コアプラグイン無料

CMS

WooCommerce

概要

WooCommerceは、WordPress用の無料ECプラグインです。WordPressの柔軟性とeコマース機能を組み合わせ、中小企業向けに人気のECソリューションです。

詳細

WooCommerce(ウーコマース)は、2011年にリリースされたWordPress用のオープンソースECプラグインです。GPL v3ライセンスで提供され、500万以上のサイトで利用されています。WordPressサイトの28%がWooCommerceを使用しており、市場シェアは22%に達しています。PHPで開発され、WordPressのプラグインシステムとテーマ機能を最大限に活用できます。コアプラグインは無料で、豊富な拡張機能により機能を追加できます。決済ゲートウェイ、配送方法、在庫管理、SEO最適化など、ECサイトに必要な機能を網羅しています。WordPressの強力なコンテンツ管理機能と組み合わせることで、ブログとECを統合したサイトを簡単に構築できます。最新のHPOS(High-Performance Order Storage)システムにより、大規模サイトでも高いパフォーマンスを実現します。

メリット・デメリット

メリット

  • 完全無料: コアプラグインは無料で利用可能
  • 高いカスタマイズ性: PHPコードを自由に編集・拡張可能
  • WordPressとの親和性: 既存のWordPressサイトに簡単に追加
  • 大きなコミュニティ: 活発なフォーラムと豊富なドキュメント
  • SEO対応: WordPressの優れたSEO機能を活用
  • 豊富なテーマ: 数千のWooCommerce対応テーマが利用可能
  • 拡張性: フックとフィルターによる柔軟な機能拡張

デメリット

  • 技術的知識が必要: セットアップとカスタマイズにPHP知識が必要
  • セキュリティ管理: 自己責任でセキュリティ対策が必要
  • パフォーマンス最適化: 大規模サイトでは最適化が必須
  • サポート制限: 無料版では公式サポートなし
  • ホスティング費用: 自前でサーバーを用意する必要あり

主要リンク

使い方の例

WooCommerceの基本セットアップ

// functions.php - WooCommerceサポートの有効化
add_action( 'after_setup_theme', 'mytheme_add_woocommerce_support' );

function mytheme_add_woocommerce_support() {
    // WooCommerceサポートを宣言
    add_theme_support( 'woocommerce' );
    
    // 商品ギャラリー機能を有効化
    add_theme_support( 'wc-product-gallery-zoom' );
    add_theme_support( 'wc-product-gallery-lightbox' );
    add_theme_support( 'wc-product-gallery-slider' );
}

// カスタム商品タブの追加
add_filter( 'woocommerce_product_tabs', 'woo_custom_product_tabs' );

function woo_custom_product_tabs( $tabs ) {
    // カスタムタブを追加
    $tabs['custom_tab'] = array(
        'title'     => __( '仕様詳細', 'woocommerce' ),
        'priority'  => 50,
        'callback'  => 'woo_custom_tab_content'
    );
    
    return $tabs;
}

function woo_custom_tab_content() {
    // タブの内容を表示
    echo '<h2>製品仕様</h2>';
    echo '<p>ここに製品の詳細仕様を記載します。</p>';
}

カスタム商品フィールドの追加

// 商品編集画面にカスタムフィールドを追加
add_action( 'woocommerce_product_options_general_product_data', 'woo_add_custom_fields' );

function woo_add_custom_fields() {
    global $woocommerce, $post;
    
    echo '<div class="options_group">';
    
    // テキストフィールド
    woocommerce_wp_text_input(
        array(
            'id'          => '_custom_product_code',
            'label'       => __( '商品コード', 'woocommerce' ),
            'placeholder' => 'ABC-123',
            'desc_tip'    => 'true',
            'description' => __( '独自の商品コードを入力してください。', 'woocommerce' )
        )
    );
    
    // セレクトボックス
    woocommerce_wp_select(
        array(
            'id'      => '_product_condition',
            'label'   => __( '商品状態', 'woocommerce' ),
            'options' => array(
                'new'         => __( '新品', 'woocommerce' ),
                'used'        => __( '中古', 'woocommerce' ),
                'refurbished' => __( 'リファービッシュ品', 'woocommerce' ),
            )
        )
    );
    
    echo '</div>';
}

// カスタムフィールドの保存
add_action( 'woocommerce_process_product_meta', 'woo_save_custom_fields' );

function woo_save_custom_fields( $post_id ) {
    // 商品コードの保存
    $custom_product_code = $_POST['_custom_product_code'];
    if( !empty( $custom_product_code ) ) {
        update_post_meta( $post_id, '_custom_product_code', esc_attr( $custom_product_code ) );
    }
    
    // 商品状態の保存
    $product_condition = $_POST['_product_condition'];
    if( !empty( $product_condition ) ) {
        update_post_meta( $post_id, '_product_condition', esc_attr( $product_condition ) );
    }
}

WooCommerce REST APIの使用

// REST APIエンドポイントのカスタマイズ
add_action( 'rest_api_init', function () {
    // カスタムエンドポイントの登録
    register_rest_route( 'wc-custom/v1', '/products/bestsellers', array(
        'methods'  => 'GET',
        'callback' => 'get_bestselling_products',
        'permission_callback' => '__return_true',
    ) );
} );

function get_bestselling_products( $request ) {
    $args = array(
        'post_type'      => 'product',
        'meta_key'       => 'total_sales',
        'orderby'        => 'meta_value_num',
        'posts_per_page' => 10,
        'order'          => 'DESC',
    );
    
    $products = new WP_Query( $args );
    $data = array();
    
    if ( $products->have_posts() ) {
        while ( $products->have_posts() ) {
            $products->the_post();
            $product = wc_get_product( get_the_ID() );
            
            $data[] = array(
                'id'         => $product->get_id(),
                'name'       => $product->get_name(),
                'price'      => $product->get_price(),
                'sales'      => $product->get_total_sales(),
                'image'      => wp_get_attachment_url( $product->get_image_id() ),
                'permalink'  => $product->get_permalink(),
            );
        }
    }
    
    wp_reset_postdata();
    
    return new WP_REST_Response( $data, 200 );
}

カート機能のカスタマイズ

// カート自動更新の実装
add_action( 'wp_footer', 'cart_update_qty_script' );

function cart_update_qty_script() {
    if ( is_cart() ) {
        ?>
        <script type="text/javascript">
        jQuery(document).ready(function($) {
            // 数量変更時の自動更新
            $('.woocommerce').on('change', 'input.qty', function() {
                var $button = $(this).closest('form').find('[name="update_cart"]');
                $button.prop('disabled', false);
                $button.trigger('click');
            });
        });
        </script>
        <?php
    }
}

// カスタム配送方法の追加
add_action( 'woocommerce_shipping_init', 'custom_shipping_method_init' );

function custom_shipping_method_init() {
    class WC_Custom_Shipping_Method extends WC_Shipping_Method {
        
        public function __construct() {
            $this->id                 = 'custom_shipping';
            $this->method_title       = __( 'カスタム配送', 'woocommerce' );
            $this->method_description = __( 'カスタム配送方法の説明', 'woocommerce' );
            
            $this->init();
        }
        
        function init() {
            // 設定フォームの初期化
            $this->init_form_fields();
            $this->init_settings();
            
            // 設定の保存
            add_action( 'woocommerce_update_options_shipping_' . $this->id, array( $this, 'process_admin_options' ) );
        }
        
        public function calculate_shipping( $package = array() ) {
            // 配送料の計算ロジック
            $cost = 0;
            $weight = 0;
            
            foreach ( $package['contents'] as $item_id => $values ) {
                $_product = $values['data'];
                $weight += $_product->get_weight() * $values['quantity'];
            }
            
            // 重量に基づく配送料
            if ( $weight <= 1 ) {
                $cost = 500;
            } elseif ( $weight <= 5 ) {
                $cost = 800;
            } else {
                $cost = 1200;
            }
            
            $rate = array(
                'id'    => $this->id,
                'label' => $this->title,
                'cost'  => $cost,
            );
            
            $this->add_rate( $rate );
        }
    }
}

add_filter( 'woocommerce_shipping_methods', 'add_custom_shipping_method' );

function add_custom_shipping_method( $methods ) {
    $methods['custom_shipping'] = 'WC_Custom_Shipping_Method';
    return $methods;
}

注文処理のカスタマイズ

// 注文完了時のカスタムアクション
add_action( 'woocommerce_thankyou', 'custom_order_complete_action', 10, 1 );

function custom_order_complete_action( $order_id ) {
    if ( ! $order_id ) return;
    
    $order = wc_get_order( $order_id );
    
    // 在庫管理システムへの通知
    $order_data = array(
        'order_id'     => $order->get_id(),
        'order_total'  => $order->get_total(),
        'customer_id'  => $order->get_customer_id(),
        'items'        => array(),
    );
    
    foreach ( $order->get_items() as $item_id => $item ) {
        $product = $item->get_product();
        
        $order_data['items'][] = array(
            'product_id'   => $product->get_id(),
            'product_name' => $product->get_name(),
            'quantity'     => $item->get_quantity(),
            'price'        => $item->get_total(),
        );
    }
    
    // 外部APIへの送信(例)
    wp_remote_post( 'https://api.example.com/orders', array(
        'body' => json_encode( $order_data ),
        'headers' => array(
            'Content-Type' => 'application/json',
            'Authorization' => 'Bearer YOUR_API_KEY',
        ),
    ) );
    
    // カスタムメール送信
    $to = $order->get_billing_email();
    $subject = '【' . get_bloginfo( 'name' ) . '】ご注文ありがとうございます';
    $message = 'ご注文番号: #' . $order_id . "\n";
    $message .= 'ご注文の詳細はマイページからご確認いただけます。';
    
    wp_mail( $to, $subject, $message );
}

フックとフィルターの活用

// 商品価格表示のカスタマイズ
add_filter( 'woocommerce_get_price_html', 'custom_price_html', 100, 2 );

function custom_price_html( $price, $product ) {
    if ( $product->is_on_sale() ) {
        $price = '<span class="sale-badge">SALE!</span> ' . $price;
    }
    
    // 会員価格の表示
    if ( is_user_logged_in() ) {
        $user = wp_get_current_user();
        if ( in_array( 'premium_member', $user->roles ) ) {
            $member_price = $product->get_price() * 0.9; // 10%割引
            $price .= '<br><span class="member-price">会員価格: ' . wc_price( $member_price ) . '</span>';
        }
    }
    
    return $price;
}

// チェックアウトフィールドのカスタマイズ
add_filter( 'woocommerce_checkout_fields', 'custom_checkout_fields' );

function custom_checkout_fields( $fields ) {
    // 配送希望日時フィールドの追加
    $fields['order']['delivery_date'] = array(
        'type'        => 'date',
        'label'       => __('配送希望日', 'woocommerce'),
        'placeholder' => __('配送希望日を選択', 'woocommerce'),
        'required'    => false,
        'class'       => array('form-row-wide'),
        'clear'       => true,
    );
    
    $fields['order']['delivery_time'] = array(
        'type'        => 'select',
        'label'       => __('配送希望時間帯', 'woocommerce'),
        'options'     => array(
            ''         => __('指定なし', 'woocommerce'),
            'morning'  => __('午前中', 'woocommerce'),
            '12-14'    => __('12:00-14:00', 'woocommerce'),
            '14-16'    => __('14:00-16:00', 'woocommerce'),
            '16-18'    => __('16:00-18:00', 'woocommerce'),
            '18-20'    => __('18:00-20:00', 'woocommerce'),
            '19-21'    => __('19:00-21:00', 'woocommerce'),
        ),
        'required'    => false,
        'class'       => array('form-row-wide'),
        'clear'       => true,
    );
    
    return $fields;
}

// チェックアウトフィールドの保存
add_action( 'woocommerce_checkout_create_order', 'save_custom_checkout_fields', 10, 2 );

function save_custom_checkout_fields( $order, $data ) {
    if ( ! empty( $_POST['delivery_date'] ) ) {
        $order->update_meta_data( '_delivery_date', sanitize_text_field( $_POST['delivery_date'] ) );
    }
    
    if ( ! empty( $_POST['delivery_time'] ) ) {
        $order->update_meta_data( '_delivery_time', sanitize_text_field( $_POST['delivery_time'] ) );
    }
}

これらの例は、WooCommerceの主要な開発パターンを示しています。WordPressとの統合、フックとフィルターによる機能拡張、REST APIの活用、カスタムフィールドの追加、配送方法のカスタマイズなど、幅広い開発シナリオに対応できます。