shopifyshopify-template

How to force customer name & address to have proper case in Shopify


I have a Shopify site wherein when customers place orders and submit their address, etc. The address is sent to us for fulfillment in the way it was typed up:

  1. john smith

    123 street name

    timbuktu nsw 2044

or

  1. JOHN SMITH

    123 STREET NAME

    TIMBUKTU NSW 2044

or

  1. John Smith

    123 Street Name

    Timbuktu Nsw 2044

or

  1. a mixture of the above.

This is then sent through to the customer for order confirmation/shipping status/delivery status and remarketing purposes amongst others. I am not too conversant with Shopify coding side of things but my daily task is to correct the anomaly on both the order and customer screen so that it flows smoothly from here on.

Hoping there is a fix for this to be ideally proper-cased (like no. 3) at source saving us the frustration of amending it for every order manually. If there is, then I can pass it onto someone at my end to fix it. I have searched online and can only find either uppercase or lowercase but nothing for a proper case.


Solution

  • From the information provided, it is difficult to assume at which step you want to fix the problem in your workflow. However, doing it on the frontend is easy via JavaScript if you are on Shopify Plus plan. You just need to include this JavaScript snippet on your Checkout page.

    // Uses the jQuery loaded via Shopify
    //Checkout.$;
    
    // Add keyup function for all input types - text
    Checkout.$("input[type=text]").keyup(function() {
        // capitlaize the value
        Checkout.$(this).val(Checkout.$(this).val().replace(/\b\w/g, function(l) {
            return l.toUpperCase()
        }));
    });
    

    Capitalize function taken from this StackOverflow answer by Ivo

    If you don't have Shopify plus plan, then try to update it via Rest API on customer and order creation hooks.

    Shopify REST API