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

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

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

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

افزونه ویرایش فرم تسویه حساب ووکامرس

راحت ترین روش افزودن و حذف فیلد در صفحه پرداخت یا تسویه حساب ووکامرس استفاده از افزونه است.
خوشبختانه چندین افزونه رایگان و تجاری برای ویرایش فرم تسویه حساب ووکامرس وجود دارند که سه تا از بهترینهای آنان عبارتند از: WooCommerce Checkout Field Editor (Manager) Pro و WooCommerce Checkout Manager و Flexible Checkout Fields for WooCommerce که عملکرد تقریبا مشابهی دارند. در این مقاله به معرفی برخی از آنها میپردازیم.

افزونه ویرایش فیلدهای تسویه حساب ووکامرس Checkout Field Editor Pro

افزونه ویرایش فرم تسویه حساب ووکامرس

برخی از ویژگیهای افزونه عبارتند از:

  1. امکان افزودن فیلد دلخواه به فرم پرداخت ووکامرس
  2. قابلیت ویرایش فیلدهای فعلی صفحه تسویه حساب
  3. امکان تعیین نوع فیلد (text یا select)
  4. قابلیت افزودن فیلدهای تاریخ، چک باکس، دکمه رادیویی، فیلد مخفی و … در نسخه ویژه
  5. امکان نمایش فیلد اضافه شده در جزئیات خرید محصول و ایمیل مشتری
  6. قابلیت حذف فیلدهای پیشفرض برگه تسویه حساب ووکامرس
  7. قابلیت فعال و غیرفعال کردن فیلد در صفحه تسویه حساب، ایمیل و لیست خرید مشتری
  8. امکان جا به جایی فیلدهای صفحه تسویه حساب
  9. قابلیت افزودن متن پیشفرض placeholder برای فیلدها
  10. قابلیت بازگرداندن تنظیمات به حالت پیشفرض ووکامرس تنها با یک کلیک
  11. و …

برای دانلود افزونه به برگه آن در آدرس WooCommerce Checkout Field Editor (Manager) Pro از مخزن افزونه های وردپرس مراجعه کنید. پس از نصب و فعالسازی افزونه گزینه ای با نام فرم پرداخت یا تسویه حساب Checkout form در منو ووکامرس اضافه میشود که با مراجعه به آن با تنظیمات افزونه (شبیه تصویر زیر) روبرو خواهید شد.

افزونه ویرایش فرم تسویه حساب ووکامرس

همینطور که مشاهده میکنید با انتخاب گزینه Edit یا ویرایش روبرو هر فیلد براحتی میتوان لیبل، مورد نیاز بودن، فعال یا غیرفعال و در نهایت حذف فیلد را اعمال کرد. با انتخاب گزینه افزودن فیلد جدید Add Field امکان اضافه کردن فیلد دلخواه به برگه تسویه حساب ووکامرس وجود دارد.

افزونه ویرایش فرم تسویه حساب ووکامرس Flexible Checkout Fields

افزونه Flexible Checkout Fields for WooCommerce آمده تا تمام مشکلات تان را حل کند !

افزونه ویرایش فرم تسویه حساب ووکامرس Flexible Checkout Fields

برخی از ویژگی های افزونه عبارتند از:

  1. امکان حذف فیلد کشور و سایر فیلدها
  2. قابلیت تبدیل فیلد به مورد نیاز یا غیر ضروری
  3. امکان جابه جایی فیلدها با کشیدن و ها کردن
  4. قابلیت اختصاص کلاس css دلخواه به هر فیلد
  5. امکان افزودن فیلد دلخواه به صفحات تسویه حساب
  6. قابلیت نمایش یا مخفی کردن فیلد در صفحات تسویه حساب، پروفایل کاربر، لیست سفارشات، ایمیل و …
  7. مکان افزودن فیلد تاریخ، انتخاب رنگ ، جعبه متنی و …
  8. سازگاری با آخرین نسخه ووکامرس فارسی
  9. و …

