Search

עמוד תשלום ב WooCommerce – שינויים והוספת שדות

במדריך נראה לא מעט שינויים שניתן לבצע בעמוד התשלום של ווקומרס. שינויים שכמפתחי חנויות דיגיטליות תמצאו שלקוחות דורשים לא פעם. נראה כיצד להסיר שדות שאינם רצויים בעמוד התשלום, כיצד לבטל ולידציה של שדות, כיצד לשנות סדר של שדות, כיצד להוסיף שדות משלכם לעמוד זה ועוד…

ווקומרס כמובן, בדיוק כמו וורדפרס עצמה, מכילה המון הוקים מועילים (actions & filters) שניתן להעזר בהם. בעבודה עם הוקים אלו, ישנו בעיקרון קובץ אחד איתו צריכים להתעסק והוא functions.php וכמובן שעדיף יהיה לשנות קובץ זה בתבנית הבת שלכם אם קיימת.

ההוק woocommerce_checkout_fields

הפילטר איתו נעבוד היום הינו woocommerce_checkout_fields, אך לפני שנתחיל נציין כי בקוד המופיע בפוסט זה ישנם הערות שימושיות שיכולות להסביר אולי טוב יותר את הפעולות שאנו מבצעים.

אז בתור התחלה בואו ניתן מבט על עמוד התשלום בווקומרס, אצלי הוא נראה כך:

עמוד התשלום - ווקומרס Checkout Fields

ייתכן ואצלכם העמוד נראה מעט אחרת בהתאם לתבנית שלכם. אצלי מופעלת כרגע התבנית StoreFront.

function savvy_print_all_fields( $fields ) {

	//if( !current_user_can( 'manage_options' ) )
	//	return; // in case your website is live

	print_r( $fields ); // wrap results in pre html tag to make it clearer
	exit;

}
add_filter( 'woocommerce_checkout_fields' , 'savvy_print_all_fields' );

אם תוסיפו את הקוד הבא לקובץ functions.php יופיע בפניכם מערך הכולל את כל שדות התשלום עם פרמטרים במקום שיופיעו השדות עצמם. כפי שאתם יכולים לראות, במערך השדות מסודרים לפי קבוצות: billing, shipping, account, order.

שדה ספציפי במערך ייראה כך:

[billing_company] => Array
(
	[label] => Company name
	[class] => Array
	(
		[0] => form-row-wide
	)
	[autocomplete] => organization
  	[priority] => 30
)

מודיפיקציה ושינויים לעמוד התשלום

כעת שהבנו באופן כללי כיצד בנוי מערך השדות בווקומרס, בואו נציג מספר דוגמאות מהחיים האמיתיים לבקשות לקוח בעל חנות ווקומרס הדורשות שימוש בפילטר woocommerce_checkout_fields.

הדרישה הראשונה של הלקוח הינה לבטל את הולידציה עבור השדות מיקוד, טלפון ומדינה (אם קיים השדה).

1. ביטול הולידציה עבור מיקוד, טלפון ומדינה

ביטול ולידציה לשדות טלפון ומיקוד - ווקומרס

כפי שציינתי, פוסט זה יעסוק ברובו בפילטר woocommerce_checkout_fields, אך לפעמים, כאשר קיימים גם שדות משלוח (shipping) וגם שדות חיוב (billing) בעמוד התשלום עדיף להשתמש בהוק woocommerce_default_address_fields מכיוון והוא מטפל בשניהם יחד.

אז יהיה קל יותר לבטל את הולידציה עבור המיקוד ועבור המדינה בצורה הבאה:

function savvy_disable_address_fields_validation( $address_fields_array ) {
 
	unset( $address_fields_array['state']['validate']);
	unset( $address_fields_array['postcode']['validate']);
	// you can also hook first_name and last_name, company, country, city, address_1 and address_2
 
	return $address_fields_array;
 
}
add_filter( 'woocommerce_default_address_fields' , 'savvy_disable_address_fields_validation' );

אך מה לגבי שדה הטלפון? הוא אינו כלול במערך address_fields. במקרה זה נכון יהיה להשתמש ב woocommerce_checkout_fields על מנת לבטל את הולידציה עבורו:

function savvy_no_phone_validation( $woo_checkout_fields_array ) {
	unset( $woo_checkout_fields_array['billing']['billing_phone']['validate'] );
	return $woo_checkout_fields_array;
}
add_filter( 'woocommerce_checkout_fields', 'savvy_no_phone_validation' );

2. הסרת שדות ברירת המחדל בעמוד התשלום

מסתבר שאותו לקוח גם מעוניין להסיר את כל השדות בעמוד התשלום למעט השדות שם, אימייל וטלפון. סיטואציה זו יכולה להתבקש כאשר הלקוחות משלמים במזומן ומקבלים את הסחורה בהגעה פיזית למקום כלשהו.

הסרה של שדות מעמוד התשלום הינה פשוטה ביותר ומתבצעת באמצעות הקוד הבא:

function savvy_remove_fields( $woo_checkout_fields_array ) {

	// she wanted me to leave these fields in checkout
	// unset( $woo_checkout_fields_array['billing']['billing_first_name'] );
	// unset( $woo_checkout_fields_array['billing']['billing_last_name'] );
	// unset( $woo_checkout_fields_array['billing']['billing_phone'] );
	// unset( $woo_checkout_fields_array['billing']['billing_email'] );
	// unset( $woo_checkout_fields_array['order']['order_comments'] );

	// and to remove the fields below
	unset( $woo_checkout_fields_array['billing']['billing_company'] );
	unset( $woo_checkout_fields_array['billing']['billing_country'] );
	unset( $woo_checkout_fields_array['billing']['billing_address_1'] );
	unset( $woo_checkout_fields_array['billing']['billing_address_2'] );
	unset( $woo_checkout_fields_array['billing']['billing_city'] );
	unset( $woo_checkout_fields_array['billing']['billing_state'] );
	unset( $woo_checkout_fields_array['billing']['billing_postcode'] );

	return $woo_checkout_fields_array;
}
add_filter( 'woocommerce_checkout_fields', 'savvy_remove_fields', 9999 );

