Getting started with the Region, Currency and Language selector •

The region, currency, and language selector in the app is fully customizable.

How to Activate the Selector

Go to the Selector page and enable the selector.
Choose a selector type from the list of options and then click Save near the bottom of the page.
Our app's selector should now be visible on your website.

Note:

If the selector doesn't appear after enabling it, please refer to this guide and enable the app extension.

To further customize the selector, please continue reading below.

Selector Type Configuration

Our app offers a variety of Selector types that you can choose from namely:

Region & Language Selector
Region Selector
Language Selector
Currency & Language Selector
Currency Selector

You can select the option that best fits your configuration. In the example below, I’m using a "Region & Language Selector" because I have multiple languages and regions/currencies set up in my Shopify markets settings.

You can customize the selector's style by choosing from a dropdown with a vertical layout, a dropdown with a horizontal layout, or an overlay.

Preview of Dropdown selector (Horizontal layout)

Preview of Dropdown selector (Vertical layout)

Preview of Overlay layout Selector

Selector Label and Format

There are also several visual customization options, including:

Re-ordering the displayed regions, currencies, and languages
Displaying regions by name or code
Displaying currencies by name, code, or symbol
Displaying languages by name or code
Including or excluding flags

Selector Position Configuration

You can choose from four different selector positions:

Float and always seen - When the floating option is selected, you can adjust its position and modify the padding. Increasing the padding moves it farther from the edge of the screen, while decreasing it brings it closer.
Integrate Selector with AI - With this option, the AI will analyze your live theme and place the selector automatically. On desktop, it will appear in the header, and on mobile, it will appear in the menu drawer, based on the best-fit placement. If the position isn’t ideal, please contact us at help@hextom.com for assistance.
Shopify App Block – This option allows you to place the selector anywhere in your store using Shopify’s app block system. Please follow the guide to add the selector.
Manual Theme Integration - This option lets you select your theme for the selector integration, and this supports over 300 themes right out of the box.

Selector Style

In the Style settings, you can customize the font color, background color, and background opacity of the selector to match your store’s design. Additionally, the Custom CSS field allows you to adjust the selector’s position and appearance with CSS. Two example buttons are provided to quickly insert sample CSS, which you can further customize as needed.

Selector Redirection Configuration

The selector can also control the default region, currency, and language that customers see when they first visit your store. For paid plans, we offer the option to automatically detect the customer's browser language and their region to assign the appropriate language and currency. Alternatively, you can choose to display a specific language or currency when they visit.

The selector can also enable a Right-To-Left (RTL) layout. When a language that uses RTL is selected, the theme will adjust to display the store accordingly. However, it's the theme's responsibility to properly display all store elements in RTL mode, so please ensure your theme is RTL compatible before enabling this option.

If you have any questions or concerns about the Selector, or anything else, please send us a message at help@hextom.com