Have you ever gone to use an emoji in your HTML and been faced with the dreaded “?” symbol?
When trying to find an answer to this question on google, I was faced with a barrage of different information on how to insert emojis in a variety of different ways, when all I wanted was one simple answer.
Thats what this article is for — a quick and easy explanation that even the most tech phobic person could follow.
Step 1. Make sure you put this code inside the head of your HTML document (if you haven’t already). You need to do this in order for your emojis to display consistently across various browsers.
<meta charset=“UTF-8”>
Step 2. Find the unicode for the emoji you want to use, I find this website is a great resource to use. If i want to use the emoji below, I would use the unicode u+1F60A .
Step 3. remove the u+ and replace it with &#x then add a ; at the end. Your final code for this emoji should look like this (its in the <p> tag below)…
and the end result in your browser …..
To change your emoji — simply change the uni code number.
Happy coding!