לאחר הוספת הקוד מעלה עמוד התשלום ייראה בצורה הבאה:

הסרת שדות מעמוד התשלום בווקומרס

אם אתם מקבלים תשלומים באתר , במיוחד אם בכרטיסי אשראי, הזהרו כשאתם מבטלים שדות בעמוד התשלום.

רק נאמר כי עליכם לבטל את הולידציה עבור שדות אלו בכדי שטופס ההזמנה יישלח בהצלחה. עוד על ולידציה בהמשך הפוסט…

בואו נמשיך עם אותו לקוח. מה אם הוא מבקש מכם לשנות את השדות כך שהאימייל יהיה לפני הטלפון? הוא גם דורש כי השדה ״שם המשפחה״ והשדה ״טלפון״ יהיו אופציונלים ואחר כך הוא מתחרט ומחליט כי בעצם הוא מעוניין ששדה הטלפון והאימייל יהיו אחד לצד השני.

3. אופציונליות השדות (שדות רשות/חובה)

בוא נתחיל דווקא מכיצד לגרום לשדות להיות אופציונלים. כל מה שעליכם לעשות הוא לשנות את הפרמטר במערך השדות בצורה הבאה:

function savvy_not_required_fields( $f ) {

	unset( $f['billing']['billing_last_name']['required'] ); // that's it
	unset( $f['billing']['billing_phone']['required'] );

	// the same way you can make any field required, example:
	// $f['billing']['billing_company']['required'] = true;

	return $f;
}
add_filter( 'woocommerce_checkout_fields' , 'savvy_not_required_fields', 9999 );

4. שינוי סדר השדות

אם אתם עוקבים אחר הפוסט, אתם כנראה זוכרים שהלקוח ביקש שהשדה ״אימייל״ יופיע לפני השדה ״הטלפון״. נוכל לבצע זאת באמצעות הקוד הבא:

function savvy_email_first( $checkout_fields ) {
    $checkout_fields['billing']['billing_phone']['priority'] = 120;
    return $checkout_fields;
}
add_filter( 'woocommerce_checkout_fields', 'savvy_email_first' );

לא ארחיב על הקוד אך ממש בקרוב אכתוב פוסט המסביר בפירוט כיצד לשנות את סדר השדות אז המשיכו לעקוב.

שימו לב כי ישנם מצבים בהם אין זה מספיק לשנות את סדר השדות מכיוון וזה ישבור את העיצוב ולכן עלינו להוסיף את הקלאסים הנכונים עבור כל שדה בהתאם לשינוי. לכל אחד משדות התשלום ישנו Style משל עצמו (CSS Class) בהתאם למיקום שלו. ישנם 3 קלאסים:

  • form-row-first – half-width, first – חצי רוחב, ראשון.
  • form-row-last – half-width, last – חצי רוחב, אחרון.
  • form-row-wide – fullwidth – רוחב מלא.

לאחר שהבנו זאת, וכפי שציינו קודם – הלקוח התחרט וכעת מעוניין ששדה הטלפון יופיע לצד שדה האימייל ולא מתחתיו. ניתן לעשות באמצעות הקוד הבא:

function savvy_checkout_fields_styling( $f ) {
 
	$f['billing']['billing_email']['class'][0] = 'form-row-first';
	$f['billing']['billing_phone']['class'][0] = 'form-row-last';
 
	return $f;
 
}
add_filter( 'woocommerce_checkout_fields' , 'savvy_checkout_fields_styling', 9999 );

5. שינוי התוויות (Labels) ושינוי ה Placeholders

אותו לקוח מעונייןבמספק שינויים נוספים, האחד לגבי תוויות ו Placeholders והשני לגבי תנאי השימוש בחנות. בקוד מטה תמצאו את הקוד שמאפשר לשנות את התווית עבור השדה ״שם הפרטי״ ואת ה Placeholder עבור השדה ״הערות להזמנה״.

function savvy_labels_placeholders( $f ) {
 
	// first name can be changed with woocommerce_default_address_fields as well
	$f['billing']['billing_first_name']['label'] = 'שם החיבה שלכם';
	$f['order']['order_comments']['placeholder'] = 'ספרו לנו מה אתם חושבים:';
 
	return $f;
 
}
add_filter( 'woocommerce_checkout_fields' , 'savvy_labels_placeholders', 9999 );

התוצאה תהיה כבתמונה הבאה:

שינוי ה Placeholders בעמוד התשלום של ווקומרס

6. אפשרות של ״הסכמה לתנאי שימוש״ כתיבת סימון (Checkbox)

לפני שנמשיך לשלב הבא בו נראה כיצד להוסיף שדות משלכם לעמוד התשלום, בואו נראה את הדרך הנכונה להוסיף תיבת סימון של ״הסכמה לתנאי שימוש״. זוהי דרישה מאד שכיחה מלקוחות ובעלי חנויות ווקומרס והדרך להוסיף אפשרות זו מאד פשוטה ואף אינה דורשת כתיבת קוד.

  1. צרו עמוד חדש בשם תנאי משתמש תחת עמודים > עמוד חדש בלוח הבקרה של וורדפרס.
  2. גשו לווקומרס > הגדרות > מתקדם וקבעו את העמוד שיצרתם תחת ״תנאי שימוש״.
