How to change switcher position? I am not happy with the current position

Modified on Wed, 4 Dec, 2024 at 4:50 AM

By default, Transtore automatically embeds the switcher into your store once the app is installed. However, for certain themes or custom design preferences, you may need to manually adjust the switcher’s placement. This guide will walk you through the steps of embedding the switcher manually in the header of your theme. If you're not comfortable with editing code, our support team is always ready to help.

Step 1: Access your Theme code

From your Shopify admin, go to Sales Channels -> Online Store -> Themes.
Select the theme you want to edit, click the three dots (⋮) -> Edit Code.

Step 2: Adding the Switcher code (Desktop and Mobile)

You need to insert different code snippets for the desktop and mobile versions of your store. Here are the steps:

Desktop Version: Insert the following code where you want the switcher to appear on the desktop:
```
<div id="ts-switcher-manual-desktop"></div>
```
Mobile Version: Insert the following code for mobile displays:
```
<div id="ts-switcher-manual-mobile"></div>
```

Step 3: Locating the Header file

Most users prefer the switcher to be in the header. To embed the switcher there:

In the theme code editor, use the search box to find the header file.
Insert the desktop and mobile switcher code snippets in the appropriate location within this file.

In case you want to put switcher in the footer, please look for footer.liquid file.

If you're unsure where to place the code or need guidance, feel free to contact our support team at support@transtore.app for further assistance.