This guide will show you how to add special characters into your WordPress posts and pages from the Guttenberg text editor. Accessing the special character library uses a different approach to the older classic editor, hence this tutorial.
Why Use Special Characters in English Text?
WordPress editors support special characters. They are the non-alphabetic and numeric typescripts missing from regular keyboards. There are times when a writer needs a unique character or symbol to represent the website content accurately. Mathematical equations, currency symbols, non-English words and names, and trademarks are some examples.
Adding Special Characters in WordPress
Accessing special characters for a post or page was simple in the old classic editor. It’s not hard in Guttenberg, but there are a few more clicks to bring up the character library.
There are three approaches for adding special characters in WordPress:
- HTML entity code (no need to install and activate a special characters plugin)
- Access the special characters library from Gutenberg blocks
- Using a special characters plugin
You’d use the first option only if you insert special characters on rare occasions.
#1 insert special characters using HTML entity code
WordPress uses the HTML markup language to display special characters and symbols correctly. We call these HTML Entity Codes. It’s a simple way to get special characters into your content that are not available from a regular keyboard. HTML entities are simple pieces of text called a string. They start with the ampersand (&) symbol and end with a semicolon (;).
Here are four examples of frequently used HTML entity code.
- ®
- ©
- ¥
- ¢
Copy the examples above to your clipboard.
Log in to your WP Admin Area.
Go to Posts => Add New from the Dashboard side menu.
Click the 3-dots icon in the WP Post Editor (top right) to open the view tab.
Select Code Editor under the Editor section.
The code editor opens on the left of your screen.
Paste the copied HTML entity code samples above anywhere into the editor.
The HTML entity code converts to the relevant characters when you click outside the block or return to the Visual Editor. Our samples include a registered trademark symbol, a copyright symbol, and two currency symbols, but there are hundreds of others.
Bookmark the W3.org HTML Entity Character Reference Chart if you find this approach helpful. It lists all the special characters and symbols you could ever want.
The next option is ideal if you only need the most commonly used characters & symbols.
#2 Accessing Special Characters from Gutenberg
There have been lots of complaints about Gutenberg not having special character access. It was a simple case of clicking a button using the older Classic Editor. Well, that mode is back and working, albeit in three clicks instead of one.
Here’s how you access it.
- In the Gutenberg Editor, click the Add Block (+) symbol
- Type classic into the add new block search box
- Click the classic block to open the old toolbar
The old classic toolbar comes into view.
Click the Special Character symbol.
The special character options open in a pop-up window.
The Special Character list closes after you select a single character. If you need more, click the Special Character symbol again to bring up this list.
You can convert the classic block back to the Gutenberg block editor if you no longer need the classic toolbar.
Click the Convert to blocks link above the classic toolbar.
The Gutenberg toolbar now replaces the classic toolbar.
Continue to create or edit your post as usual.
Select the Paragraph block from the block pop-up window.
Tip: If you don’t see the block, type the word paragraph into the search box.
Tip: Consider creating a custom block if you use special characters often. You read more about how to create reusable blocks in WordPress here.
#3 Add Special Characters Using a Plugin
You don’t need a WordPress plugin if Gutenberg’s new classic block has all the special characters you want. But this plugin is perfect if you need access to a more extensive collection. The tutorial illustrates using the post edit screen, but it works the same way in the page editor.
Point to note: The developer hasn’t updated the Special Characters plugin for a while, probably because of the new classic block. But it’s a simple program that seems to work well nonetheless.
Please read my plugins guide first if you’re a WordPress raw beginner.
Install and Activate the Insert Special Characters plugin by 10up.
Go to Posts => All Posts from the Dashboard side menu.
Open any WP post by clicking its Edit link.
Clicking into a text block or writing new content brings the Gutenberg toolbar into view.
Click the More rich text controls down-arrow to display the options.
Click the Special Characters link in the controls list.
The scrollable special characters box appears with its plethora of options. Notice the four tabs along the top toolbar, Misc., Math, Latin, and Arrows.
Click on any special character to add it to your post or page content. The list closes after selecting a single character, so you must recall it if you want to add others.
That’s it, the three ways to get special characters in WordPress posts and pages.