Shopify themes, liquid, logos, and UX
Right now on https://time-bikes-small-parts.myshopify.com/ we have the currency selector and it says:
Canada (CAD $)
Slovakia (EUR Є)
United Kingdom (GBP £)
United States (USD $)
Basically the client would like to remove all the countries so that it just says:
(CAD $)
(EUR Є)
(GBP £)
(USD $)
Reason being, while Slovakia is the country in their backend, it's not the one they necessarily want so they said if we could just remove them all that would be best.
Hi @chels_grove Thank you for your question.
In this case, If your theme settings has not any settings to hide it, I think you need to remove the code in your theme code.
Yes - that is what I am trying to figure out - where in my code I need to do that or what I need to add - thanks!
I'm also looking for an answer here. Any news on how to solve this?
Hi @chels_grove ,
Please share your store URL and if your store is password protected then please provide password too.
So that we can help you.
Thank you.
Hello there!
To remove the countries from the selector and the same types of currencies, do the following steps:
1º Open the code of your store.
2º Locate the file called: country-localization.liquid
3º Delete all the code. (Be sure to make a backup copy of the original file. To do this, for example, copy the code and paste it into a notepad.)
4º Replace the original code with the following code:
<div class="disclosure">
<button
type="button"
class="disclosure__button localization-form__select localization-selector link link--text caption-large"
aria-expanded="false"
aria-controls="{{ localPosition }}List"
aria-describedby="{{ localPosition }}Label"
>
<span>
{{- localization.country.currency.iso_code }}
{{ localization.country.currency.symbol -}}
</span>
{% render 'icon-caret' %}
</button>
<div class="disclosure__list-wrapper" hidden>
<ul id="{{ localPosition }}List" role="list" class="disclosure__list list-unstyled">
{%- assign selected_currencies = '' -%}
{%- for country in localization.available_countries -%}
{%- unless selected_currencies contains country.currency.iso_code -%}
{%- assign selected_currencies = selected_currencies | append: country.currency.iso_code | append: ',' -%}
<li class="disclosure__item" tabindex="-1">
<a
class="link link--text disclosure__link caption-large focus-inset{% if country.iso_code == localization.country.iso_code %} disclosure__link--active{% endif %}"
href="#"
{% if country.iso_code == localization.country.iso_code %}
aria-current="true"
{% endif %}
data-value="{{ country.iso_code }}"
>
<span class="localization-form__currency">
{{- country.currency.iso_code }}
{{ country.currency.symbol }}
</span>
</a>
</li>
{%- endunless -%}
{%- endfor -%}
</ul>
</div>
</div>
<input type="hidden" name="country_code" value="{{ localization.country.iso_code }}">
This should fix your problem!
Hello,
I can't find country-localization.liquid in my code. I have two shops and it worked perfectly with the other one, so I know it works! Thank you for that.
I am trying to get rid of the country codes in this store and keep the currency:
maotajp.com
I would appreciate your help!
Thanks.
To remove the country name and duplicate currency symbols, you'll need to add the above code to your .liquid file, country-localization.liquid. This file is named as such in the default DAWN theme; if you can't find it in your code, it's because you're using a different theme. Just try to locate the file in your code that refers to the currency selector and paste the above code.
I have this result in my store, and it works perfectly:
Happy New Year!
Thank you for your reply. The only file I can find is called currency-picker, but upon pasting the code it doesn't work. I'm using the shopify Geolocation app, if that matters. Thank you!
Hi there!
I apologise for jumping into this thread, but this was exactly what I was looking for, and your solution was quite useful for me, , thank you so much!
I would need to to tweek a bit the CSS though, but I have no idea exactly "where". I think the currencies in the dropdown are white by default, and as the background is white, they are not visible... they are only visible on on mouse over:
Do you know where in CSS would I be able to change their default color? (to 666 gray for example)
...and while we're at it... could I chance the currency alignment in the dropdown to the right?...
I deeply appreciate your help!!
Thank you,
Ana
Hey Community! As we jump into 2025, we want to give a big shout-out to all of you wh...
By JasonH Jan 7, 2025Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024