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 expert if you are not comfortable proceeding with the following tutorial.

You can add a custom message to the order status page that is shown only to customers with shipping addresses in a certain region. For example, you can choose to show 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.

iPhone

1. From the Shopify app, go to Store > Settings.
2. Under Store settings, tap Checkout.

Android

1. From the Shopify app, go to Store > Settings.
2. Under Store settings, tap Checkout.

1. In the Additional scripts text box, paste the following sample code:

   {% if checkout.shipping_address.country_code == 'US' and checkout.shipping_address.province_code == 'NY' %}
   <script type="text/javascript">
     var customMessage = document.createElement("div");
     customMessage.innerHTML = '<div class="section" style="padding-top: 3em"><div class="content-box"><div class="content-box__row"><p class="os-step__description">TYPE YOUR CUSTOM MESSAGE HERE.</p></div></div></div>';
     console.log(document.querySelector("[data-order-summary-section=payment-lines]"));
     document.querySelector("[data-order-summary-section=payment-lines]").before(customMessage);
   </script>
   {% endif %}

2. 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 show for customers who live in New York, USA.

   • To show 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 show 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 show 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.

3. Place a test order to view the results on the order status page.