نحوه اضافه کردن فیلد اضافی در فرم پرداخت ووکامرس

اگر فروشگاه ووکامرس را راه اندازی می کنید، از اهمیت صفحه پرداخت مطلع هستید. با این حال، مواقعی وجود دارد که باید فیلد اضافی را در فرم پرداخت ووکامرس یا سایر فیلدهای پرداخت سفارشی در صفحه پرداخت با توجه به نیاز پروژه خود اضافه کنید. این می‌تواند برای برخی از صاحبان فروشگاه‌های ووکامرس کار سنگینی […]

اگر فروشگاه ووکامرس را راه اندازی می کنید، از اهمیت صفحه پرداخت مطلع هستید. با این حال، مواقعی وجود دارد که باید فیلد اضافی را در فرم پرداخت ووکامرس یا سایر فیلدهای پرداخت سفارشی در صفحه پرداخت با توجه به نیاز پروژه خود اضافه کنید. این می‌تواند برای برخی از صاحبان فروشگاه‌های ووکامرس کار سنگینی باشد و به همین دلیل تصمیم گرفتم یک آموزش مختصر در مورد اینکه چگونه می‌توانید یک فیلد اضافی را در فرم پرداخت ووکامرس اضافه کنید ایجاد کنم.

 

صفحه پرداخت ووکامرس

به طور کلی، صفحه پرداخت یک اصطلاح تجارت الکترونیکی است که به صفحه ای اشاره دارد که در طی فرآیند پرداخت سیستماتیک، در آخرین مرحله قبل از خرید، به مشتری نشان داده می شود. راه‌های مختلفی برای بهبود تبدیل صفحه پرداخت وجود دارد، اما یکی از راه‌ها اضافه کردن فیلد اضافی در فرم پرداخت ووکامرس است که مربوط به محصول خاص شما است و همچنین حذف تمام فیلدهای غیرضروری صفحه پرداخت.

این صفحه شامل فیلدهایی است که مشتریان باید پر کنند. همچنین لازم به ذکر است که این صفحه مهم ترین صفحه هم برای فروشنده و هم برای مشتری است، زیرا مشتریان باید اطلاعات مهمی مانند آدرس، جزئیات صورتحساب، روش پرداخت را ارائه دهند که به فروشنده کمک می کند تا محصول را به مشتری تحویل دهد. .

 

صفحه پرداخت ووکامرس

 

در صورت وجود خطا در این صفحه، هیچ مشتری قادر به خرید نخواهد بود. این به شدت بر عملکرد فروشگاه شما تأثیر می گذارد، زیرا نمی توانید هیچ فروشی انجام دهید.

اگر از ووکامرس برای تقویت فروشگاه آنلاین خود استفاده می کنید، صفحه پرداخت خود را نیز دریافت می کنید. با این حال، اگر با ووکامرس آشنا هستید، می‌دانید که این فرصت را به شما نمی‌دهد که صفحه پرداخت خود را از تنظیمات سفارشی کنید.
فیلد اضافی را در فرم پرداخت ووکامرس اضافه کنید

راه‌های زیادی برای تغییر صفحه پرداخت فروشگاه‌های ووکامرس شما وجود دارد، مانند استفاده از یک افزونه شخص ثالث، افزونه‌های ووکامرس یا توسعه سفارشی.

همانطور که قبلاً ذکر کردم، فیلد پرداخت سفارشی ووکامرس در مونتاژ برای دریافت اطلاعات بیشتر از خریداران قبل از تکمیل سفارش مهم است.

مواقعی وجود دارد که شما به اطلاعات اضافی از مشتریان خود نیاز دارید و برای انجام این کار به یک زمینه اضافی نیاز دارید.

اکنون که اصول اولیه را می‌دانید، اجازه دهید یک فرو رفتن عمیق در این آموزش داشته باشیم. برای افزودن یک فیلد سفارشی به صفحه پرداخت، از دو روش استفاده می کنیم:

  1. با استفاده از یک افزونه
  2. ایجاد یک کد سفارشی

 

الف) مراحل اضافه کردن یک فیلد اضافی به صفحه پرداخت ووکامرس با استفاده از کد

این راه حل برای افرادی است که می دانند مانند توسعه دهندگان چگونه کدنویسی کنند. این کد سفارشی به شما کمک می کند تا با استفاده از چند مرحله ساده، فیلد سفارشی را به صفحه پرداخت اضافه کنید.

در اینجا مراحل ساده ای وجود دارد که باید دنبال کنید:

وارد سایت وردپرس خود شوید و به عنوان کاربر مدیریت به داشبورد دسترسی پیدا کنید.

از منوی داشبورد، روی Appearance Menu > Theme Editor Menu کلیک کنید. وقتی صفحه ویرایشگر تم باز شد، به دنبال فایل توابع تم بگردید که در آن تابعی را اضافه می کنیم که یک فیلد اضافی به صفحه پرداخت در ووکامرس اضافه می کند.

کد زیر را به فایل php اضافه کنید:

 

/**

* Add custom field to the checkout page

*/

add_action('woocommerce_after_order_notes', 'custom_checkout_field');

function custom_checkout_field($checkout)

{

echo '<div id="custom_checkout_field"><h2>' . __('New Heading') . '</h2>';

woocommerce_form_field('custom_field_name', array(

'type' => 'text',

'class' => array(

'my-field-class form-row-wide'

) ,

'label' => __('Custom Additional Field') ,

'placeholder' => __('New Custom Field') ,

) ,

$checkout->get_value('custom_field_name'));

echo '</div>';

}

