يمكن أن يكون هذا المقتطف مفيدًا حقًا لعدة أسباب. عندما تحتاج إلى إجراء تخصيص متقدم للخروج وحقوله ، آمل أن تشكرني بعد ذلك 🙂
في مقتطف اليوم ، سنضيف مربع اختيار جديد وحقل “مخفي” جديد آخر – ثم ، إذا تم تحديد خانة الاختيار ، فسيظهر الحقل ، وإلا فإنه سيختفي مرة أخرى.
قبل: مربع الاختيار الجديد غير محدد – لذلك يظهر الحقل الجديد
بعد: يتم تحديد خانة اختيار الخروج الجديدة – وبالتالي يختفي الحقل الجديد
/**
* @snippet Add a Checkbox to Hide/Show Checkout Field - WooCommerce
* @how-to Get CustomizeWoo.com FREE
* @author Rodolfo Melogli
* @compatible WC 4.1
* @donate $9 https://businessbloomer.com/bloomer-armada/
*/
add_filter( 'woocommerce_checkout_fields' , 'bbloomer_display_checkbox_and_new_checkout_field' );
function bbloomer_display_checkbox_and_new_checkout_field( $fields ) {
$fields['billing']['checkbox_trigger'] = array(
'type' => 'checkbox',
'label' => __('Checkbox label', 'woocommerce'),
'class' => array('form-row-wide'),
'clear' => true
);
$fields['billing']['new_billing_field'] = array(
'label' => __('New Billing Field Label', 'woocommerce'),
'placeholder' => _x('New Billing Field Placeholder', 'placeholder', 'woocommerce'),
'class' => array('form-row-wide'),
'clear' => true
);
return $fields;
}
add_action( 'woocommerce_after_checkout_form', 'bbloomer_conditionally_hide_show_new_field', 9999 );
function bbloomer_conditionally_hide_show_new_field() {
wc_enqueue_js( "
jQuery('input#checkbox_trigger').change(function(){
if (! this.checked) {
// HIDE IF NOT CHECKED
jQuery('#new_billing_field_field').fadeOut();
jQuery('#new_billing_field_field input').val('');
} else {
// SHOW IF CHECKED
jQuery('#new_billing_field_field').fadeIn();
}
}).change();
");
}WooCommerce: كيفية إضافة حقل مخصص للخروج
WooCommerce: أضف حقل رقم المنزل @ Checkout
WooCommerce: تعيين مدينة الفوترة الافتراضية (أو حقول أخرى) @ Checkout
دليل تخصيص حقول WooCommerce Checkout
WooCommerce: أضف حقل “تأكيد عنوان البريد الإلكتروني” @ Checkout
WooCommerce: تحويل حقل الخروج من العنوان إلى القائمة المنسدلة
WooCommerce: إخفاء حقول فواتير تسجيل الخروج إذا كان Virtual Product @ Cart
WooCommerce: عرض أخطاء الحقول المطلوبة “Inline” @ Checkout
WooCommerce: أعد تسمية تسمية “الولاية” @ Checkout
WooCommerce: Maxlength و Minlength لحقول الخروج
يمكنك وضع مقتطفات PHP في الجزء السفلي من ملف function.php القالب الفرعي الخاص بك (احذف “؟>” إذا كان لديك هناك). من ناحية أخرى ، ينتقل CSS في ملف style.css الخاص بسمة الطفل. تأكد من أنك تعرف ما تفعله عند تحرير مثل هذه الملفات – إذا كنت بحاجة إلى مزيد من الإرشادات ، فيرجى إلقاء نظرة على الفيديو التعليمي المجاني الخاص بي “أين تضع تخصيص WooCommerce؟”
يرجى إعلامي في التعليقات إذا كان كل شيء يعمل كما هو متوقع. يسعدني مراجعة المقتطف إذا أبلغت بخلاف ذلك (يرجى تقديم لقطات شاشة). لقد اختبرت هذا الكود مع موضوع Storefront وإصدار WooCommerce المذكور أعلاه واستضافة صديقة لـ وورد بريس على PHP 7.3.
إذا كنت تعتقد أن هذا الرمز وفر لك الوقت والمال ، فلا تتردد في الانضمام إلى أكثر من 14000 مشترك في WooCommerce Weekly للحصول على تحديثات منشورات المدونة أو أكثر من 250 من مؤيدي Business Bloomer لمدة 365 يومًا من مزايا WooCommerce . شكرا لكم مقدما 🙂
تحقق من دروس الفيديو المجانية هذه. يمكنك تعلم كيفية تخصيص WooCommerce بدون مكونات إضافية غير ضرورية ، وكيفية تكوين إعدادات البرنامج المساعد WooCommerce بشكل صحيح وحتى كيفية إتقان استكشاف أخطاء WooCommerce في حالة حدوث خطأ!
