Restricting TBYB by Shipping Zones
Updated over a week ago

Are there any country-based restrictions for using TryNow?

Currently, we only allow businesses based in the U.S. and Canada to install our TryNow app. However, we have a waitlist for merchants located outside of those countries and will be expanding soon.

We like to highlight a few key considerations for our merchants who process international orders. If you do not have local fulfillment options, international shipping is likely to take longer than domestic shipping, both in terms of getting the product in the hands of the shopper and getting the inventory back in the event of returns. If your shipping time + trial length + return period are longer than 30 days for international orders, TryNow will re-authorize the shopper's card. If you want to accommodate international orders, you may want to adjust your return period window in the Trial Plan settings in Merchant Portal to provide ample time to receive the returned goods and to avoid charging your shoppers too early, before the return has been processed.

I want to allow international shipping for buy now orders, but not for TryNow orders. How can I do this?

To restrict free shipping and returns to Try Before You Buy orders for U.S. customers only, we can use third-party apps from the Shopify App Store, such as Global-e and Zonos.

Callouts for when editing your theme

We encourage you to use an external code editor or IDE instead of the Online Code Editor from Shopify, as some code formatting errors are not detected on the latter.

These customizations may vary, as not all themes are developed precisely the same, but all share similar logic behind their functionality, which we'll take advantage of.

Overview

This document provides a brief tutorial on how to hide TryNow components from non-U.S. customers. It focuses explicitly on the Global-e and Zonos apps from the Shopify App Store.

Global-e

The Global-e service creates an object called GlobalE on the site that contains the Country property, which has a code of the country from which the site was visited, i.e., the US.

To achieve this, we can use the following code snippet to suppress the "TryNow" elements displayed to non-U.S. customers.

Although this code snippet can be executed in almost any file within the theme to serve its purpose, we recommend placing it inside a script tag at the end of the Liquid file where the Product page is rendered. This ensures that it will only be executed on product pages.

<script> 
window.addEventListener('load', function(){
if(GlobalE.Country != 'US'){
document.querySelector('#purchase-options-container').remove();
}
});
</script>

It is essential to wait for the page to load so that the Global-e object is available and you can access its content. Once the page loads, the above code will check if the country property differs from the US. If the Country property differs from the US, the "TryNow" elements are suppressed.

However, in some cases, the Global-e object may not exist or have the property Country. If this is the case, you can use the following code instead.

<script>
window.addEventListener('load', function(){
if(document.querySelector('input[name="country_code"]').value!='US'){
document.querySelector('#purchase-options-container').remove();
}
});
</script>

The alternative code snippet can be used to check the value of an input field named country_code. If the value of country_code is not "US," the "TryNow" elements are removed.

Alternatively, you can use CSS to hide the elements instead of removing them with JavaScript. This approach might be helpful if you need the elements for another purpose where you don't want them removed from the DOM but hidden from the shoppers.

Zonos

The Zonos app enables you to greet shoppers and calculate their tax and duty charges based on the location they select when entering your store. Therefore, we can utilize the greeting event to determine the shopper's location.

For more information about Zonos events and how to use them to create custom logic, please refer to the resource here: https://zonos.com/docs/global-ecommerce/integration/integrating-hello/hello-events

Although this code snippet can be executed in almost any file within the theme to serve its purpose, we recommend placing it inside a script tag at the end of the Liquid file where the Product page is rendered. This ensures that it will only be executed on product pages.

<script>
document.addEventListener('z-country-change', e => {
if (e.detail.code != 'US') {
document.querySelector('#purchase-options-container').remove();
}
});
</script>

In the code snippet above, we are waiting for the z-country-change event. Once it does, we check if the ISO code of the country selected by the user (e.detail.code) is different from "US". If it is, we remove the "TryNow" elements from the DOM.

Rather than using an event listener to wait for the page to load, we are waiting for the z-country-change event to occur. This is because Zonos may take a couple of milliseconds to run on your store after loading the page. Checking on Zonos objects before they are created may result in them being undefined and our custom logic not running.

Alternatively, you can use CSS to hide the elements instead of removing them with JavaScript, as with Global-e. This approach may be helpful if you need the elements for another purpose and do not want to remove them from the DOM but hide them from shoppers.

Did this answer your question?