カスタム WooCommerce 製品タイプをプログラムで作成する方法

公開: 2023-01-03

複雑な WooCommerce ストアを構築している場合、特定の問題に対する独自のソリューションを作成する必要がある場合があります。これらの問題の 1 つは、特定の WooCommerce 製品タイプの欠如です。 これが、QuadLayers が、Web サイト用のカスタム WooCommerce 製品タイプを作成する方法に関するガイドを提供した理由です。

製品タイプを定義する方法、特定のオプションと価格を有効にする方法などを検討します。しかし、最初に、WooCommerce の製品タイプとカスタム製品タイプでできることを見てみましょう。

WooCommerce にカスタム商品タイプを追加する理由

デフォルトでは、WooCommerce には4 つの固有の製品タイプがあります。 これらは：

シンプルな商品
変動商品
外部/アフィリエイト
ダウンロード可能な製品

もちろん、外部の WooCommerce プラグインを使用すると、サブスクリプション製品、予約可能な製品、メンバーシップなど、より多くの製品タイプを追加できます.

しかし、これらの特定のタイプ以外の製品タイプを作成したい場合はどうすればよいでしょうか? デフォルトの WooCommerce 製品タイプでは満たすことができない特定の要件がある場合、またはサードパーティのプラグインを使用せずにメンバーシップやオークション製品などのカスタム製品タイプを作成したい場合は、少し使用してカスタム製品タイプを作成できます。コーディング。

カスタム商品タイプを使用するということは、異なる固有の設定を商品タイプに追加することを意味します。たとえば、特定の可変商品タイプが必要で、それに別の可視性または価格設定を追加する場合は、カスタム商品タイプを使用してこれを行うことができます。さらに、単一の種類の製品に対して固有の特定の製品タイプを定義し、必要に応じて製品タイプの設定のみを変更することもできます。

ニーズに関係なく、カスタム製品タイプを使用すると、Web サイトで販売する製品をカスタマイズおよび定義する際の柔軟性が向上します。

カスタム WooCommerce 製品タイプを作成するには?

WooCommerce 製品タイプを作成するプロセスは非常に単純ですが、ある程度のコーディングが必要です。この記事を続けたい場合は、カスタム WordPress プラグインの作成とそれらへのコードの追加について、もう少し学習することをお勧めします。

ウェブサイトのディレクトリにWordPress プラグインを作成する基本を理解したら、 WP インストールディレクトリを開き、 wp-content/pluginsを開き、「 QuadLayers_custom-product-type 」フォルダを作成します。このデモでは、localhost ディレクトリを使用します。

カスタム WooCommerce 製品タイプのフォルダーを作成する

その後、「 Quadlayers_custom-product-type.php 」という名前のファイルを作成します。これは、プラグインの残りの機能への入り口として機能するメインファイルです。

このファイルを開き、次のコード行をファイルに貼り付けます。

 <?php

/**
* プラグイン名: Quadlayers カスタム製品タイプ
* 説明: カスタム WooCommerce 製品タイプの作成に関する Quadlayers のガイドのコード
*/

if ( ! defined( 'ABSPATH' ) ) {
戻る;
}

プラグインのメインファイルにコードを追加する

この一連のコードは、プラグイン名と説明を追加してプラグインを定義します。このファイルを機能させるには、さらにコードを追加する必要があるため、現時点ではこれで十分です。次に、新しく作成したプラグインを有効にする必要があります。チュートリアル用にプラグインを有効にしたままにして、作業を進めながらさらにコードを追加します。

それでは、 WP Admin Dashboardを開いてPluginsをクリックしてください。ここに、Quadlayers Custom Product Type という名前の新しいプラグインが表示されます。先に進んでアクティブ化し、チュートリアルの次のステップに進みます。

カスタム woocommerce 製品タイププラグインを有効にする

カスタム WooCommerce 製品タイプを登録する

次に、カスタム製品タイプを定義する関数を作成し、それを WooCommerce 製品タイプとして登録します。 このために、次のコードをプラグインのメインファイルに追加します。

 add_action( 'init', 'register_demo_product_type' );
関数 register_demo_product_type() {
クラス WC_Product_Demo は WC_Product を拡張します {

public function __construct( $product ) {
$this->product_type = 'デモ';
親::__construct( $product );
}
}
}

これにより、 demo という名前のカスタム製品タイプが登録されます。 商品タイプの名前を変更したい場合は、 $this->product_type = 'demo';のテキストを変更するだけです。

カスタム WooCommerce 製品オプションを追加します。

この後、カスタム製品タイプを製品タイプドロップダウンリストに追加する必要があります。 これにより、 WP 管理ダッシュボードで製品を作成または編集するときに製品タイプを選択できるようになります。 このコードをプラグインのメインファイルに追加すると、製品タイプリストに新しいオプションが表示されます。

 add_filter( 'product_type_selector', 'add_demo_product_type' );
関数 add_demo_product_type( $types ){
$types[ 'demo' ] = __( 'デモ製品', 'dm_product' );
$types を返します。 
}