הוספת עמוד תנאי השימוש - ווקומרס

בזאת סיימנו, לאחר שבחרתם את העמוד ושמרתם את ההגדרות, תיבת הסימון תופיע בעמוד התשלום בדיוק לפני הכפתור ״שליחת הזמנה״.

הוספת שדות משלכם לעמוד התשלום

בחלק זה נראה כיצד להוסיף שני שדות לעמוד התשלום של ווקומרס. האחד ״דרך התקשרות מועדפת״ אשר יהיה DropDown מתחת לפרטי החיוב (שדה חובה) והשני ״הרשמה לרשימת התפוצה״ שיופיע בחלק ״הערות להזמנה״.

בתור התחלה עלינו לבחור היכן להוסיף את השדות החדשים והאפשרויות שלנו הינם:

  • woocommerce_before_checkout_billing_form
  • woocommerce_after_checkout_billing_form
  • woocommerce_before_checkout_registration_form
  • woocommerce_after_checkout_registration_form
  • woocommerce_before_checkout_shipping_form
  • woocommerce_after_checkout_shipping_form
  • woocommerce_before_order_notes
  • woocommerce_after_order_notes

ניתן להבין את משמעות המיקומים מהשמות עצמם. הסדר בו ההוקים מופיעים ברשימה אגב, הוא גם הסדר בו הם מופיעים ברמת התבנית.

מיקומים אלו לא יעבדו במצב בו קבצי התבנית של ווקומרס הנקראים form-shipping.php ו form-billing.php נדרסים על ידי התבנית שלכם. במצב זה באפשרותכם להוסיף את השדות החדשים בקבצי התבנית בתיקייה woocommerce/checkout/.

// select
function savvy_select_field( $checkout ){
 
	// you can also add some custom HTML here
 
	woocommerce_form_field( 'contactmethod', array(
		'type'          => 'select', // text, textarea, select, radio, checkbox, password, about custom validation a little later
		'required'	=> true, // actually this parameter just adds "*" to the field
		'class'         => array('savvy-field', 'form-row-wide'), // array only, read more about classes and styling in the previous step
		'label'         => 'דרך התקשרות מועדפת',
		'label_class'   => 'savvy-label', // sometimes you need to customize labels, both string and arrays are supported
		'options'	=> array( // options for <select> or <input type="radio" />
			''		=> 'אנא בחרו דרך התקשרות', // empty values means that field is not selected
			'By phone'	=> 'טלפונית', // 'value'=>'Name'
			'By email'	=> 'באמצעות אימייל'
			)
		), $checkout->get_value( 'contactmethod' ) );

	// you can also add some custom HTML here

}

// checkbox
function savvy_subscribe_checkbox( $checkout ) {

	woocommerce_form_field( 'subscribed', array(
		'type'	=> 'checkbox',
		'class'	=> array('savvy-field form-row-wide'),
		'label'	=> '&nbsp;הרשמו לרשימת התפוצה.',
		), $checkout->get_value( 'subscribed' ) );

}

// save field values
function savvy_save_what_we_added( $order_id ){

	if( !empty( $_POST['contactmethod'] ) )
		update_post_meta( $order_id, 'contactmethod', sanitize_text_field( $_POST['contactmethod'] ) );


	if( !empty( $_POST['subscribed'] ) && $_POST['subscribed'] == 1 )
		update_post_meta( $order_id, 'subscribed', 1 );
 
}

// add fields
add_action( 'woocommerce_after_checkout_billing_form', 'savvy_select_field' );
add_action( 'woocommerce_after_order_notes', 'savvy_subscribe_checkbox' );
 
// save fields to order meta
add_action( 'woocommerce_checkout_update_order_meta', 'savvy_save_what_we_added' );

לאחר הוספה של הקוד מעלה לקובץ functions.php (או לתוסף שפיתחתם), השדות יופיעו בעמוד התשלום של ווקומרס כפי שרצינו.

הוספת שדות משלכם לעמוד התשלום בווקומרס

לאחר שהוספתם קוד זה, השדות החדשים יופיע בעמוד התשלום

בחירות אלו של המשתמש אינן מופיעות בעמוד ההזמנה כברירת מחדל. בכדי להציג אותן בעמוד ההזמנה עצמו, עליכם להוסיף קוד בסגנון הבא:

function savvy_checkout_field_display_admin_order_meta($order){
    echo '<p><strong>'.__('Preferred Contact Method').':</strong> <br/>' . get_post_meta( $order->get_id(), 'contactmethod', true ) . '</p>';
    echo '<p><strong>'.__('Subscribed').':</strong> <br/>' . get_post_meta( $order->get_id(), 'subscribed', true ) . '</p>';

}
add_action( 'woocommerce_admin_order_data_after_billing_address', 'savvy_checkout_field_display_admin_order_meta', 10, 1 );

כעת, לאחר שליחת ההזמנה תמצאו כי הערכים של השדות שיצרתם מופיעים בפרטי ההזמנה.

אך מה בעצם עושים עם אותה ולידציה לשדות בעמוד התשלום? הפרמטר required בפונקציה woocommerce_form_field פשוט מוסיף את הסימן * ליד התווית של השדה אך אינו מבצע ולידציה בפועל. בואו נראה כיצד להציג הודעת שגיאה במקרה והשדה ״דרך התקשרות״ אותו יצרנו  אינו ולידי.

ולידציה, שדות חובה והצגת הודעות שגיאה

