2019-02-17
Emoji Error in Chrome Extension HTML
html, unicode, emoji
title: Emoji Error in Chrome Extension HTML date: '2019-02-17' banner: ./images/featured-image-5.jpg published_at: '2019-02-17T06:08:13.000Z' tags: 'html, unicode, emoji' author: Sung M. Kim
_Photo by Bernard Hermant on _Unsplash
I've had a problem where I was trying to display an Emoji in a Chrome Extension header of default popup HTML, page_action.html (specified by page_action -> default_popup in manifest.json).
But got the jumbled up characters instead.
Emoji displayed as gobbledygook
The problem was that I had to instruct Chrome that I am using a unicode by adding a charset meta tag.
| <html> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| ... | |
| </head> | |
| ... | |
| </html> |
Character Set set to UTF-8
This has fixed the issue and shows the cute 🐥 emoji correctly in the Chrome Extension popup.
You can now see the cute baby chick 🐥