Shopify themes, liquid, logos, and UX
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)
Solved! Go to the solution
This is an 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
Hello @TEAMBGB
To remove the "Language" label from the Shopify DAWN theme header, you can follow these steps:
{% if settings.show_lang_picker %}
<div class="site-header__language site-header__icon--locale">
<span>{{ 'layout.header.language' | t }}</span>
{{ language_selector }}
</div>
{% endif %}
{% if settings.show_lang_picker %}
{{ language_selector }}
{% endif %}
.site-header__search {
order: 2;
}
.site-header__language {
order: 1;
}
This will move the "Languages" button to the left of the search icon.
I hope this helps!
Thanks, I tried and it was not working...
thanks anyway
Hi @TEAMBGB,
I am so glad that my solution can help.
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
This is an 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
Thanks a lot, exactly what i was looking for!
Hello @GemPages
I tried this and didn't work. Can you see mine please?
https://diversusoficialsite.myshopify.com/?_ab=0&_fd=0&_sc=1
Starting a B2B store is a big undertaking that requires careful planning and execution. W...
By JasonH Sep 23, 2024By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024