Insert emoji into WordPress Gutenberg Block without a plugin

With so many emoji-inserting Wordpress plugins available, you'd think that's the way to go, right? Well, what if you've already got a zillion plugins clogging up your request pipeline and you don't want one, single plugin more? Let me help you insert emojis sans-plugin.

There’s a hard way and an easy way to do this. If you’re using Windows 10, it’s dead-simple.

Easy Way

Start typing in a paragraph block, then just Right-Click > Emoji or press Win + period

Win 10 Emoji sample

This technique actually works throughout many areas of Windows 10 that allow text input.

Slightly Less Easy Way

If you’re not on Windows 10 or like a challenge, you can manually insert the html entity corresponding to the emoji you need. I use w3schools for reference.

  1. Grab the Decimal code for your emoji from w3schools.
  2. Format the code like so: ampersand + pound + the decimal code + semi-colon. For example, alarm clock would be ⏰
  3. Click the more options menu button on your paragraph block and select Edit as Html.
  4. Paste the emoji code you just formatted into your html source view, then click the options menu again and select Edit Visually to switch back.

All done. Go emoji crazy 😜👍

Related Posts