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

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

סדר השדות הקיים

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

פרטי חיוב (billing)

פרטי משלוח (shipping)

שינוי מיקום שדה

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

נפתח את הקובץ פונקציות של התבנית שלנו functions.php ונדביק את הקוד הבא:

/**
 * Move email & phone fields below first and last name.
 *
 * @param array $fields woocommerce fields array.
 *
 * @return array
 */
function dorzki_woocommerce_reorder_fields( $fields ) {

  $fields[ 'billing' ][ 'billing_phone' ][ 'priority' ] = 21;
  $fields[ 'billing' ][ 'billing_email' ][ 'priority' ] = 22;

  return $fields;

}

add_filter( 'woocommerce_checkout_fields', 'dorzki_woocommerce_reorder_fields' );

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

סיכום

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