آموزش ووکامرس : صفحه ی تسویه حساب ووکامرس سایت خود را سفارشی کنید

ویرایش (حذف و اضافه کردن فیلد ) صفحه تسویه حساب ووکامرس

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

توجه داشته باشید این مطلب برای ووکامرس نسخه ی 2.3.8 نوشته شده است و در نسخه ی جدیدتر هم شاید مورد استفاده قرار بگیرد!!

ووکامرس چند سالی است که پلت فرمی برای تجارت الکترونیک در وب می باشد.هم چنین فروشگاه های زیبایی رو دیدم که با ووکامرس ایجاد شدند. امروز به شما چگونگی سفارشی سازی ووکامرس را می آموزم.

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

1 . ویرایش function.php

کد زیر را کپی کنید و آن را به فایل functions.php خود را اضافه کنید:

// remove Order Notes from checkout field in Woocommerce
add_filter( 'woocommerce_checkout_fields' , 'alter_woocommerce_checkout_fields' ); 
function alter_woocommerce_checkout_fields( $fields ) {
   unset($fields['order']['order_comments']);
   return $fields; 
}

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

در این مثال، ما به طور کامل order_comments را از فیلد های صفحه ی تسویه حساب حذف کردیم.

حال می خواهیم سایر زمینه ها را هم حذف کنیم!

اینجا یک لیست کامل از زمینه هایی که شما می توانید حذف کنید را داریم. توجه داشته باشید که ما فقط با اضافه کردن کد unset() عمل حذف را انجام می دهیم.

// remove Order Notes from checkout field in Woocommerce

add_filter( 'woocommerce_checkout_fields' , 'alter_woocommerce_checkout_fields' );

function alter_woocommerce_checkout_fields( $fields ) {

  unset($fields['billing']['billing_first_name']); // remove the customer's First Name for billing

  unset($fields['billing']['billing_last_name']); // remove the customer's last name for billing

  unset($fields['billing']['billing_company']); // remove the option to enter in a company

  unset($fields['billing']['billing_address_1']); // remove the first line of the address

  unset($fields['billing']['billing_address_2']); // remove the second line of the address

  unset($fields['billing']['billing_city']); // remove the billing city

  unset($fields['billing']['billing_postcode']); // remove the ZIP / postal code field

  unset($fields['billing']['billing_country']); // remove the billing country

  unset($fields['billing']['billing_state']); // remove the billing state

  unset($fields['billing']['billing_email']); // remove the billing email address - note that the customer may not get a receipt!

  unset($fields['billing']['billing_phone']); // remove the option to enter in a billing phone number

  unset($fields['shipping']['shipping_first_name']);

  unset($fields['shipping']['shipping_last_name']);

  unset($fields['shipping']['shipping_company']);

  unset($fields['shipping']['shipping_address_1']);

  unset($fields['shipping']['shipping_address_2']);

  unset($fields['shipping']['shipping_city']);

  unset($fields['shipping']['shipping_postcode']);

  unset($fields['shipping']['shipping_country']);

  unset($fields['shipping']['shipping_state']);

  unset($fields['account']['account_username']); // removing this or the two fields below would prevent users from creating an account, which you can do via normal WordPress + Woocommerce capabilities anyway

  unset($fields['account']['account_password']);

  unset($fields['account']['account_password-2']);

  unset($fields['order']['order_comments']); // removes the order comments / notes field
  return $fields;
}

2 . ویرایش style.css

اگر شما با ویرایش فایل functions.php پوسته خود موافق نیستید ، می توانید از روش دوم ما استفاده کنید .ما می خواهیم برای حذف فیلد های صفحه ی تسویه حساب از راه پنهان کردن سی اس اس استفاده کنیم این راه ساده ترین روش حذف فیلد ها می باشد.

فایل style.css پوسته خود را باز کنید (نمایش > ویرایشگر > style.css) و کد زیر را به استایل پوسته اضافه کنید :

#order_comments_field {
  display: none;
}

چه اشتباهاتی با انجام این کار رخ می دهد ؟

استفاده از این کد فیلد مورد نظرمان را پنهان کند .اما از لحاظ فنی، هر کسی که می تواند با استفاده از ابزارهای برنامه نویسی (ماننذ Inspect element گوگل کروم) که با اکثر مرورگر ها موجود است می توان آن را رویت و استفاده کرد.

تمام فیلد ها در قالب html بارگزاری می شود ، بنابراین کد شما از قالب html حذف نمی شود (این امر در سرعت لود صفحه ی شما تاثیر منفی می گذارد و در نهایت از نظر گوگل نمره ی منفی دارد) . عمدتا ، عمل  پنهان کردن چیزهایی که شما می خواهید در یک صفحه نباشند توسعه ی خوبی به حساب نمی آید.

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

پس چگونه می توانم آن را از روش درست حذف کنم؟ با حذف زمینه به طور کامل از فرم!

3 . استفاده از پلاگین

اگر شما با دو روش بالا به مشکل بر خوردید می توانید از این روش استفاده کنید

ووکامرس برای سفارشی کردن صفحه ی تسویه حساب یک افزونه طراحی کرده که کار با آن بسیار آسان است و نیاز به راهنمایی ندارد.

صفحه ی افزونه woocommerce checkout manager

امیدوارم از این مطلب نهایت استفاده را برده باشید همچنان ما سعی می کنیم مطالب بیشتری را با کیفیت بالا به شما ارایه دهیم .همچنین ما را از نظرات خود محروم نکنید. تا آموزش های بعدی شما را به خدای بزرگ می سپاریم.

خیلی مهم است بدانیم دیدگاه شما راجع به این مطلب چیست؟

avatar
  Subscribe  
Notify of