このコードは、 $types['demo'] = __('Custom Product Type')行を使用して、カスタム商品タイプを商品データドロップダウンリストに追加します。テキストは、カスタム製品タイプから、デモ製品、カスタムオーダー、ギフトカードなどに変更できます。

次に、 WP 管理ダッシュボードを開き、新しい製品を作成します。 Product Typeドロップダウンメニューの下に、「 Demo Product 」という名前の新しいオプションが表示されます。

新しい製品の作成中にカスタム製品タイプを選択する

カスタム商品タイプタブの追加

次の関数は、カスタム商品タイプの新しい設定タブを作成します。このようにして、他の製品タイプと共有されていない特定の詳細を製品タイプに追加できます。

この関数に貼り付けて、カスタム製品の詳細タブを作成します。

 add_filter( 'woocommerce_product_data_tabs', 'demo_product_tab' );
関数 demo_product_tab( $tabs) {

$tabs['demo'] = 配列(
'label' => __( 'デモ製品', 'dm_product' ),
'ターゲット' => 'demo_product_options',
'クラス' => 'show_if_demo_product',
);
$タブを返します。
}
}

上記で独自の product_type を定義した場合は、 $tabs['demo'] = arrayで 'demo' の代わりにproduct_type IDを使用することを忘れないでください。

使用した配列の 3 つのパラメーターは次のとおりです。

label:カスタム商品タブの名前を定義します。
target:タブに設定を追加するために使用する識別子を設定します。
クラス:これにより、カスタム製品タブをいつ表示するかを確認できます。

ここでは、class パラメーターでshow_if_Demo_productを使用しています。つまり、このタブはカスタム商品タイプが選択されている場合にのみ表示されます。

カスタム製品タイプの特定のタブ

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

次に、いくつかの設定とフィールドをタブに追加して、カスタム製品タイプの価格とさまざまなオプションを設定できるようにします。このために、次のコードをプラグインのメインファイルに追加します。

 add_action( 'woocommerce_product_data_panels', 'QL_custom_product_options_product_tab_content' );

function QL_custom_product_options_product_tab_content() {
// 製品タブのターゲットで div の id を変更することを忘れないでください
?><div class='パネル woocommerce_options_panel'><?php
?><div class='options_group'><?php

woocommerce_wp_checkbox(配列(
'id' => '_enable_custom_product',
'label' => __( 'カスタム商品タイプを有効にする'),
) );

woocommerce_wp_text_input(
配列（
'id' => 'demo_product_info',
'label' => __( 'カスタム製品の詳細', 'dm_product' ),
'プレースホルダー' => '',
'desc_tip' => '真',
'description' => __( 'デモ製品の詳細を入力してください。', 'dm_product' ),
'タイプ' => 'テキスト'
)
);


?></div>
</div><?php
}

これにより、カスタム商品タイプと商品のカスタムテキストフィールドを有効にするためのチェックボックスオプションが追加されます。もちろん、ドロップダウンリストの woocommerce_wp_select() やテキストエリアの woocommerce_wp_textarea_input() など、他の WooCommerce 関数を使用してさらに多くの設定を追加できます。

ただし、このデモでは、管理者がバックエンドからカスタマイズできるカスタム製品に関する簡単なテキスト情報のみを表示します。

カスタム製品タップタイプの特定のオプション

これらの機能の詳細と使用方法については、こちらをご覧ください。

カスタム WooCommerce 製品タイプタブフィールドの保存

製品タイプの設定を作成したので、データベースに保存する必要があります。これは woocommerce_process_product_meta フックを使用して行われます。このために、次のコード行を使用します。

 add_action( 'woocommerce_process_product_meta', 'save_demo_product_settings' );

関数 save_demo_product_settings( $post_id ){

$demo_product_info = $_POST['demo_product_info'];

if( !empty( $demo_product_info ) ) {
update_post_meta( $post_id, 'demo_product_info', esc_attr( $demo_product_info ) );
}
}

このコードをプラグインのメインファイルに追加すると、製品を更新または公開するときにカスタム製品タイプの設定を保存できるようになります。

カスタム製品タブタイプの保存済み製品設定

ただし、これらのコードはバックエンド専用であり、使用する WooCommerce 用のテンプレートが定義されるまで、製品のフロントエンドに表示されます。このために、チュートリアルの次のステップを使用して、カスタム製品タイプのコンテンツを表示します。

カスタム商品タイプのコンテンツを追加する

Web サイトのカスタム商品タイプを作成しましたが、商品タイプにどのような種類のコンテンツを持たせたいかを WooCommerce に指定する必要もあります。このために、woocommerce_single_product_summary フックを使用して、カスタム製品の詳細タブに追加した製品情報を追加します。

 add_action( 'woocommerce_single_product_summary', 'demo_product_front' );

関数 demo_product_front () {
グローバル $product;
if ( 'デモ' == $product->get_type() ) { 
echo( get_post_meta( $product->get_id(), 'demo_product_info' )[0] );
}
}