برای دانلود افزونه به برگه آن در مخزن افزونه های وردپرس به آدرس Flexible Checkout Fields for WooCommerce مراجعه کنید.

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

آموزش تنظیمات افزونه Flexible Checkout Fields

پس از نصب افزونه گزینه ای با نام checkout fields در تب ووکامرس اضافه میشود.

با مراجعه به تنظیمات افزونه با صفحه ای مشابه تصویر زیر روبرو میشود که میتوانید با کشیدن و رها کردن فیلدها محل آنها را در فرم های تسویه حساب billing و حمل و نقل shipping , فرم سفارش order تغییر دهید.

آموزش تنظیمات افزونه Flexible Checkout Fields

هر فیلد دارای چند تب برای انجام تنظیمات متفاوت است.

در تب عمومی general امکان مخفی کردن فیلد، غیرضروری کردن فیلد، تغییر لیبل و نوع اعتبارسنجی وجود دارد.
تب ظاهر یا appearance برای اعمال کلاس دلخواه، نمایش فیلد به در راست یا چپ باکس و … وجود دارد.
تب نمایش در dispplay on برای تنظیم نمایش فیلد در فرم تسویه حساب، فرم سفارش، پروفایل کاربر و … کاربرد دارد.

بین دو افزونه ای که معرفی شد افزونه Flexible Checkout Fields for WooCommerce بهترین عملکرد را ارائه داد که پیشنهاد میکنیم برای ویرایش صفحه پرداخت ووکامرس از آن استفاده کنید.

کد حذف فیلد اضافی از فرم پرداخت ووکامرس

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

<?php add_filter('woocommerce_checkout_fields','custom_override_checkout_fields');
function custom_override_checkout_fields($fields){
//unset($fields['billing']['billing_first_name']);
//unset($fields['billing']['billing_last_name']);
unset($fields['billing']['billing_company']);
//unset($fields['billing']['billing_address_1']);
//unset($fields['billing']['billing_address_2']);
//unset($fields['billing']['billing_city']);
//unset($fields['billing']['billing_postcode']);
//unset($fields['billing']['billing_country']);
//unset($fields['billing']['billing_state']);
//unset($fields['billing']['billing_phone']);
//unset($fields['order']['order_comments']);
//unset($fields['billing']['billing_email']);
//unset($fields['account']['account_username']);
//unset($fields['account']['account_password']);
//unset($fields['account']['account_password-2']);
return $fields; } ?>

کد بالا فیلد نام شرکت company را از فرم تسویه حساب ووکامرس حذف میکند.

نحوه شناسایی فیلدهای فرم تسویه حساب و اطلاعات مشتری

در کد بالا خطهای ۳ تا ۱۷ برای شناسایی فیلدهای صفحه تسویه حساب کاربرد دارد.

  1. تابع billing_first_name : نام مشتری
  2. تابع billing_last_name : نام خانوادگی خریدار در ووکامرس
  3. تابع billing_company : نام شرکت مشتری برای صدور صورتحساب
  4. تابع billing_address_1 : آدرس اول مشتری برای ارسال محصول
  5. تابع billing_address_2 : آدرس دوم خریدار کالا
  6. تابع billing_city : شهر محل زندگی یا ارسال پستی کالا
  7. تابع billing_postcode : نمایش فیلد کد پستی محل ارسال کالا
  8. تابع billing_country : نمایش فیلد انتخاب کشور مشتری
  9. تابع billing_state : نمایش فیلد آدرس دقیق خیابان و محل زندگی خریدار کالا
  10. تابع billing_phone : نمایش فیلد شماره تماس مشتری
  11. متغییر order_comments : برای نمایش فیلد توضیحات اضافی خریدار در صفحه تسویه حساب ووکامرس
  12. تابع billing_email : نمایش فیلد آدرس پست الکترونیکی یا ایمیل خریدار محصول
  13. تابع account_username : نمایش فیلد نام کاربری فرم عضویت موجود در صفحه تسویه حساب
  14. توابع account_password و account_password-2 : رمز عبور و تکرار رمز عبور برای عضویت در فروشگاه

