What if you need to add a new product type according to your needs? Having your own product type, allows you to have control over product settings. For example, you could set default values like price, visibility, etc.<\/p>\n\n\n\n
How to Create a Custom WooCommerce Product Type?<\/h2>\n\n\n\n
Crafting a new WooCommerce product type is fairly straightforward but involves some coding. To proceed, gaining familiarity with crafting custom WordPress \/ WooCommerce plugins<\/a> and adding code is advised. <\/p>\n\n\n\n In this guide, we will walk you through the process of creating a custom product type step by step. By the end of this article, you’ll be able to:<\/p>\n\n\n\n In your WordPress admin panel, navigate to your WordPress installation directory and locate the Inside Below code snippets show you how to register a new product type which executes at the ‘init’ hook at the function file of the plugin.<\/p>\n\n\n\n In the above code, we create a new product type as ‘demo’ by extending the Woocommerce WC_Product class<\/strong>.<\/p>\n\n\n\n After registering the product type we need to add the product type to the product type selector for choosing what kind of product the user wants to make. For that, we added our new product type with the default product type provided by Woocommerce as shown in the below code.<\/p>\n\n\n\n This code will add your custom product type to the Product data dropdown list using the $types[‘demo’] = __( ‘Demo product’, ‘dm_product’ ) line. You can change the text from Custom Product Type to anything such as Demo Product, Custom order, Gift card, etc.<\/p>\n\n\n\n Now, open your WP Admin Dashboard and create a new product. Under the Product Type dropdown menu, you should see a new option named \u2018Demo Product.\u2019<\/p>\n\n\n After adding an option to select the new product type we need to add a new tab associated with it and we will add a field ‘ Demo Product Spec ‘ for describing the product type. Insert this code to forge the “Custom Product Details” tab:<\/p>\n\n\n\n Ensure to replace ‘demo’ with your actual product_type ID in $tabs[‘demo’] = array if you’ve created your own product_type earlier.<\/p>\n\n\n\n The array comprises three parameters:<\/p>\n\n\n\n To add the field to it we need to add the following code on ‘woocommerce_product_data_panels’<\/strong> hook.<\/p>\n\n\n\n To save those details we will use the hook ‘ woocommerce_process_product_meta’<\/strong> and save the data in the post meta as shown in below code snippet below:<\/p>\n\n\n\n Now the admin side work is done. Now you will be able to select the new post type registered, see the new tab associated with it, and finally add the details in the field as shown below screenshot:<\/p>\n\n\n At last, we need to show the information that we added to the demo product type on the product page.<\/p>\n\n\n\n For that, we’ll execute the below code on the hook ‘ woocommerce_single_product_summary ‘<\/strong> and add the details to the product page in the front as :<\/p>\n\n\n\n After doing all this we’ll now see the demo product that we created in the front end with the information added to its custom field as shown below :<\/p>\n\n\n Hope this blog will help you to develop custom functionality in your plugin in a better way. Try this and if you have any queries then just comment below.<\/p>\n\n\n\n\n
Register Custom WooCommerce Product Type<\/h2>\n\n\n\n
wp-content\/plugins<\/strong><\/code> folder. Inside this folder, create a new directory named custom_product_type<\/strong><\/code>. Within this new directory, create a file named custom_product_type.php<\/strong><\/code><\/p>\n\n\n\ncustom_product_type.php<\/strong><\/code>, start by defining your plugin:<\/p>\n\n\n\n<?php\n\/**\n * Plugin Name: Custom Product Type\n * Description: Create a custom product type in WooCommerce\n * Author: Webkul\n * Author URI: https:\/\/webkul.com\/\n * Version: 1.0\n *\/\n\nif (!defined('ABSPATH')) {\n return;\n}<\/pre>\n\n\n\nadd_action( 'init', 'register_demo_product_type' );\n\nfunction register_demo_product_type() {\n\n class WC_Product_Demo extends WC_Product {\n\t\t\t\n public function __construct( $product ) {\n $this->product_type = 'demo';\n\tparent::__construct( $product );\n }\n }\n}<\/pre>\n\n\n\nAdd Custom WooCommerce Product option<\/h2>\n\n\n\n
add_filter( 'product_type_selector', 'wk_add_demo_product_type' );\n\nfunction wk_add_demo_product_type( $types ){\n $types[ 'demo' ] = __( 'Demo product', 'dm_product' );\n\n return $types;\t\n}<\/pre>\n\n\n\n![\"Woocommerce:](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/08\/product_type_selector-fotor-2023082912814.png\")
<\/figure>\n<\/div>\n\n\nAdding a Custom Product Type Tab<\/h2>\n\n\n\n
add_filter( 'woocommerce_product_data_tabs', 'wk_demo_product_tab' );\n\nfunction wk_demo_product_tab( $tabs) {\n\t\t\n $tabs['demo'] = array(\n 'label'\t => __( 'Demo Product', 'dm_product' ),\n 'target' => 'demo_product_options',\n 'class' => 'show_if_demo_product',\n );\n return $tabs;\n}\n<\/pre>\n\n\n\n\n
![\"Woocommerce:](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/08\/show-demo-tab-fotor-2023082912625-1200x591.png\")
<\/figure>\n<\/div>\n\n\nAdd Custom Product Type Tab Fields<\/h2>\n\n\n\n
add_action( 'woocommerce_product_data_panels', 'wk_demo_product_tab_product_tab_content' );\n\nfunction wk_demo_product_tab_product_tab_content() {\n\n ?><div id='demo_product_options' class='panel woocommerce_options_panel'><?php\n ?><div class='options_group'><?php\n\t\t\t\t\n woocommerce_wp_text_input(\n\tarray(\n\t 'id' => 'demo_product_info',\n\t 'label' => __( 'Demo Product Spec', 'dm_product' ),\n\t 'placeholder' => '',\n\t 'desc_tip' => 'true',\n\t 'description' => __( 'Enter Demo product Info.', 'dm_product' ),\n\t 'type' => 'text'\n\t)\n );\n ?><\/div>\n <\/div><?php\n}<\/pre>\n\n\n\n
This introduces a text field for the product, but you can expand the settings with various WooCommerce functions like woocommerce_wp_select() for dropdown lists, woocommerce_wp_textarea_input() for text areas, and more. Our demo focuses on exhibiting uncomplicated text details, which administrators can conveniently tailor from the backend.<\/p>\n\n\n![\"Woocommerce:](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/08\/show-demo-fields-fotor-2023082912647-1200x587.png\")
<\/figure>\n<\/div>\n\n\nSaving Custom WooCommerce Product Type Tab Fields<\/h2>\n\n\n\n
add_action( 'woocommerce_process_product_meta', 'wk_save_demo_product_settings' );\n\t\nfunction wk_save_demo_product_settings( $post_id ){\n\t\t\n $demo_product_info = $_POST['demo_product_info'];\n\t\t\n if( !empty( $demo_product_info ) ) {\n\n\tupdate_post_meta( $post_id, 'demo_product_info', esc_attr( $demo_product_info ) );\n }\n}<\/pre>\n\n\n\n![\"Save](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/08\/Screenshot-34-fotor-20230829121828-1200x311.jpg\")
<\/figure>\n<\/div>\n\n\nAdd Content for the Custom Product Type<\/h2>\n\n\n\n
add_action( 'woocommerce_single_product_summary', 'wk_demo_product_front' );\n\t\nfunction wk_demo_product_front () {\n global $product;\n\n if ( 'demo' == $product->get_type() ) { \t\n echo( get_post_meta( $product->get_id(), 'demo_product_info' )[0] );\n\n }\n}<\/pre>\n\n\n\n![\"Content](\"https:\/\/cdnblog.webkul.com\/blog\/wp-content\/uploads\/2023\/08\/front-screen-20230829122040.png\")
<\/figure>\n<\/div>\n\n\n