Move language selector in header menu

[lplabranche]

Hello there,

I would like to get a solution to move my language selector next to the searchbar icon in my website header
Please let me know if anyone as a solution regarding that issue. (Dawn Theme)

[BSS-TekLabs]

Hello @lplabranche 
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.

[lplabranche]

sure

www.inprintstore.com

thank you!

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @lplabranche 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.desktop-localization-wrapper {
    position: absolute !important;
    left: 200px !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[niraj_patel]

Hello @lplabranche 

would you like to share your store URL and password if any please.
so i can check and provide you possible solution for your question.

[lplabranche]

sure

www.inprintstore.com

thank you!

[niraj_patel]

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (min-width: 990px) {
  .header:not(.drawer-menu).page-width {
      position: relative;
   }
   .desktop-localization-wrapper{
       position: absolute;
       left: 8%;
   }
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[BSSCommerce-HDL]

Hi @lplabranche, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

<style>
.desktop-localization-wrapper {
    left: 20%;
    position: absolute !important;
}
</style>

Here is result:

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[sahil0701]

Hi,

I need urgent help adding a language selector to the mobile version of my website. While the language selector is already available on the desktop version, it only appears at the bottom of the side menu on mobile (see the attached photo). I would like it to be prominently displayed in the mobile header, positioned next to the hamburger menu (the three horizontal lines).

The language selector should have equal spacing, similar to how the search button and "Add to Cart" button are spaced from each other. It should be compact and display "EN" for the English version of the website and "SE" for the Swedish version.

I’ve tried adding code myself but haven’t been able to align the language selector with the hamburger menu. Currently, it looks like it does in the attached photo. As shown in photo 3, I’d like the "EN" selector to be neatly aligned next to the hamburger menu, creating a balanced and polished appearance. I’d greatly appreciate your assistance with this. Thank you in advance.

As seen in photo 3, I would like the same "EN" language selector, but placed in line with (next to) the hamburger menu. Please help urgenty. Thanks.