برای حذف کردن فیلدهای بیشتر کافیست علامت // را از ابتدای کد بردارید و فایل فانکشن را ذخیره کنید.

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

درباره نویسنده
رضا کیانوش

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

بازدیدکنندگان قبلی مشاهده مطالب زیر را به شما پیشنهاد کرده اند

دیدگاهی بنویسید.

بهتر است دیدگاه شما در ارتباط با همین مطلب باشد.

  1. amir
    ۱۰ آبان ۱۳۹۷ ساعت ۲۰:۵۸

    خیلی خیلی ممنون بایت این مطلب عالی ، یک مشکل بزرگ من حل شد
    تشکر

    • رضا کیانوش
      ۱۰ آبان ۱۳۹۷ ساعت ۲۲:۴۱

      سلام وقت بخیر، خوشحالم مشکل تون حل شده، موفق باشید.

  2. erfan
    ۱۰ آبان ۱۳۹۷ ساعت ۱۹:۴۸

    سلام ممنون از سایت خوبتون افزونه اولی عالی بود فقط نمیدونم چرا به اشتباه میزنه :
    لطفا برای ادامه یک آدرس وارد کنید.

  3. erfan
    ۱۰ آبان ۱۳۹۷ ساعت ۱۶:۳۹

    با سلام ممنون از سایت خوبتون فقط یک مشکل برام پیش اومده اونم این است که با وجود پرکردن فیلد ها همش ارور میزنه: لطفا برای ادامه یک آدرس وارد کنید.
    میشه لطفا راهنمایی کنید. با تشکر

    • رضا کیانوش
      ۱۰ آبان ۱۳۹۷ ساعت ۱۸:۰۵

      سلام وقت بخیر، اگر افزونه Flexible Checkout Fields for WooCommerce رو استفاده کنید چنین خطایی نباید بوجود بیاد. اما اگر همچنان خطا دارید این مشکل به تنظیمات ووکامرس برمیگرده، تنظیماتی که دارای چک باکس هستند رو با دقت انجام بدید.

  4. شایان
    ۹ تیر ۱۳۹۷ ساعت ۰۱:۰۸

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

    • رضا کیانوش
      ۲ آبان ۱۳۹۷ ساعت ۱۳:۵۳

      سلام وقت بخیر از افزونه Flexible Checkout Fields for WooCommerce استفاده کنید.

  5. سحر
    ۱۱ خرداد ۱۳۹۷ ساعت ۱۷:۲۲

    وقتی به سایتم اضافه کردم. سایتم صفحه سفید شد. چرا؟

    • رضا کیانوش
      ۱۱ خرداد ۱۳۹۷ ساعت ۱۷:۳۶

      سلام وقت بخیر، کدهایی که در فایل فانکشن قرار میگیرن رو در محل مناسبی قرار ندادین و باعث ایجاد تداخل و خطا شده در نتیجه اش صفحه سفید شده. کدها رو در انتهای فایل فانکشن بعد از تگ بسته php که با ?> مشخص هست بزارید اگر در اخر فانکشن

  6. پیمان
    ۷ خرداد ۱۳۹۷ ساعت ۰۱:۲۶

    ممنون از شما کاربردی بود، فقط یه سوال اینکه این افزونه مشکلی در عملکرد ووکامرس و فرآیند پرداخت به وجود نمیاره؟

    • رضا کیانوش
      ۷ خرداد ۱۳۹۷ ساعت ۰۹:۳۹

      سلام وقت بخیر، خیر مشکلی بوجود نمیاد و فرایند خرید به درستی انجام میشه. موفق باشید