הקוד מטה ידפיס הודעה במקרה והגולש לא בחר דרך התקשרות מועדפת. כפי שציינתי, עבור שדה אותו יצרתם בעצמכם בעמוד התשלום, אין זה מספיק לקבוע את הפרמטר required ל true בכדי שיהיה שדה חובה.

function savvy_check_if_selected() {
 
	// you can add any custom validations here
	if ( empty( $_POST['contactmethod'] ) )
		wc_add_notice( 'אנא בחר דרך התתקשרות מועדפת.', 'error' );
 
}
add_action('woocommerce_checkout_process', 'savvy_check_if_selected');

תנו מבט בפרמטר השני של הפונקציה wp_add_notice. הוא תומך גם ב notice ו success אך במקרה שלנו הפרמטר error הוא מה שאנחנו מחפשים.

הפיכת שדות לחובה / ולידציה / הצגת הודעות שגיאה

לסיכום

עבודה עם שדות בעמוד התשלום של ווקומרס אינה מסובכת במיוחד. ניתן לשנות את עמוד התשלום וכל שדה שתרצו באמצעות פילטרים, את השימוש בפילטר העיקרי והחשוב מהם הדגמנו בפוסט זה.

ולמרות שההסבר על דרך העבודה עם שדות אלו די ברורה לדעתי , אם אינכם מרגישים נוח לגעת בקוד אתם יכולים להשתמש בתוסף של ווקומרס (בתשלום) הנקרא Checkout Field Editor.

אם יש לכם שאלות/הערות אתם מוזמנים לספר לנו בתגובות וכמובן שאשמח אם תשתפו את הפוסט במקומות הרלוונטים, אחרי הכל זה הדלק שמניע בלוג זה 🙂

 

 

.Credits for most of this code goes to Misha Rudrastyh

רועי יוסף
רועי יוסף

מפתח אתרים ותבניות וורדפרס יעודייות על בסיס עיצוב. אוהב טיפוגרפיה, צבעים ומה שבינהם ומכוון לספק אתרים רספונסיבים עם ביצועים גבוהים, מותאמים למנועי חיפוש ובעלי קוד ולידי, סמנטי ונקי.

