Create a custom WooCommerce product type
وقتی در حال کار بر روی یک راه حل پیچیده و سفارشی با استفاده از WooCommerce هستید ، این احتمال وجود دارد که نیاز داشته باشید تا نوع محصول ووکامرس خود را ایجاد کنید. در این آموزش ، ما یاد خواهیم گرفت که چگونه این کار را انجام دهیم.
ایجاد یک نوع محصول سفارشی WooCommerce می تواند یک روش عالی برای کنترل دقیق تر انواع محصولات و نحوه فروش آنها (یا آنچه که ارائه می دهند) باشد.
انواع محصولات می توانند موارد مختلفی مانند رزرو ، اشتراک ، بلیط یا موارد کاملاً متفاوت باشند. اگر می خواهید نحوه ساخت نوع محصول پیشرفته را بیاموزید ، از شما دعوت می کنم برخی از انواع محصولات محبوب ترین افزونه های WooCommerce مانند اشتراک های WooCommerce یا WooCommerce Bookings را بخوانید.
ایجاد یک نوع محصول سفارشی ووکامرس
در این آموزش ، ما یک نوع محصول پیشرفته ایجاد خواهیم کرد تا به شما نشان دهیم چگونه می توانید قیمت های فعلی را نشان دهید ، قیمت های سفارشی را فعال کنید و همچنین یک پنل متفاوت برای آن اضافه کنید.
نحوه ایجاد نوع محصول سفارشی WooCommerce :
- کلاس جدید WooCommerce Type Type را تعریف کنید.
- نوع را به فیلتر نوع محصول WooCommerce اضافه کنید
- نوع را به عنوان طبقه بندی نوع محصول اضافه کنید
- روشهای رفکتور
- افزودن تنظیمات جدید
- ذخیره کردن تنظیمات جدید
این مراحل اساسی است و موارد بسیاری وجود دارد که احتمالا با کدگذاری آنها خواهید فهمید. سعی می کنم با کد اسکلتی که در اینجا ایجاد خواهیم کرد ، چند ساعت در شما صرفه جویی کنم.
قبل از شروع کدگذاری ، به wp-content / plugins بروید و یک پوشه از wc-product-type ایجاد کنید و در داخل آن این را ایجاد کنید:
- فایل wc-product-type.php
- فولدر includes
- فایل includes/class-wc-product-advanced.php
1- نوع محصول WooCommerce را تعریف کنید:
قبل از حتی کدگذاری ، باید تعیین کنید نوع محصول شما چه کاری انجام می دهد. این امر به شما کمک می کند تا تصمیم بگیرید کدام نوع محصول را گسترش دهید. اگر کلاس کاملا متفاوتی باشد ممکن است کلاس انتزاعی را گسترش دهید.
نوع محصول پیشرفته ما ساده خواهد بود. این یک قیمت گذاری پیشرفته برای مدیران یا هر کاربری که می تواند گزینه ها را مدیریت کند فراهم می کند. بنابراین ، ما همچنین باید گزینه تغییر قیمت عادی را برای دیگران فراهم کنیم.
با در نظر گرفتن این موضوع ، می توانیم نوع محصول ووکامرس خود را در بالای نوع محصول Simple کد کنیم.
کد زیر را در فایل wc-product-type.php وارد کنید:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<?php /** * Plugin Name: WooCommerce Custom Product Type * Description: Accompanying code for the tutorial on ibenic.com */ if ( ! defined( 'ABSPATH' ) ) { return; } class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { add_action( 'woocommerce_loaded', array( $this, 'load_plugin' ) ); } /** * Load WC Dependencies * * @return void */ public function load_plugin() { require_once 'includes/class-wc-product-advanced.php'; } } new WC_Product_Type_Plugin(); |
ما پس از بارگیری WooCommerce با استفاده از عملکرد woocommerce_loaded ، تمام وابستگی های WC را بارگیری خواهیم کرد. این اطمینان می دهد که وقتی نوع محصول خود را وارد می کنیم ، انواع محصول WooCommerce قبلا وجود داشته باشد.
توجه: فعال سازی افزونه را فراموش نکنید تا بتوانید تغییرات را مشاهده کنید.
اکنون ، پرونده دیگر includes/class-wc-product-advanced.php را باز کنید و قطعه کد زیر را وارد کنید:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
<?php /** * Advanced Product Type */ class WC_Product_Advanced extends WC_Product_Simple { /** * Return the product type * @return string */ public function get_type() { return 'advanced'; } /** * Returns the product's active price. * * @param string $context What the value is for. Valid values are view and edit. * @return string price */ public function get_price( $context = 'view' ) { if ( current_user_can('manage_options') ) { $price = $this->get_meta( '_member_price', true ); if ( is_numeric( $price ) ) { return $price; } } return $this->get_prop( 'price', $context ); } } |
این برای هر نوع محصول ماست. ما روش get_type را برای بازگشت نوع محصول refactor می کنیم و get_price را نیز refactor می کنیم. ما می توانستیم آن را فیلتر کنیم ، اما برای هدف این آموزش ، من می خواستم به شما نشان دهم که در صورت نیاز می توانید روش های ارث بری را کاملا تغییر دهید.
به این ترتیب ، ما از همه فیلترها فرار می کنیم و قیمت را برای اعضا عودت می دهیم. اکنون که نوع محصول خود را داریم ، بیایید آن را با WooCommerce متصل کنیم.
2- افزودن نوع محصول در لیست کشویی
ما باید انواع محصولات موجود ووکامرس را فیلتر کرده و محصولات خود را اضافه کنیم. به این ترتیب کاربر می تواند نوع محصول ما را انتخاب کند.
بیایید اکنون این مورد را به پرونده پلاگین اصلی خود اضافه کنیم:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_filter( 'product_type_selector', array( $this, 'add_type' ) ); } /** * Advanced Type * * @param array $types * @return void */ public function add_type( $types ) { $types['advanced'] = __( 'Advanced', 'yourtextdomain' ); return $types; } // ... } new WC_Product_Type_Plugin(); |
3- افزودن نوع محصول به عنوان طبقه بندی نوع محصول ووکامرس
WooCommerce ، بیشتر اوقات ، نوع کالایی را روی اولین محصولی که قرار است به عنوان آن نوع محصول ذخیره شود ، ایجاد می کند. اما اگر بخواهیم آن را در ابتدا در دسترس قرار دهیم ، می توانیم هنگام فعال شدن افزونه این کار را انجام دهیم.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... register_activation_hook( __FILE__, array( $this, 'install' ) ); } /** * Installing on activation * * @return void */ public function install() { // If there is no advanced product type taxonomy, add it. if ( ! get_term_by( 'slug', 'advanced', 'product_type' ) ) { wp_insert_term( 'advanced', 'product_type' ); } } // ... } new WC_Product_Type_Plugin(); |
4- افزودن قیمت گذاری پیشرفته محصول
برای افزودن قیمت گذاری جدید ، آن را به برگه عمومی ، در زیر گزینه های دیگر قیمت گذاری می کنیم.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_action( 'woocommerce_product_options_pricing', array( $this, 'add_advanced_pricing' ) ); } /** * Add the pricing * @return void */ public function add_advanced_pricing() { global $product_object; ?> <div class='options_group show_if_advanced'> <?php woocommerce_wp_text_input( array( 'id' => '_member_price', 'label' => __( 'Pricing only for members', 'your_textdomain' ), 'value' => $product_object->get_meta( '_member_price', true ), 'default' => '', 'placeholder' => 'Add pricing', 'data_type' => 'price', ) ); ?> </div> <?php } // ... } new WC_Product_Type_Plugin(); |
ایجاد یک نوع محصول سفارشی ووکامرس
اکنون ما در اینجا مسئله ای داریم که قیمت گذاری ما نشان داده نمی شود.
خوب ، اینجا چه مشکلی وجود دارد؟ WooCommerce از JavaScript برای نمایش مشروط برگه ها و محتوا استفاده می کند. در صورت وجود options_group که show_if_ad Advanced وجود دارد ، تب General نشان داده می شود. بیایید یک عنصر خالی به صفحه تب General اضافه کنیم.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_action( 'woocommerce_product_options_general_product_data', function(){ echo '<div class="options_group show_if_advanced clear"></div>'; } ); } // ... } new WC_Product_Type_Plugin(); |
اکنون یک options_group خالی اضافه کرده ایم که هنگام استفاده از نوع محصول پیشرفته ووکامرس باید نشان داده شود.
اما ما هنوز یک مسئله داریم. اکنون ، تب General در حال نمایش است اما گزینه های قیمت گذاری نشان داده نمی شوند. چرا؟ زیرا گزینه های قیمت گذاری عادی فقط در صورت انتخاب نوع محصول ساده نشان داده می شوند. هیچ فیلتری برای نمایش آن در انواع دیگر محصولات در دسترس نیست ، بنابراین در اینجا چه کاری می توانیم انجام دهیم؟ ما دو گزینه داریم:
- قیمت گذاری را با JavaScript نشان دهید
- گزینه های جدید قیمت گذاری منظم (با نام های مختلف) ایجاد کنید و از طریق جاوا اسکریپت به تغییرات گوش دهید و موارد عادی را نیز به روز کنید.
ما با اولین گزینه پیش خواهیم رفت.
نمایش گزینه های قیمت گذاری منظم برای نوع محصول سفارشی ووکامرس:
برای نشان دادن گزینه های قیمت گذاری منظم ، باید کلاس show_if_ad Advanced را به آن options_group اضافه کنیم و همچنین اگر محصول فعلی Advanced است ، آنها را بارگذاری نشان دهیم.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_action( 'admin_footer', array( $this, 'enable_js_on_wc_product' ) ); } public function enable_js_on_wc_product() { global $post, $product_object; if ( ! $post ) { return; } if ( 'product' != $post->post_type ) : return; endif; $is_advanced = $product_object && 'advanced' === $product_object->get_type() ? true : false; ?> <script> jQuery(document).ready(function () { //for Price tab jQuery('#general_product_data .pricing').addClass('show_if_advanced'); <?php if ( $is_advanced ) { ?> jQuery('#general_product_data .pricing').show(); <?php } ?> }); </script> <?php } // ... } new WC_Product_Type_Plugin(); |
اکنون ، ما این مشکل را برطرف کردیم و همه گزینه های قیمت نشان داده می شوند.
افزودن برگه و پنل نوع محصول:
بیایید اکنون برگه و صفحه مربوط به نوع محصول WooCommerce خود را اضافه کنیم.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_filter( 'woocommerce_product_data_tabs', array( $this, 'add_product_tab' ), 50 ); add_action( 'woocommerce_product_data_panels', array( $this, 'add_product_tab_content' ) ); } /** * Add Experience Product Tab. * * @param array $tabs * * @return mixed */ public function add_product_tab( $tabs ) { $tabs['advanced_type'] = array( 'label' => __( 'Advanced Type', 'your_textdomain' ), 'target' => 'advanced_type_product_options', 'class' => 'show_if_advanced', ); return $tabs; } /** * Add Content to Product Tab */ public function add_product_tab_content() { global $product_object; ?> <div id='advanced_type_product_options' class='panel woocommerce_options_panel hidden'> <div class='options_group'> <?php woocommerce_wp_text_input( array( 'id' => '_some_data', 'label' => __( 'Data', 'your_textdomain' ), 'value' => $product_object->get_meta( '_some_data', true ), 'default' => '', 'placeholder' => 'Enter data', )); ?> </div> </div> <?php } // ... } new WC_Product_Type_Plugin(); |
با استفاده از این کد ، ما زبانه ای اضافه کرده ایم که فقط در صورت انتخاب نوع محصول پیشرفته نشان داده می شود. ما همچنین پانلی را که برای نمایش زمان انتخاب آن برگه فعال می شود ، اضافه کرده ایم. در ابتدا پنهان است. در غیر این صورت ، می تواند در بارگذاری اولیه صفحه نشان داده شود.
تنظیمات نوع محصول WooCommerce را ذخیره کنید:
بیایید اکنون با یک فرآیند صرفه جویی در WooCommerce ارتباط برقرار کنیم تا بتوانیم داده های خاص نوع محصول WooCommerce را ذخیره کنیم.
WooCommerce برای پردازش داده های خاص برای یک نوع محصول از تابع woocommerce_process_product_product_meta_ {PRODUCT_TYPE} استفاده می کند.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
<?php // ... class WC_Product_Type_Plugin { /** * Build the instance */ public function __construct() { // ... add_action( 'woocommerce_process_product_meta_advanced', array( $this, 'save_advanced_settings' ) ); } /** * @param $post_id */ public function save_advanced_settings( $post_id ) { $price = isset( $_POST['_member_price'] ) ? sanitize_text_field( $_POST['_member_price'] ) : ''; update_post_meta( $post_id, '_member_price', $price ); } // ... } new WC_Product_Type_Plugin(); |
در اینجا ، می توانید روند ذخیره خود را برای داده های خاصی که می خواهید ذخیره کنید اضافه کنید. اکنون شما یک نوع محصول WooCommerce سفارشی کاملاً فعال دارید.
با استفاده ازبرنامه نویسی شی گرایی و مفهوم ارث بری، می توانید از اکثر کدی که قبلا در انواع دیگر محصولات نوشته شده است صرف نظر کنید و فقط بر روی قسمت های خاص نوع محصول خود تمرکز کنید.
ایجاد یک نوع محصول سفارشی ووکامرس
چنان چه نسبت به محتوای این پست آموزشی پرسشی دارید یا در مورد فروشگاه ووکامرس خود نیاز به دریافت راهنمایی و مشاوره دارید، می توانید هم اکنون در ناحیه کاربری ثبت نام کرده ، اطلاعات سایت را تیکت کنید و از دانش و تخصص کارشناسان ما در وب سایت ووکامرس ایرانی، بهره بگیرید.