上記のように、製品タイプ ID がコードif ('demo' == $product->get_type()と一致することを確認してください。このコードを保存すると、カスタム製品の詳細が前面に表示されます。

完全なコードスニペット

便宜上、さまざまなコードを 1 つのセットにまとめたので、プラグインのメインファイルに貼り付けて、必要に応じて編集するだけです。

 <?php
/**
* プラグイン名: QuadLayers カスタム プロダクト タイプ
* 説明: カスタム製品タイプを WooCommerce に追加するプラグイン
* 作者: QuadLayers
* 著者 URI: https://www.quadlayers.com
* バージョン: 1.0
*/


defined( 'ABSPATH' ) または終了します。

add_action( 'init', 'register_demo_product_type' );
関数 register_demo_product_type() {
クラス WC_Product_Demo は WC_Product を拡張します {

public function __construct( $product ) {
$this->product_type = 'デモ';
親::__construct( $product );
}
}
}


add_filter( 'product_type_selector', 'add_demo_product_type' );
関数 add_demo_product_type( $types ){
$types[ 'demo' ] = __( 'デモ製品', 'dm_product' );
$types を返します。 
}


add_filter( 'woocommerce_product_data_tabs', 'demo_product_tab' );
関数 demo_product_tab( $tabs) {

$tabs['demo'] = 配列(
'label' => __( 'デモ製品', 'dm_product' ),
'ターゲット' => 'demo_product_options',
'クラス' => 'show_if_demo_product',
);
$タブを返します。
}


add_action( 'woocommerce_product_data_panels', 'demo_product_tab_product_tab_content' );
関数 demo_product_tab_product_tab_content() {
?><div class='パネル woocommerce_options_panel'><?php
?><div class='options_group'><?php


woocommerce_wp_checkbox(配列(
'id' => '_enable_custom_product',
'label' => __( 'カスタム商品タイプを有効にする'),
) );


woocommerce_wp_text_input(
配列（
'id' => 'demo_product_info',
'label' => __( 'デモ製品の詳細', 'dm_product' ),
'placeholder' => 'フロントエンドに表示するテキストをここに挿入',
'desc_tip' => '真',
'description' => __( 'デモ製品情報を入力してください。', 'dm_product' ),
'タイプ' => 'テキスト'
)
);
?></div>
</div><?php
}

add_action( 'woocommerce_process_product_meta', 'save_demo_product_settings' );

関数 save_demo_product_settings( $post_id ){

$enable_custom_product = isset( $_POST['_enable_custom_product'] ) ? 'はい・いいえ';
update_post_meta( $post_id, '_enable_custom_product', $enable_custom_product );
$demo_product_info = $_POST['demo_product_info'];

if( !empty( $demo_product_info ) ) {
update_post_meta( $post_id, 'demo_product_info', esc_attr( $demo_product_info ) );
}
}


add_action( 'woocommerce_single_product_summary', 'demo_product_front' );

関数 demo_product_front () {
グローバル $product;
if ( 'デモ' == $product->get_type() ) { 
echo( get_post_meta( $product->get_id(), 'demo_product_info' )[0] );
}
}

もちろん、このチュートリアルで示したすべての手順は非常に単純です。カスタム商品タイプにフィールド、設定、およびコンテンツをさらに追加してみてください。また、ご覧のとおり、このチュートリアルはプログラミングが少し多めです。 そのため、WordPress やコーディングが初めての場合は、コメントセクションでいつでもサポートを求めることができます。さらに、テーマの functions.php ファイルを使用してこれらすべてのコードを Web サイトに追加することもできます。

これにより、WordPress プラグインを作成するステップがスキップされますが、テーマを変更または更新すると変更が消えることに注意してください (子テーマを使用しない限り)。この方法ではプラグインを使用することを強くお勧めしますが、 functions.php ファイルを使用するには、そうすることができます。

functions.php ファイルに変更を加える前に、必ず WordPress サイトの完全なバックアップを作成してください。 そうすれば、何か問題が発生した場合でも、いつでも作業バージョンに戻すことができます。

[外観] > [テーマファイルエディター] をクリックし、右側の [テーマファイル] サイドバーで [テーマ関数] または [functions.php] をクリックします。

関数ファイルを使用するためにテーマファイルエディタを開く

次に、上記のコードをエディターに貼り付け、[ファイルの更新] をクリックして終了します。

テーマ関数ファイルへのコードの追加

結論

これで、カスタムの WooCommerce 製品タイプをプログラムで作成するために必要なすべての手順が終了しました。カスタム商品タイプを作成するために必要なすべての手順を簡単にまとめましょう。

カスタム WooCommerce 製品タイプのプラグインを作成して有効にします。
新しい製品タイプを登録します。
単一の製品ページのカスタム製品タイプのタブを追加します。
商品タブにフィールドと設定を追加します。
商品タブのフィールドと設定を保存します。
製品タブのコンテンツをフロントエンドに表示します。

最後に、便宜上、さまざまなコードをすべて組み合わせて完全なコードを提供します。そのため、コード全体をメインファイルにコピーし、必要に応じて変更を加えることができます。

この記事がお役に立てば幸いです。さまざまな WooCommerce 設定と製品オプションのセットアップについて詳しく知りたい場合は、他の記事をご覧ください。

WooCommerce 一括割引の設定方法
プログラムでWordPressユーザーを作成する方法
プログラムで WordPress カスタムフィールドを作成する