How to Show Content Based on Customer's Locations on Shopify

• Step 1: Click Setting
  From your Shopify app, click Store. Then, choose Setting.

• Step 2: Go to the Checkout section
  Select Checkout in the Store setting field.

• Step 3: Find the Additional scripts
  Scroll down to find Order processing. You will see four options. View the Additional scripts section and click on the text box.

• Step 4: Paste the code
  Copy the below by selecting the entire code and taping on Copy. After copying the code, make sure to paste it into the Additional scripts text box.

{% 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 %}

• Step 5: Edit the code
  In this step, you will have to edit the code so that the locations are specified. Type the country or region inside the Liquid {% if %} statement which is at the tope of the code. In the above sample code, the message is shown only to the customers who live in USA and New York.

• If you want to show the message to customers in a different state, replace NY with that state you expected. Remember that it must be the abbreviation. What’s more, if you want to know the postal abbreviation of the US state, UPS will provide you with a list.

• If you prefer to show the message to more than one state, add and checkout.shipping_address.province_code == 'XX'. To be more clearly, XX is the state abbreviation. Repeat this step to add more.

• To show the message to customers in a different country, you can change US with another name which is the country abbreviation you expected. Don’t forget to replace NY with a state abbreviation in the new country.

• If you don’t want to specify a state, delete and checkout.shipping_address.province_code == 'NY'.

• Step 6: Click Save
  Scroll down and make sure to select Save after you’ve done.

• Step 7: Place a test order
  In this step, you can view the results on the order status page. To do this, you need to place a test order.

• Step 1: Click Setting
  First, you need to log in your Shopify account, go to Store. Then, choose Setting.

• Step 2: Go to the Checkout section
  Select Checkout in the Store setting field.

• Step 3: Find the Additional scripts
  You can find the Order processing field by scrolling down. Then, find out the Additional scripts in four options appeared and click on the text box.

• Step 4: Paste the code
  In this step, make sure to copy the following code. After copying the code, paste it into the Additional scripts section.

{% 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 %}

• Step 5: Edit the code
  In this step, you will have to edit the code so that the locations are specified. Type the country or region inside the Liquid {% if %} statement which is at the tope of the code. In the above sample code, the message is shown only to the customers who live in USA and New York.

• If you want to show the message to customers in a different state, replace NY with that state you expected. Remember that it must be the abbreviation. What’s more, if you want to know the postal abbreviation of the US state, UPS will provide you with a list.

• If you prefer to show the message to more than one state, add and checkout.shipping_address.province_code == 'XX'. To be more clearly, XX is the state abbreviation. Repeat this step to add more.

• To show the message to customers in a different country, you can change US with another name which is the country abbreviation you expected. Don’t forget to replace NY with a state abbreviation in the new country.

• If you don’t want to specify a state, delete and checkout.shipping_address.province_code == 'NY'.

• Step 6: Save
  Select Save to make sure that you’ve followed this guide successfully.

• Step 7: Place a test order
  You can view how it works on the order status page. To do this, you need to place a test order.