How to add the the Langify Language Switcher in Dawn

1. Hide the Theme language switchers

First you have to hide your Theme language switchers which show up in the header as well as the footer:

To do so you can add the following CSS code to the "Custom CSS" section inside your Theme Settings in Shopify:

.desktop-localization-wrapper,
.footer__localization {
  display: none !important;
}

2. Place the Langify language switcher

Now you just need to get the Langify language switcher code in

Langify > Dashboard > Switcher Configurator

Select the "Placement" category on the left and set the "Position" value to "Custom" to see Langify's language switcher code:

Note that you have two separate language switchers by default:

A tablet/desktop language switcher that has an initial breakpoint of 1000px:

And next to it you have a mobile language switcher:

For the Dawn Theme, you need only the mobile language switcher so you can delete the desktop language switcher by clicking on the "x" icon here:

Now copy the mobile language switcher code either here of from inside Langify which is

<span class="ly-custom-0"></span>

and go to

Shopify > Themes > [three-dot icon next to "Customize"] > Edit code

Now search for the header.liquid file and open it:

Search for the line containing "header__icons" and paste the mobile language switcher code below this line as shown here:

After saving it you should see the language switcher perfectly placed next to your other header icons:

Desktop view:

Mobile view:

Any questions or feedback: michael@michaelivanov.dev