Localising Theme Content in Shopify - Changing Content (Based on IP) Using Geolocation Services

With the increasing push for internationalising and expanding into new territories - we’ve recently been seeing a growing number of clients wanting to achieve specific location-based messaging onsite, be it for highlighting key local selling points (e.g. accepting Sofort in DACH countries) or based on eligibility. This request has been occurring when multiple territories are served from a single store instance - for example having an EU store serving the whole of Europe, or a Rest of World store as a fallback for visitors where local stores don't exist. The use cases can be down to very light touch scenarios such as free shipping messaging across the site for specific territories only, or notifying that duties will occur from certain countries.

There are a few ways to tackle this, and the best fit solution will differ based on whether certain 3rd party technologies are already on the site and can be utilised further, or whether there is a development resource.

The first potential method for achieving this is if a personalization platform such as Nosto or Monetate are already being used. These platforms offer in-depth personalization including geo-targeting for content (with additional value-adding features such as customer segmentation etc), so should be an easy addition with a bit of configuration. However, if these aren’t already being used, then they’re probably overkill and too big an investment to be considered for just solving this task.

Next, there are a small selection of Apps available on the Shopify App Store that contain this functionality. Geo-Targeting & Quick Announcement Bar are two of the better contenders here. The benefits to installing one of these is that little to no development would be required in order to achieve what you need. The compromise to these options though, are restrictions in how the messaging could be displayed on the frontend - e.g. you may be limited to only delivering this messaging as a popup or a notification bar at the top of the site. Another downside to consider, is that these apps will have a negative impact on performance that you won’t be able to do anything about.

If development resources are not a limiting factor, then I’d recommend not going for a standard Shopify App here. There are stand-alone 3rd party services such as ipstack or maxmind that can be used more effectively to efficiently lookup & store location data of a user based on IP address, which would have less of a performance impact and then offer a greater flexibility on the data you can use and how you can use it. For example, this data could include City / Postcode for localising within a country, or latitude & longitude for plotting into some map functionality. Displaying messaging within a quick cart or checkout is a good example of when complete freedom is required from a frontend point of view - and wouldn’t be achievable without some development effort.

Implementation using one of those third parties for lookup is a very robust and flexible solution, but does come with an ongoing monthly/annual cost for the service - which varies depending on the amount of traffic hitting the site. This could end up being a sticking point, or again may well be overkill for what is needed. If you don’t require that extra data, and only need to give messaging by country, there is a way to do almost the same thing natively within Shopify. 

As part of making steps to improve Internationalization, Shopify released their Geolocation App for merchants. This is essentially to use Geolocation to recommend the Language & Currency that should be rendered to a user. But with this came some API endpoints, which aren’t clearly documented, but can be utilised here. For example, here I’ve used the ‘browsing_context_suggestions.json’ endpoint - which returns the name of the country I’m browsing from. I can then pass this data into my theme, and use it to check if that country is where I want to target my messaging. If so, I see this:

But when I open TunnelBear and use it to set my browsing location to be USA, then I no longer see that messaging:

This can then be applied across the whole theme, to add that content into the cart or checkout - or to start displaying different content for different locations. While this demo took a total of ~10 lines of code, this can be extended further - and integrated into theme settings to make the messaging completely manageable through the Admin interface.    

These cover the different methods that can be used to achieve personalised content by geolocation. As always, there will be other apps & services available that offer similar functionality - and I’d be keen to add more good options to the list, so do let me know your experiences on this topic!