WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
Woocommerce checkout fields width (4 posts)

  1. oriye
    Member
    Posted 1 year ago #

    Hello,
    I am working with a Japanese website. I arranged the order of the checkout fields with something I found one of the posts:

    add_filter('woocommerce_checkout_fields','reorder_woo_fields');

    function reorder_woo_fields($fields) {
    //move these around in the order you'd like

    $fields2['billing']['billing_last_name'] = $fields['billing']['billing_last_name'];
    $fields2['billing']['billing_first_name'] = $fields['billing']['billing_first_name'];
    $fields2['billing']['billing_company'] = $fields['billing']['billing_company'];
    $fields2['billing']['billing_address_1'] = $fields['billing'][billing_address_1''];
    $fields2['billing']['billing_address_2'] = $fields['billing']['billing_address_2'];
    $fields2['billing']['billing_city'] = $fields['billing']['billing_city'];
    $fields2['billing']['billing_postcode'] = $fields['billing']['billing_postcode'];
    $fields2['billing']['billing_country'] = $fields['billing']['billing_country'];
    $fields2['billing']['billing_state'] = $fields['billing']['billing_state'];
    $fields2['billing']['billing_email'] = $fields['billing']['billing_email'];
    $fields2['billing']['billing_phone'] = $fields['billing']['billing_phone'];

    //just copying these (keeps the standard order)
    $fields2['shipping'] = $fields['shipping'];
    $fields2['account'] = $fields['account'];
    $fields2['order'] = $fields['order'];

    return $fields2;
    }

    The Japanese method follows a reversed order, so I changed above to:

    add_filter('woocommerce_checkout_fields','reorder_woo_fields');

    function reorder_woo_fields($fields) {
    //move these around in the order you'd like

    $fields2['billing']['billing_last_name'] = $fields['billing']['billing_last_name'];

    $fields2['billing']['billing_first_name'] = $fields['billing']['billing_first_name'];

    $fields2['billing']['billing_postcode'] = $fields['billing']['billing_postcode'];

    $fields2['billing']['billing_state'] = $fields['billing']['billing_state'];

    $fields2['billing']['billing_city'] = $fields['billing']['billing_city'];

    $fields2['billing']['billing_address_1'] = $fields['billing']['billing_address_1'];

    $fields2['billing']['billing_address_2'] = $fields['billing']['billing_address_2'];

    $fields2['billing']['billing_email'] = $fields['billing']['billing_email'];

    $fields2['billing']['billing_phone'] = $fields['billing']['billing_phone'];

    //just copying these (keeps the standard order)
    $fields2['shipping'] = $fields['shipping'];
    $fields2['account'] = $fields['account'];
    $fields2['order'] = $fields['order'];

    return $fields2;
    }

    I was able to rearrange but some fields overlapped, and the fields are not aligned to its ideal position.

    The rows now per line show as:
    last name
    first name, postal code
    town/city, state
    (Address field overlapping or postal code field)
    Address 2,
    Email, Phone

    Thank you in advance for any help.

    http://wordpress.org/extend/plugins/woocommerce/

  2. jameskoster
    Member
    Plugin Author

    Posted 1 year ago #

    Hey,

    I need to see a link really. It's possible your theme is causing issues.

    Generally you should be able to set the width of checkout inputs with

    .checkout .form-row input.input-text {
    width:100%;
    }
  3. oriye
    Member
    Posted 1 year ago #

    Hi! This is my link.
    http://oriye-impressions.com/checkout/
    My site is not yet open.

    I don't know any php or codes. Do I paste the above code in the functions.php file?

    This is my function file:

    <?php
    /**
     * @package WordPress
     * @subpackage YIW Themes
     *
     * Here the first hentry of theme, when all theme will be loaded.
     * On new update of theme, you can not replace this file.
     * You will write here all your custom functions, they remain after upgrade.
     */                                                                               
    
    // include all framework
    require_once dirname(__FILE__) . '/core/core.php';
    
    // include the library for the layers slider
    require_once dirname(__FILE__) . '/inc/LayerSlider/layerslider.php';
    
    // include the library for the wishlist
    require_once dirname(__FILE__) . '/inc/yith_wishlist/init.php';
    
    /*-----------------------------------------------------------------------------------*/
    /* End Theme Load Functions - You can add custom functions below */
    /*-----------------------------------------------------------------------------------*/
    
    add_filter('woocommerce_checkout_fields','reorder_woo_fields');
    
    function reorder_woo_fields($fields) {
    	//move these around in the order you'd like
    
        $fields2['billing']['billing_last_name'] = $fields['billing']['billing_last_name'];
    
        $fields2['billing']['billing_first_name'] = $fields['billing']['billing_first_name'];
    
    	$fields2['billing']['billing_postcode'] = $fields['billing']['billing_postcode'];
    
    	$fields2['billing']['billing_state'] = $fields['billing']['billing_state'];
    
    	$fields2['billing']['billing_city'] = $fields['billing']['billing_city'];
    
    	$fields2['billing']['billing_address_1'] = $fields['billing']['billing_address_1'];
    
    	$fields2['billing']['billing_address_2'] = $fields['billing']['billing_address_2'];
    
    	$fields2['billing']['billing_email'] = $fields['billing']['billing_email'];
    
    	$fields2['billing']['billing_phone'] = $fields['billing']['billing_phone'];
    
    	//just copying these (keeps the standard order)
    	$fields2['shipping'] = $fields['shipping'];
    	$fields2['account'] = $fields['account'];
    	$fields2['order'] = $fields['order'];
    
    	return $fields2;
    }
  4. clickmac
    Member
    Posted 10 months ago #

    yep @oriye you paste it in your functions.php

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic