How to Switch to the Code Editor in WordPress

The Gutenberg editor introduced in WordPress 5.0 made it much easier to add elements to your posts. Whether you want to embed a YouTube video, a form, a table, or one of many other types of content, there is probably a block that you can add to do so easily.

But occasionally you may actually need to add some HTML code to one of your posts, and you might find that it’s difficult to do what you are trying to accomplish. Fortunately there is a Code Editor in Gutenberg that you can enable which allows you to type HTML directly into your post.

How to Enable the Code Editor in Gutenberg for WordPress

The steps in this article were performed on a site using WordPress 5.2.1. This guide assumes that you are using the Gutenberg editor on your site.

Step 1: Sign into the admin section of your site at (yourdomain.com)/wp-admin.

Step 2: Hover over the Posts tab and either create a new post or open an existing one.

Step 3: Click the Show more tools & options button (the one with three vertical dots) above the column at the right side of the window.

Step 4: Select the Code Editor option from the menu.

Note that you can also use the keyboard shortcut Ctrl + Shift + Alt + M to toggle the Code Editor on and off.

Do you need to link to a specific spot in one of your posts? Find out how to easily create and use HTML anchors with the Gutenberg WordPress editor.