Here, we will go over how to inject a Region Selector into your Shopify shop! With a region selector, your visitors will be able to select which region they are able to view. However, it requires some configuration, and we will help with that below!
To input a region selector, first you want to select the General tab on the left. From here, click on Operation Mode and scroll all the way down. All the options under Selector Configuration will be the ones we focus on here!
Display Type:
There's 3 available display options for you to select for your store. You can decide which would fit your theme best, and directly below that, you can see a preview of the render that will display for you. At the very top of this box, you'll see Dropdown, Unordered List, and Div. Each of these 3 are customizable further - pick the one that best suits your store! For Div, this selection will allow you customize the CSS of the selector further. If you just want our basic region selector, then proceed below!
The other 2 styles of the region selector can be viewed below:
Dropdown allows for a simple dropdown block for the selector, while the unordered list has a more sleek and modern take on this.
Positioning:
Once you've selected a display type, you can start integrating it into your theme. Here, you can place this region selector into any block on your site. First, you'll need to find out the CSS selector of the block you want to add. To add that, you can click here for a guide on how to find it!
At the bottom of the region selector options, you will find a position selector. You can place it at the beginning of the element, or the end of the element. You can also replace the element, but this is unadvised unless you know exactly what block you're looking to replace. If you were to replace the element contents that are in the video example below, all the menu items would be replaced with just the menu selector. Watch the following video to find how to apply the correct CSS selector to your region selector:
Custom Options:
From here, you can further customize how you would like it to appear. In between the display type and the positioning, you'll see options to show flags, show full country names, and show countries. The bottom two options could be used together, so it shows flags and full country names, leave that unselected for just the abbreviations. If you decide not to click the Show Countries option, it will show only top level regions instead (NA, SA, EU). It has a lot of customization, so do whatever would fit best for your store!
Still need help? Please do not hesitate to click the "Support" button at the top of the app interface.