A user wants to display country flag emojis in their Shopify announcement bar, but flags only render correctly on mobile devices—appearing as letter codes on Windows 10 Chrome instead.
Attempted Solutions:
Root Cause & Recommendations:
The problem stems from inconsistent emoji/unicode support across platforms and browsers. One contributor explains that text-based flag emojis won’t work reliably everywhere.
Proposed Alternatives:
One response suggests enabling “Social Media Icons” in the announcement bar settings, though this appears tangential to the core flag display issue. The discussion remains open with no confirmed working solution for emoji-based flags on desktop browsers.
Hi
I want to add a country flag to my announcement bar in Shopify. When I copy them from an emoji page like: https://getemoji.com/ and paste them into shopify they appear on my Windows 10 Chrome Browser like this:
And only on my mobile phone they appear as flags.
Can somebody help me?
@taminohaas you can take code from over here for the country flag code :
https://www.alt-codes.net/flags
Hi, its not working, still have the same issue.
@taminohaas Can you share your store url ? cause in mine store it’s working . Are you sure you’re putting code into html ?
You can try in below way if above one not working :
https://prinsfrank.nl/2021/01/25/Non-existing-flag-emojis-on-windows
Still just the letters appear no country flag. My Store is Password protectet.
any solution to this?
@CuteBlastSAMO if direct characters/text/unicode doesn’t work then you need to use actual images/svgs as encoding like that just wont work for everyone/everywhere.
Which means a theme customization to add that code.
Either using the localization>country objects Liquid objects: country
Or directly adding the media,
Public domain flag images/svgs are available at GitHub - emcrisostomo/flags: Public domains world flag images.
For services to get this done properly click my profile pic for direct options.
Or PM me, or request here that I PM you.
Hi @taminohaas,
You can have a try of below ways and see if it works on your theme:
Click Theme under Online Store from Shopify admin page.
Click Customize button in Online Store.
Find Announcement or Announcement Bar option in Customization page.
Click Announcement/Annoucement Bar option and enable the option of Social Media Icons inside.
Click Save button to save your changes.
