How can I move the currency and language selector to the header?
Hi,
We would like to move de currency and language selector to the header. How to do please.
The best setup could be like this. And also get this in the hamburger menu for mobile.
or in the upperbar
This is the site: www.modelbouwmati.com.
thank you very much
@ModelbouwMati add below code in header.liquid file before </nav>
<div class="footer__column footer__localization isolate"><noscript><form method="post" action="/en/localization" id="FooterCountryFormNoScript" accept-charset="UTF-8" class="localization-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="localization" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="return_to" value="/en" /><div class="localization-form__select">
<h2 class="visually-hidden" id="FooterCountryLabelNoScript">Country/region</h2>
<select class="localization-selector link" name="country_code" aria-labelledby="FooterCountryLabelNoScript"><option value="AT">
Austria (EUR €)
</option><option value="BE" selected>
Belgium (EUR €)
</option><option value="CA">
Canada (CAD $)
</option><option value="CZ">
Czechia (CZK Kč)
</option><option value="DK">
Denmark (DKK kr.)
</option><option value="FI">
Finland (EUR €)
</option><option value="FR">
France (EUR €)
</option><option value="DE">
Germany (EUR €)
</option><option value="GR">
Greece (EUR €)
</option><option value="HU">
Hungary (HUF Ft)
</option><option value="IE">
Ireland (EUR €)
</option><option value="IT">
Italy (EUR €)
</option><option value="LU">
Luxembourg (EUR €)
</option><option value="NL">
Netherlands (EUR €)
</option><option value="NO">
Norway (EUR €)
</option><option value="PL">
Poland (PLN zł)
</option><option value="PT">
Portugal (EUR €)
</option><option value="ES">
Spain (EUR €)
</option><option value="SE">
Sweden (SEK kr)
</option><option value="CH">
Switzerland (CHF CHF)
</option><option value="US">
United States (USD $)
</option></select>
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-caret" viewBox="0 0 10 6">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill="currentColor">
</svg>
</div>
<button class="button button--tertiary">Update country/region</button></form></noscript>
<localization-form><form method="post" action="/en/localization" id="FooterCountryForm" accept-charset="UTF-8" class="localization-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="localization"><input type="hidden" name="utf8" value="✓"><input type="hidden" name="_method" value="put"><input type="hidden" name="return_to" value="/en"><div class="no-js-hidden">
<h2 class="caption-large text-body" id="FooterCountryLabel">Country/region</h2>
<div class="disclosure">
<button type="button" class="disclosure__button localization-form__select localization-selector link link--text caption-large" aria-expanded="false" aria-controls="FooterCountryList" aria-describedby="FooterCountryLabel">
Belgium (EUR €)
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-caret" viewBox="0 0 10 6">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill="currentColor">
</path></svg>
</button>
<div class="disclosure__list-wrapper" hidden="">
<ul id="FooterCountryList" role="list" class="disclosure__list list-unstyled"><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="AT">
Austria <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large disclosure__link--active focus-inset" href="#" aria-current="true" data-value="BE">
Belgium <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="CA">
Canada <span class="localization-form__currency">(CAD $)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="CZ">
Czechia <span class="localization-form__currency">(CZK Kč)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="DK">
Denmark <span class="localization-form__currency">(DKK kr.)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="FI">
Finland <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="FR">
France <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="DE">
Germany <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="GR">
Greece <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="HU">
Hungary <span class="localization-form__currency">(HUF Ft)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="IE">
Ireland <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="IT">
Italy <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="LU">
Luxembourg <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="NL">
Netherlands <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="NO">
Norway <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="PL">
Poland <span class="localization-form__currency">(PLN zł)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="PT">
Portugal <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="ES">
Spain <span class="localization-form__currency">(EUR €)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="SE">
Sweden <span class="localization-form__currency">(SEK kr)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="CH">
Switzerland <span class="localization-form__currency">(CHF CHF)</span>
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" data-value="US">
United States <span class="localization-form__currency">(USD $)</span>
</a>
</li></ul>
</div>
</div>
<input type="hidden" name="country_code" value="BE">
</div></form></localization-form><noscript><form method="post" action="/en/localization" id="FooterLanguageFormNoScript" accept-charset="UTF-8" class="localization-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="localization" /><input type="hidden" name="utf8" value="✓" /><input type="hidden" name="_method" value="put" /><input type="hidden" name="return_to" value="/en" /><div class="localization-form__select">
<h2 class="visually-hidden" id="FooterLanguageLabelNoScript">Language</h2>
<select class="localization-selector link" name="locale_code" aria-labelledby="FooterLanguageLabelNoScript"><option value="nl" lang="nl">
Nederlands
</option><option value="en" lang="en" selected>
English
</option><option value="fr" lang="fr">
Français
</option></select>
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-caret" viewBox="0 0 10 6">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill="currentColor">
</svg>
</div>
<button class="button button--tertiary">Update language</button></form></noscript>
<localization-form><form method="post" action="/en/localization" id="FooterLanguageForm" accept-charset="UTF-8" class="localization-form" enctype="multipart/form-data"><input type="hidden" name="form_type" value="localization"><input type="hidden" name="utf8" value="✓"><input type="hidden" name="_method" value="put"><input type="hidden" name="return_to" value="/en"><div class="no-js-hidden">
<h2 class="caption-large text-body" id="FooterLanguageLabel">Language</h2>
<div class="disclosure">
<button type="button" class="disclosure__button localization-form__select localization-selector link link--text caption-large" aria-expanded="false" aria-controls="FooterLanguageList" aria-describedby="FooterLanguageLabel">
English
<svg aria-hidden="true" focusable="false" role="presentation" class="icon icon-caret" viewBox="0 0 10 6">
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.354.646a.5.5 0 00-.708 0L5 4.293 1.354.646a.5.5 0 00-.708.708l4 4a.5.5 0 00.708 0l4-4a.5.5 0 000-.708z" fill="currentColor">
</path></svg>
</button>
<div class="disclosure__list-wrapper" hidden="">
<ul id="FooterLanguageList" role="list" class="disclosure__list list-unstyled"><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" hreflang="nl" lang="nl" data-value="nl">
Nederlands
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large disclosure__link--active focus-inset" href="#" hreflang="en" lang="en" aria-current="true" data-value="en">
English
</a>
</li><li class="disclosure__item" tabindex="-1">
<a class="link link--text disclosure__link caption-large focus-inset" href="#" hreflang="fr" lang="fr" data-value="fr">
Français
</a>
</li></ul>
</div>
</div>
<input type="hidden" name="locale_code" value="en">
</div></form></localization-form></div>
Community Blog Articles
Dropshipping Viral Products to Sell in 2025
As 2024 wraps up, the dropshipping landscape is already shifting towards 2025's trends....
By JasonH Nov 27, 2024
Shining a spotlight on our top members of October 2024!
Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024
Tips for Running BFCM Deals and Discounts 2024
In today’s interview, we sat down with @BSS-Commerce to discuss practical strategies f...
By JasonH Nov 13, 2024