Shopify - Design - How can I change the Weglot button position?

In this 6 steps guide, you will see how to move the Weglot button into your Shopify website.

1. Choose the location

Go to your website, right click where you want to put the Weglot button and click on "Inspect Element". You should see this:

2. Identify the class of the block

a. On the desktop version

b. On the mobile version

You can do it by pressing F12 or Inspect Element and click on the phone icon.

3. Browse your website's source code

Go in the Shopify Dashboard > Online theme > Actions > Edit HTML/CSS > theme.liquid (or Sections > header.liquid) and find the block that have the right class name.

4. Add our short code

a. Desktop version

Paste <div class="weglot_here"></div> 

    b. Mobile version

Paste <div id="weglot_here"></div> 

5. Click on "Save" and refresh the website 

6. Fine-tune the location of the Weglot button

You can adjust it with some CSS rules. You can use media queries for the mobile version.

Still need help? Contact Us Contact Us