Show content based on customers' locations

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:

  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.

Ready to start selling with Shopify?

Try it free