برای دیدن نتیجه، باید صفحه پرداخت را به روز کنید و باید این را ببینید:

 

مراحل اضافه کردن یک فیلد اضافی به صفحه پرداخت ووکامرس

 

با این حال، توجه به این نکته مهم است که باید داده های فیلد سفارشی را تأیید کنیم. برای انجام این کار، به سادگی کد زیر را به فایل functions.php اضافه کنید:

 

/**

* Checkout Process

*/

add_action('woocommerce_checkout_process', 'customised_checkout_field_process');

function customised_checkout_field_process()

{

// Show an error message if the field is not set.

if (!$_POST['customised_field_name']) wc_add_notice(__('Please enter value!') , 'error');

}

اگر ورودی در فیلد سفارشی وجود نداشته باشد، خطایی رخ می دهد و نتیجه این خواهد بود:

 

there will be an error and this will be the outcome

اکنون که فیلد پرداخت سفارشی را اضافه کرده‌ایم و آن را تأیید کردیم، اجازه دهید تأیید کنیم که جزئیات وارد شده در قسمت سفارشی ذخیره می‌شوند یا خیر. این کار را می توان با استفاده از کد زیر که به فایل functions.php اضافه می شود انجام داد:

 

/**

* Update the value given in the custom field

*/

add_action('woocommerce_checkout_update_order_meta', 'custom_checkout_field_update_order_meta');

function custom_checkout_field_update_order_meta($order_id)

{

if (!empty($_POST['customised_field_name'])) {

update_post_meta($order_id, 'Some Field',sanitize_text_field($_POST['customised_field_name']));

}

}
 

کد چگونه کار می کند

این کد در سه مرحله ساده کار می کند. در اولین قطعه کد، فیلد سفارشی را با عنوان ایجاد کردم. سپس قطعه دوم برای اعتبارسنجی در صورت وجود ورودی در فیلد سفارشی است.

قطعه کد سوم برای تأیید اینکه آیا جزئیات وارد شده در فیلد سفارشی توسط مشتری ذخیره می شود یا نه استفاده می شود. همچنین مهم است که توجه داشته باشید که این کدها باید به فایل functions.php فروشگاه ووکامرس شما اضافه شوند.

ب) مراحل اضافه کردن یک فیلد اضافی به صفحه پرداخت ووکامرس خود با استفاده از یک افزونه

این راه حل برای کاربران وردپرسی است که با کدنویسی آشنایی ندارند. این راه حل شامل استفاده از افزونه WooCommerce Checkout Manager است.

 

WooCommerce Checkout Manager Plugin

 

من یک راهنمای سیستماتیک مفصل به شما ارائه خواهم کرد که به شما کمک می کند تا افزونه را دانلود کنید و از آن برای اضافه کردن یک فیلد اضافی در صفحه پرداخت استفاده کنید.

در اینجا مراحلی وجود دارد که باید دنبال کنید:

وارد سایت وردپرس خود شوید و به عنوان کاربر مدیریت به داشبورد دسترسی پیدا کنید.

سپس، ما قصد داریم افزونه ای را که قبلاً نشان داده ایم را نصب کنیم. اگر آن را با استفاده از پیوند بالا دانلود کرده اید، به سادگی به Plugins > Add New بروید. پس از آن، بر روی آپلود افزونه کلیک کنید و سپس فایل دانلود شده را مطابق شکل زیر مرور کنید:

 

افزونه WooCommerce Checkout Manager

 

برای دانلود مستقیم آن در پنل مدیریت، به سادگی به Plugins > Add New بروید. پس از آن، باید یک جستجوی کلیدواژه برای افزونه «WooCommerce Checkout Manager» انجام دهید. مطابق شکل زیر باید آن را نصب و فعال کنید:

 

WooCommerce Checkout Manager

برای ایجاد فیلدهای جدید، به داشبورد وردپرس بروید و روی WooCommerce > Settings کلیک کنید. سپس بر روی تب Checkout کلیک کرده و بر روی زبانه Additional کلیک کنید. مطابق شکل زیر بر روی Add New Field کلیک کنید:

 

WooCommerce

 

یک پنجره جدید ظاهر می شود و باید جزئیات مربوطه را اضافه کنید. به یاد داشته باشید که تمام تغییراتی که ایجاد می کنید را ذخیره کنید:

 

WooCommerce

 

برای مشاهده نتیجه، صفحه پرداخت را به روز کنید و فیلد پرداخت جدید را مشاهده خواهید کرد:

 

صفحه پرداخت

 

نتیجه

در این آموزش کوتاه به شما نشان دادم که چگونه یک فیلد جدید به صفحه پرداخت اضافه کنید. من مطمئن هستم که تا به حال می دانید چگونه یک فیلد اضافی اضافه کنید و اصلاً سخت نیست. من دو راه حل به اشتراک گذاشته ام. یکی شامل استفاده از کد PHP است که فیلد اضافی را اضافه می کند و دیگری با یک افزونه است. این افزونه دارای ویژگی های اضافی دیگری است که می توانید به آنها نیز نگاه کنید و راه حلی برای افراد نه چندان باهوش فناوری است. با این حال، می توانید نام فیلدها را بسته به نیاز خود تغییر دهید.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *