Sometimes you need to add HTML code to an existing block. In that case, instead of creating a new block, you can convert a block that’s already present into HTML just by Edit HTML in WordPress editor.

So let’s see the step, “How to edit HTML in WordPress Code”.

There are three ways to edit HTML in Gutenberg:

  1. Create A New HTML Block
  2. Convert Existing Block To HTML 
  3. Convert Entire Page To HTML

1. Create New HTML Block (Using Custom HTML)

Here, you’ll create a new block on your page and then insert the HTML code.

Step 1: Log into your WordPress Dashboard and navigate to the post you want to modify. 

Step 2: Click on the + symbol to create a new block at the place where you want to insert the block of HTML.

How to Edit HTML in WordPress Editor 1

Step 3: Search for ‘Custom HTML’ and select it. 

How to Edit HTML in WordPress Editor 2

Step 4: After selecting Custom HTML a block will appear where you can write your HTML code.

How to Edit HTML in WordPress Editor 3

Once done with your code, you can preview it for checking the output of your code. Also, you can save it as a draft or publish it to see the changes on your site.

2. Convert Existing Block To HTML (Using Edit As HTML)

Now let’s see how we can edit the existing blocks Instead of creating a new block.

Step 1: Log into your WordPress dashboard and navigate to the post you want to modify. 

Step 2: Select the block you want to edit. Click on the three dots at the right-hand side of the pop-up that appeared.

How to Edit HTML in WordPress Editor 4

Step 3: Select ‘Edit as HTML’ and your selected block will be converted into HTML block.

How to Edit HTML in WordPress Editor 5

Step 4:Here you can write down your HTML code.

How to Edit HTML in WordPress Editor 6

 

3. Convert Entire Page Or Post To HTML (Using Code Editor)

Step 1: Login into your WordPress Dashboard and navigate to the post you want to modify. 

Step 2: On the top-right corner, select the three dots which gives you More Tools & Options.

How to Edit HTML in WordPress Editor 7

Step 3: Select ‘Code Editor’ or press Ctrl+Shift+Alt+M and you’ll see that your entire post is now converted to HTML. 

How to Edit HTML in WordPress Editor 8
Leave A Comment