Show content based on customers' locations

Caution

This is an advanced tutorial and is not supported by Shopify. Knowledge of web design languages such as HTML, CSS, JavaScript, and Liquid is required. We suggest hiring a Shopify Partner if you are not comfortable proceeding with the following tutorial.

You can add a custom message to the order status page that is displayed only to customers with shipping addresses in a certain region. For example, you can choose to display a message only to customers who live in New York, USA. You can specify as many locations as you like.

Steps:

Desktop

1. From your Shopify admin, go to Settings > Checkout.
2. In the Additional scripts text box, paste the following sample code:

<script>
{% if checkout.shipping_address.country_code == 'US' and checkout.shipping_address.province_code == 'NY' %}
    Shopify.Checkout.OrderStatus.addContentBox(
    '<h2>YOUR TITLE HERE</h2>',
    '<p>YOUR MESSAGE HERE</p>'
    )
{% endif %}
</script>

1. Edit the code to specify where customers must be to receive the custom message. To do this, you need to edit the country and state abbreviations inside the Liquid {% if %} statement at the top of the code block. The message in the example above is set to display for customers who live in New York, USA.
   • To display the message to customers in a different state, replace NY with the state abbreviation of your choice. To find the postal abbreviation to use for a US state, you can check this list of state abbreviations from USPS.
   • To display the message to customers in New York as well as another state, add and checkout.shipping_address.province_code == 'XX' where XX is the state abbreviation of your choice. To add more states, repeat this step.
   • To display the message to customers in a different country, replace US with the country abbreviation of your choice. You also need to replace NY with a state or province abbreviation in the new country. If you prefer not to specify a state, then delete the following: and checkout.shipping_address.province_code == 'NY'.
   • For additional guidance on writing Liquid if statements, see the Liquid reference on Control flow tags.
2. Place a test order to view the results on the order status page.