סגור לתגובות נוספות
  • רוב 11 נובמבר 2018, 14:55

    נהדר.
    ראיתי שיש למעלה שדה של 'קופון' אני יודע שיש ערכה שמשנות את ברירת המחדל של הווקומרס.
    השאלה איך אפשר להעביר את השדה למקום יותר נגיש שישימו אליו לב, נגיד מעל הכפתור של "שליחת הזמנה"

    • שני 3 אוקטובר 2021, 22:48

      מצטרפת לשאלה
      המאמר עזר לי המון!

  • איל בורגמן 12 נובמבר 2018, 0:11

    כל הכבוד על מאמר מעולה ומקיף!

    • רועי יוסף 12 נובמבר 2018, 1:21

      מחכה לרגע שתכתוב פה פוסט בעצמך חבר 😉

  • דברת 3 פברואר 2019, 11:01

    היי, אני מנסה להשתמש בהוק שכתבת לשינוי Labels ו Placeholders ופשוט לא משתנה לי.
    זה מה שכתבתי:

    function curiositycards_savvy_labels_placeholders( $f ) {
    
    	// first name can be changed with woocommerce_default_address_fields as well
    	$f['billing']['billing_address_1']['label'] = 'כתובת למשלוח';
    	$f['billing']['billing_address_1']['placeholder'] = ' ';
    	$f['billing']['billing_postcode']['label'] = 'מיקוד';
    
    
    	return $f;
    
    }
    add_filter( 'woocommerce_checkout_fields' , 'curiositycards_savvy_labels_placeholders', 9999 );

    יש לך רעיון למה זה לא עובד לי? תודה רבה, דברת

    וחוצמזה שהפוסטים שלך מעולים ואני משתמשת במלא, אתה כותב מעולה וזה ממש עוזר לי, אז תודה!!

    • רועי יוסף 3 פברואר 2019, 14:48

      היי דברת,

      אני גם חווה זאת ונראה שישנו Javascript כלשהו שמחזיר את שמות השדות למה שאת רואה. פתרון בינתיים יכול להיות הקוד הבא כאשר את צריכה לרשום בדיוק את הטקסט שאת רוצה לשנות מימין לפקודה case, ובשורה לאחריו לרשום את הטקסט שתרצי כי יופיע:

      function my_text_strings( $translated_text, $text, $domain ) {
          switch ( $translated_text ) {
              case 'מיקוד / תא דואר' :
                  $translated_text = __( 'מיקוד', 'woocommerce' );
                  break;
              case 'כתובת רחוב' :
                  $translated_text = __( 'כתובת למשלוח', 'woocommerce' );
                  break;
          }
          return $translated_text;
      }
      add_filter( 'gettext', 'my_text_strings', 20, 3 );
  • ניסים פנירי 17 פברואר 2019, 23:44

    שלום, ותודה רבה על הפוסטים המחכימים, אני לומד מהם המון!

    רציתי לשאול אם אפשר בבקשה להסביר איך להוסיף שדה טקסט פשוט בעמוד ההזמנה (זה בכדי שיוכלו להזין שם איזה קוד מסויים שאני צריך מהלקוחות כדי להתאים להם את המוצר שהם רכשו).

    תודה רבה!

    • רועי יוסף 18 פברואר 2019, 1:22

      היי ניסים,

      שמח שאתה נהנה מהתוכן 🙂 תיארתי בפוסט בדיוק כיצד לבצע זאת, איזה חלק לא ברור לך?

  • רוב 18 פברואר 2019, 15:33

    תודה על התגובה.
    כוונתי הייתה כיצד מוסיפים שדה מסוג טקסט ולא רשימה נגללת או צ'קבוקס. מה צריך לשנות בקוד שכתבת למעלה כדי שהשדה יהיה שדה טקסט רגיל.
    תודה רבה!

    • אחיעד חזן 29 מרץ 2019, 4:19

      פשוט, במקום type => select יהיה type=>textarea

  • רוב 28 מרץ 2019, 14:09

    איך אפשר לערוך את הודעות השגיאה? כתוב "חיוב שם פרטי הוא שדה חובה." איך אני מוריד את המילה "חיוב", דרך קובץ השפה זה בסדר?

    מצאתי את הקוד הזה:

    function my_woocommerce_add_error( $error ) {
        return str_replace('Billing','Mybilling',$error);    
    }
    add_filter( 'woocommerce_add_error', 'my_woocommerce_add_error' );

    עדיף להשתמש בו ולשנות למה שאני צריך?

  • בני 19 יולי 2019, 2:01

    תוספת חיונית למאמר הנפלא – Upsale בדף התשלום. איך להוסיף הצעת מוצרים נוספים בדף הרכישה עצמו או מיד לאחר הרכישה.

  • עמי ונטורה 23 ינואר 2020, 6:57

    שלום, תוכל בבקשה להציץ מדוע אחרי שהכנסתי את הקוד הבא עדין מבקש ממני להכניס כתובת כחובה:

    function savvy_not_required_fields($f) {
    
        unset($f['billing']['billing_address_1']['required']); // that's it
        unset($f['billing']['billing_postcode']['required']);
    
        // the same way you can make any field required, example:
        // $f['billing']['billing_company']['required'] = true;
    
        return $f;
    }
    
    add_filter('woocommerce_checkout_fields', 'savvy_not_required_fields', 9999);
    • יונה 26 ינואר 2021, 23:11

      גם אצלי בדיוק אותה בעיה..

      • רועי יוסף 2 פברואר 2021, 16:32

        לי הוא עובד מצויין. כנראה זה עניין הקשור לתבנית בה אתם משתמשים.

  • דפנה 20 יולי 2020, 17:50

    איך אפשר להעלים את המילים "תא דואר" ליד המיקוד, כלומר שיהיה רשום רק מיקוד?

    • רועי יוסף 20 יולי 2020, 21:30

      נסי את הקוד הבא ואמרי לי אם זה עובד לך:

      function sv_override_checkout_fields( $fields ) {
          $fields['billing']['billing_postcode']['label'] = 'מיקוד';
          $fields['billing']['billing_postcode']['placeholder'] = 'מיקוד';
          return $fields;
      }
      add_filter( 'woocommerce_checkout_fields' , 'sv_override_checkout_fields' );
  • אליאור בוכריס 26 אוגוסט 2020, 21:40

    היי רועי, מדריך מעולה!

    יש לי שאלה בנוגע להוספת שדות בחירה (יותר משדה אחד). באתר הזה Malkat.co.il הוספתי 2 שדות נוספים: "בחירת יום אספקה" ו-"בחירת שעת אספקה" עם השורות הבאות (אני לא מתכנת אלא חובבן, ייתכן ואני מדבר במושגים לא נכונים):

    // select Delivery Day 
    function savvy_select_field( $checkout ){
    
    	// you can also add some custom HTML here
    
    	woocommerce_form_field( 'contactmethod', array(
    		'type'          => 'select', // text, textarea, select, radio, checkbox, password, about custom validation a little later
    		'required'	=> true, // actually this parameter just adds "*" to the field
    		'class'         => array('savvy-field', 'form-row-wide'), // array only, read more about classes and styling in the previous step
    		'label'         => 'בחירת יום אספקה',
    		'label_class'   => 'savvy-label', // sometimes you need to customize labels, both string and arrays are supported
    		'options'	=> array( // options for <select> or <input type="radio" />
    			'אנא בחרו יום אספקה'		=> 'אנא בחרו יום אספקה', // empty values means that field is not selected
    			'מיידי עד 5 שעות'	=> 'מיידי עד 5 שעות', // 'value'=>'Name'
    			'יום ראשון'	=> 'יום ראשון',
    			'יום שני'	=> 'יום שני',
    			'יום שלישי'	=> 'יום שלישי',
    			'יום רביעי'	=> 'יום רביעי',
    			'יום חמישי'	=> 'יום חמישי',
    			'יום שישי'	=> 'יום שישי'
    			)
    		), $checkout->get_value( 'contactmethod' ) );
    //* Add select field to the checkout page
    add_action('woocommerce_after_checkout_billing_form', 'wps_add_select_checkout_field');
    function wps_add_select_checkout_field( $checkout ) {
    
    	woocommerce_form_field( 'daypart', array(
    	    'type'          => 'select',
    	    'class'         => array( 'wps-drop' ),
    	    'label'         => __( 'בחירת שעת אספקה' ),
    	    'options'       => array(
    	    	'שעת אספקה'		=> __( 'אנא בחרו שעת אספקה', 'wps' ),
    	        'בוקר'	=> __( '10:00-14:00', 'wps' ),
    	        'ערב'	=> __( '16:00-20:00', 'wps' ),
    	    )
     ),
    
    	$checkout->get_value( 'daypart' ));
    
    }

    כדי להציג את הנתונים בממשק הזמנות בלוח הבקרה הוספתי את השורות הבאות:

    // save fields to order meta
    add_action( 'woocommerce_checkout_update_order_meta', 'savvy_save_what_we_added' );
    
    function savvy_checkout_field_display_admin_order_meta($order){
        echo '<p><strong>'.__('יום אספקה מבוקש').':</strong> <br/>' . get_post_meta( $order->get_id(), 'contactmethod', true ) . '</p>';
    	    echo '<p><strong>'.__('שעת אספקה מבוקשת').':</strong> <br/>' . get_post_meta( $order->get_id(), 'daypart', true ) . '</p>';
    
    }
    add_action( 'woocommerce_admin_order_data_after_billing_address', 'savvy_checkout_field_display_admin_order_meta', 10, 1 );

    ומשום מה הוא לא מציג לי את "שעת אספקה מבוקשת". חפרתי קצת אני יודע, אשמח לסיוע בנושא.

    תודה רבה לך!

    • אליאור בוכריס 26 אוגוסט 2020, 22:01

      ***אני מתקן את התגובה שלי. אני לא מקבל את הנתונים מתוך השדה בחירה "שעת אספקה מבוקשת". מצרף תמונה:
      http://prntscr.com/u6er7m
      תודה מראש רועי.

      • רועי יוסף 27 אוגוסט 2020, 1:40

        היי אליאור,

        הקוד שצירפת לא תקין, אך בכל מקרה הנה הקוד המלא שמבצע מה שאתה מחפש.. אמור לי אם יש בעיות:

        function savvy_select_field( $checkout ){
        
        
            woocommerce_form_field( 'contactmethod', array(
                'type'          => 'select', // text, textarea, select, radio, checkbox, password, about custom validation a little later
                'required'	=> true, // actually this parameter just adds "*" to the field
                'class'         => array('savvy-field', 'form-row-wide'), // array only, read more about classes and styling in the previous step
                'label'         => 'בחירת יום אספקה',
                'label_class'   => 'savvy-label', // sometimes you need to customize labels, both string and arrays are supported
                'options'	=> array( // options for <select> or <input type="radio" />
                    'אנא בחרו יום אספקה'		=> 'אנא בחרו יום אספקה', // empty values means that field is not selected
                    'מיידי עד 5 שעות'	=> 'מיידי עד 5 שעות', // 'value'=>'Name'
                    'יום ראשון'	=> 'יום ראשון',
                    'יום שני'	=> 'יום שני',
                    'יום שלישי'	=> 'יום שלישי',
                    'יום רביעי'	=> 'יום רביעי',
                    'יום חמישי'	=> 'יום חמישי',
                    'יום שישי'	=> 'יום שישי'
                )
            ), $checkout->get_value( 'contactmethod' ) );
        
        
        }
        add_action('woocommerce_after_checkout_billing_form', 'savvy_select_field');
        
        
        
        
        
        
        function wps_add_select_checkout_field( $checkout ) {
        
            woocommerce_form_field( 'daypart', array(
                'type'          => 'select',
                'class'         => array( 'wps-drop' ),
                'label'         => __( 'בחירת שעת אספקה' ),
                'options'       => array(
                    'שעת אספקה'		=> __( 'אנא בחרו שעת אספקה', 'wps' ),
                    'בוקר'	=> __( '10:00-14:00', 'wps' ),
                    'ערב'	=> __( '16:00-20:00', 'wps' ),
                )
            ),
        
                $checkout->get_value( 'daypart' ));
        
        }
        add_action('woocommerce_after_checkout_billing_form', 'wps_add_select_checkout_field');
        
        
        
        
        
        
        function wps_select_checkout_field_process() {
            global $woocommerce;
        
            // Check if set, if its not set add an error.
            if ($_POST['daypart'] == "blank")
                wc_add_notice( '<strong>Please select a day part under Delivery options</strong>', 'error' );
            if ($_POST['contactmethod'] == "blank")
                wc_add_notice( '<strong>Please select a hours part under Delivery options</strong>', 'error' );
        
        }
        add_action('woocommerce_checkout_process', 'wps_select_checkout_field_process');
        
        
        
        
        
        
        function wps_select_checkout_field_update_order_meta( $order_id ) {
        
            if ($_POST['daypart']) update_post_meta( $order_id, 'daypart', esc_attr($_POST['daypart']));
            if ($_POST['contactmethod']) update_post_meta( $order_id, 'contactmethod', esc_attr($_POST['contactmethod']));
        
        }
        add_action('woocommerce_checkout_update_order_meta', 'wps_select_checkout_field_update_order_meta');
        
        
        
        
        
        //* Add selection field value to emails
        function wps_select_order_meta_keys( $keys ) {
        
            $keys['Daypart:'] = 'daypart';
            $keys['Contact Method:'] = 'contactmethod';
            return $keys;
        
        }
        add_filter('woocommerce_email_order_meta_keys', 'wps_select_order_meta_keys');
        
        
        
        
        
        
        
        function savvy_checkout_field_display_admin_order_meta($order){
            echo '<p><strong>'.__('יום אספקה מבוקש').':</strong> <br/>' . get_post_meta( $order->get_id(), 'contactmethod', true ) . '</p>';
            echo '<p><strong>'.__('שעת אספקה מבוקשת').':</strong> <br/>' . get_post_meta( $order->get_id(), 'daypart', true ) . '</p>';
        
        }
        add_action( 'woocommerce_admin_order_data_after_billing_address', 'savvy_checkout_field_display_admin_order_meta', 10, 1 );
        • אליאור בוכריס 27 אוגוסט 2020, 9:41

          היי רועי, עובד פיקס.
          אני מאוד רוצה לדעת מה הייתה הבעיה, ישבתי על זה שלוש שעות ללא הצלחה :/

        • liy 8 אפריל 2021, 12:18

          היי,

          שמתי את הקוד הזה באתר שלי והוא מאוד עוזר לי! רציתי לשאול שאלה בנוגע לקוד, אני מעוניין להגדיר שכאשר 30 אנשים בחרו בשעת "בוקר" אז זה ינעל את האופצייה. כאילו שאפשר בכל זמן אספקה עד 30 איש. אפשרי?

          • רועי יוסף 8 אפריל 2021, 12:37

            היי,

            מאמין שכן – אך זה מעבר לסקופ של מדריך זה…

  • יוחנן 30 ספטמבר 2020, 17:07

    שלום רועי,
    אשמח לדעת האם יש אפשרות לשנות את הטקסט בכפתור שליחת הזמנה, שאם הלקוח בחר תשלום באשראי, יופיע לו משהו בסגנון "לתשלום באשראי", ורק אם הוא בחר לשלם במזומן ישאר הטקסט "שליחת הזמנה".
    בתודה מראש

    • רועי יוסף 5 אוקטובר 2020, 3:31

      היי יוחנן,

      אפשר לעשות זאת באמצעות Javascript, אך איני יכול להסביר כיצד לעשות דרך התגובות כאן. מציע שתעזר במתכנת. בהצלחה!

      • יוחנן 5 אוקטובר 2020, 21:27

        תודה,
        מצאתי עכשיו את האפשרות, אני משתף פה בשביל אנשים אחרים.

        add_filter('woocommerce_available_payment_gateways', 'change_barion_label');
        function change_barion_label($gateways) {
            if($gateways['yaadpay']) {
                $gateways['yaadpay']->order_button_text = 'לתשלום מאובטח';
            }
            return $gateways;
        }

        בדוגמא שלי זה בשביל אפשרות התשלום של יד שריג, וכמובן כל אחד יכול להתאים את זה, לחברת הסליקה שלו (בשורה הרביעית).

        • רועי יוסף 6 אוקטובר 2020, 4:08

          מגניב 🙂 תודה רבה על השיתוף!

  • ענת 9 נובמבר 2020, 12:12

    שלום ותודה על המאמרים המצוינים, אתה ממש מסביר שלב שלב – לאט אבל בטוח!
    אני די מתחילה עם חנויות, ולקוח שלי רוצה אפשרות של תשלום בכרטיס אשראי – לא רק פייפאל אלא הכנסה של פרטי כרטיס אשראי, ולא מצאתי איך לבצע זאת בהגדרות – לא מופיע שם

    תודה מראש!

  • אילה דייויס 17 נובמבר 2020, 11:26

    תודה על המאמר המפורט!
    אשמח לדעת איך מוסיפים כמה צ'ק בוקסים לדף התשלום. ניסיתי לשחק קצת עם הקוד ולא הצלחתי..
    תודה

  • שירז 23 נובמבר 2020, 22:27

    היי רועי, תודה על הפוסט!

    עשיתי שימוש בפונקציה שנכתבה ע״י אדם אחר – כאשר המטרה היא אותה מטרה – הסרת שדות מה – billing וה – shipping, לפני כן, עשיתי שימוש בפונקציה שמבצעת הסרת ולדיציה מאותם השדות. ניקיתי קאש בדפדפנים בהם אני עושה בדיקה + ניקוי בשרת אחסון – עדיין מקבלת הודעת שגיאה שעליי להכניס כתובת ואין לי אופציה להמשיך לתשלום.

    (מדובר רק באיסוף מנקודות איסוף נבחרות ולכן אין צורך בכתובת בכלל).

    מה אני מפספסת? (אין שגיאות בקוד).

    • רועי יוסף 25 נובמבר 2020, 19:49

      היי שירז,

      אני לא יודע באיזה קוד השתמשת אז קשה לי לעזור…. בא לך לצרף את הקוד בתגובה?

      • שירז 14 דצמבר 2020, 20:27

        עשיתי שימוש גם בקוד שלך, בסוף הבעיה נפתרה ע״י ביטול הסרת השדה של האזור + הוספת קוד להסרת דרישה.

        • רועי יוסף 15 דצמבר 2020, 1:54

          אוקיי, שמח שנפתרה הבעיה 🙂

  • רוב 23 דצמבר 2020, 17:25

    איך אפשר לעשות שיטת תשלום במזומן לשליח?
    ככה שיהיה כתוב כמה עולה השליחות אבל לא יהיה חיוב?

  • שמעון 28 דצמבר 2020, 14:46
    /**
     * Functions and definitions.
     */
    require_once ASTRA_THEME_DIR . 'inc/class-astra-after-setup-theme.php';
    
    // Required files.
    require_once ASTRA_THEME_DIR . 'inc/core/class-astra-admin-helper.php';
    • שמעון 28 דצמבר 2020, 14:47

      איך אני יכול למחוק את כל השדות החיוב את כל הפרטי חיוב אני לא מצליח אני ישמח שמישהו יכתוב לי את הקוד שאני ידביק

  • חנן 28 פברואר 2021, 10:45

    הי השתמשתי בקוד של הורדת שדה ושינוי שם.
    בשם פרטי זה עובד תקין אבל בכתובת משום מה אני לא מצליח לשנות את השם למה שאני רוצה(מציג את השינוי לשנייה אחת ולאחר מכן קופץ הכיתוב המקורי) יש אפשרות לדרוס את זה?

  • אריאל 4 מרץ 2021, 9:13

    תודה רועי.
    תוכל אולי לעזור בשינוי הטקסט של ׳קראתי ואני מסכים לתנאי השימוש׳?

    • רועי יוסף 4 מרץ 2021, 12:32

      נסה לעשות זאת דרך ״התאמה אישית״ בסרגל הניהול של וורדפרס. לוח בקרה > עיצוב > התאמה אישית… ואז עמוד התשלום.

      • אריאל 4 מרץ 2021, 12:41

        אני בתבנית אסטרה, אין האופציה לשינוי של הטקסט הזה.
        חשבתי שיש לך משהו בשלוף, לא קריטי. תודה רבה!

  • מרים 9 מאי 2021, 22:03

    מאמר מצוין!
    הצלחתי בעזרתך לשנות שדה שיהיה אופציונלי.
    אך לא הצלחתי להבין איך עושים הפוך, שדה שהוא אפציונלי כרגע ואני רוצה שיהיה חובה
    תודה

  • עדי 6 יולי 2021, 18:33

    היי,
    אם אני רוצה להוסיף שדה שאנשים יאשרו דיוור לאימייל שלהם איך אני עושה משהו כזה?

  • עידית 19 דצמבר 2021, 0:05

    שגיאה בסיום הזמנה, לא חסר כלום ומופיע סימן קריאה אדום. ההזמנה לא מראה שהושלמה. אז יש שגיאה ולא ברור לי מהי? בבדיקה מראה בעיה woocommerce-error, מה עושים?

  • chevi 25 ינואר 2022, 10:31

    הי, יש בעיה כלשהי מהעדכון האחרון של ווקומרס, הקודים נדפקים קצת, אולי תעבור עליהם לבדיקה? שמתי קוד כמו במדריך הזה, ועבד מצוין כבר כמה פעמים. אבל אחרי העדכון האחרון של ווקומרס הוא לא נותן להשלים את ההזמנה כי רושם להכניס כתובת אפילו שיש כבר כתובת, רק אם מכניסים במשלוח לכתובת אחרת- כתובת נוספת הוא נותן להשלים את ההזמנה.

    • רועי יוסף 26 ינואר 2022, 12:06

      היי, תודה שעדכנת! אני אבדוק את הקוד בהקדם האפשרי ואעדכן כאן כשזה טופל..

  • גל פלד 8 פברואר 2022, 13:56

    היי,
    הצלחתי להסיר את שדה המיקוד בעזרת הקוד, תודה.
    הבעיה היא שכשלוחצים "משלוח לכתובת אחרת" זה נותן שדות חדשים למלא ושם שדה המיקוד עדין נמצא. איך ניתן להוריד אותו גם שם?
    בנוסף, רציתי להעביר את שדה הטלפון לפני הכתובת, לא הצליח לי משום מה.
    אשמח לעזרתך
    תודה רבה רבה

  • אברהם בדוש 23 פברואר 2022, 16:39

    היי איך אני יכול למחוק את הצ׳ק בוקס ״משלוח לכתובת אחרת״? באתר יש צורך רק בכתובת למשלוח (לא כתובת חיוב) אז העלמתי את השורות של הכתובת חיוב אבל אני רוצה גם להעלים את הצ׳קבוקס של ״משלוח לכתובת אחרת״ ושהשדות של המשלוח כן יופיעו..

    תודה מראש:)

  • ליאור סימן טוב 18 אוקטובר 2022, 0:08

    היי רועי, תודה על המידע 🙂

    שאלה – הוספתי שדות ב shipping עם הקוד שלך, הכל מגיע מצוין לעמוד ההזמנות של ווקומרס במערכת הניהול באתר, אבל השדות החדשים שהוספתי לא מופיעים במייל שנשלח – לא ללקוח ולא למנהל האתר.

    איך פותרים את זה?

    • רועי יוסף 18 אוקטובר 2022, 14:29

      היי ליאור,

      לצערי אין לי תשובה בשבילך בשלב הנוכחי… אם תמצא אשמח אם תשתף אותנו 🙂

      • ליאור סימן טוב 30 אוקטובר 2022, 21:52

        מצאתי בינתיים את זה, אבל הוא לא עושה שום דבר בהודעות המייל… חלק מהרעיון הוא שהלקוח יקבל את כל השדות שהוא ממלא באתר כביקורת אל המייל שלו וגם שמנהל האתר יכול לשלוף את כל השדות מהמייל על כל הזמנה שהוא מקבל בלי שהוא חייב להכנס אל מערכת הניהול בשביל כל הזמנה.

        אולי תמצא פה משהו שיתן לך רעיון לאיך זה בכל זאת יכול לעבוד:

        <?php
        /**
        
         * Add a custom field (in an order) to the emails
        
         */
        function custom_woocommerce_email_order_meta_fields( $fields, $sent_to_admin, $order ) {
        
        	$fields['meta_key'] = array(
        
        		'label' => __( 'Label' ),
        
        		'value' => get_post_meta( $order->id, 'meta_key', true ),
        
        	);
        
        	return $fields;
        
        }
        add_filter( 'woocommerce_email_order_meta_fields', 'custom_woocommerce_email_order_meta_fields', 10, 3 );
        

        אם תצליח זה יהיה פיצוח שימושי מאוד 🙂

  • יעל 31 אוקטובר 2022, 10:20

    תודה רבה על המאמרים המופרטים
    האם ניתן להוסיף את השדות האלו לפרטי המשתמש?

    • רועי יוסף 31 אוקטובר 2022, 11:30

      היי יעל,

      מה כוונתך לפרטי המשתמש? על איזה עמוד את מדברת בדיוק?

      • יעל 31 אוקטובר 2022, 11:33

        הוספתי שדות מותאמים אישית בuser ואני רוצה שהשדות יתמלאו מהטופס שבעמוד תשלום

ניווט מהיר

Up!
לבלוג