WooCommerce是最流行的 WordPress 電子商務(wù)插件，在開發(fā)WooCommerce主題的時(shí)候，難免要添加一些自定義字段來滿足我們的需求。WooCommerce是基于 WordPress 的生態(tài)系統(tǒng)開發(fā)的，所以，很多 WordPress 的 API 我們都可以直接用在WooCommerce中。下面我們以一個(gè)為分類添加字體圖標(biāo)的需求來講解一下怎么為WooCommerce的商品分類添加自定義字段，效果如下。

添加表單到商品分類添加頁面

首先是商品分類添加頁面，我們添加一個(gè)圖標(biāo)的表單，用戶填寫圖標(biāo)的名稱，我是用的字體圖標(biāo)，當(dāng)然，也可以是圖片網(wǎng)址。這里我們使用WooCommerce自定義的product_cat_add_form_fields來把表單添加到商品分類添加頁面。

// 分類添加表單
function tutorialshares_taxonomy_add_new_meta_field() {
    // this will add the custom meta field to the add new term page
    ?>
    <div class="form-field">
        <label for="term_meta[term_icon]"><?php _e( '圖標(biāo)', 'woocommerce' ); ?></label>
        <input class="regular-text" type="text" name="term_meta[term_icon]" id="term_meta[term_icon]" value="">
    </div>
<?php
}
add_action( 'product_cat_add_form_fields', 'tutorialshares_taxonomy_add_new_meta_field', 10, 2 );

添加表單到商品分類編輯頁面

商品分類編輯頁面用的是product_cat_edit_form_fields，和上面的基本上是差不多的，只不過多了已經(jīng)添加過的數(shù)據(jù)，其實(shí)兩個(gè)是可以合并成一個(gè)功能的。

// 分類編輯表單
function tutorialshares_taxonomy_edit_meta_field($term) {
    // put the term ID into a variable
    $t_id = $term->term_id;
 
    // retrieve the existing value(s) for this meta field. This returns an array
    $term_meta = get_option( "taxonomy_$t_id" ); ?>
    <tr class="form-field">
    <th scope="row" valign="top"><label for="term_meta[term_icon]"><?php _e( '圖標(biāo)', 'woocommerce' ); ?></label></th>
        <td>
            <input class="regular-text" type="text" name="term_meta[term_icon]" id="term_meta[term_icon]" value="<?php echo esc_attr( $term_meta['term_icon'] ) ? esc_attr( $term_meta['term_icon'] ) : ''; ?>">
        </td>
    </tr>
<?php
}
add_action( 'product_cat_edit_form_fields', 'tutorialshares_taxonomy_edit_meta_field', 10, 2 );

最后，我們需要把提交的數(shù)據(jù)保存到數(shù)據(jù)庫中

WooCommercce 直接把商品分類字段保存在了 WordPress 的wp_options數(shù)據(jù)表中，個(gè)人覺得這是一個(gè)很好的設(shè)計(jì)，因?yàn)樯唐贩诸惖淖远x字段一般不會(huì)很多，專門為此新建一個(gè)數(shù)據(jù)表就增加了很多復(fù)雜度，WordPress 的 wp_options基本上是 k-v 性質(zhì)的，也很適合自定義字段這種類型的數(shù)據(jù)。WordPress 也提供了很方便的功能接口，直接用update_option保存數(shù)據(jù)即可，

// 保存分類數(shù)據(jù)
function save_taxonomy_custom_meta( $term_id ) {
    if ( isset( $_POST['term_meta'] ) ) {
        $t_id = $term_id;
        $term_meta = get_option( "taxonomy_$t_id" );
        $cat_keys = array_keys( $_POST['term_meta'] );
        foreach ( $cat_keys as $key ) {
            if ( isset ( $_POST['term_meta'][$key] ) ) {
                $term_meta[$key] = $_POST['term_meta'][$key];
            }
        }
        // Save the option array.
        update_option( "taxonomy_$t_id", $term_meta );
    }
}  
add_action( 'edited_product_cat', 'save_taxonomy_custom_meta', 10, 2 );  
add_action( 'create_product_cat', 'save_taxonomy_custom_meta', 10, 2 );

調(diào)用商品分類自定義字段數(shù)據(jù)

從上面保存數(shù)據(jù)的代碼中可以看出來。WooCommerce把商品分類的自定義字段保存到wp_options數(shù)據(jù)表中了，調(diào)用這個(gè)數(shù)據(jù)的時(shí)候，我們直接用 WordPress 的get_option函數(shù)就可以了。

$meta_field_array = get_option('taxonomy_'. $term->term_id);
$meta_icon = $meta_field_array['term_icon'];