Remove "Language" label from DAWN theme header

[TEAMBGB]

Good evening everyone,

I managed to duplicate the "Languages" button from the footer to the header.

However, I'd like to move it to the left of the 'search' icon and remove the 'languages' heading.

Can anyone tell me how to do this?

Thanks

site: www.bgbteam.shop (password: Apriliasxv550. with an ending dot) 

[Mubashir_H]

Hello @TEAMBGB 

To remove the "Language" label from the Shopify DAWN theme header, you can follow these steps:

• Go to your Shopify Admin panel and click on "Online Store" from the left-hand menu.
• Click on "Themes" and then click on "Actions" > "Edit code" next to the DAWN theme.
• From the left-hand menu, click on "Sections" and then click on "header.liquid" to open the file.
• Locate the following code:

{% if settings.show_lang_picker %}
<div class="site-header__language site-header__icon--locale">
<span>{{ 'layout.header.language' | t }}</span>
{{ language_selector }}
</div>
{% endif %}

• Replace the code with the following:

{% if settings.show_lang_picker %}
{{ language_selector }}
{% endif %}

• Save the file and preview your store to ensure that the "Language" label has been removed from the header.
• To move the "Languages" button to the left of the search icon, you will need to adjust the CSS styling for the header. You can do this by adding the following code to the "theme.scss.liquid" file:

.site-header__search {
order: 2;
}

.site-header__language {
order: 1;
}

This will move the "Languages" button to the left of the search icon.

• Save the file and preview your store to ensure that the "Languages" button has been moved to the left of the search icon and the "Language" label has been removed.

I hope this helps!

[TEAMBGB]

Thanks, I tried and it was not working...

thanks anyway

[GemPages]

Hi @TEAMBGB,

I am so glad that my solution can help.  

[PageFly-Victor]

Hi @TEAMBGB ,

This is Victor from PageFly - Landing page builder, I’d like to suggest this idea:

Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :

<style>
.header__search > localization-form > form> .no-js-hidden > h2#FooterLanguageLabel {
    display: none;
}
details-modal.header__search {flex-direction: row-reverse;}
@media (min-width:767px){
form#FooterLanguageForm {
    top: -22%;
    position: relative;
}
}
</style>

Hope my answer will help you.

Best regards,

Victor | PageFly

[GemPages · Accepted solution]

Hello @TEAMBGB ,

You can follow these steps: 
1. Go to Online Store->Theme->Edit code

2. Open your theme.liquid file, paste the below code before </body>

<style>
    .header__search localization-form h2.caption-large {
        display: none;
    }
    .header__search localization-form > form {
        padding: 0px !important;
    }
    .header__search localization-form > form .disclosure__button {
        margin: 0px !important;
    }
    .header__search {
        flex-direction: row-reverse;
    }
</style>

I hope the above is useful to you.

Kind & Best regards, 
GemPages Support Team

[TEAMBGB]

Thanks a lot, exactly what i was looking for!