Hidden Wealth in the Rich Text Editor

Posted on by Alan Levine

The Trick, Said Quick

Whether you favor WordPress editing Classic or Gutenberg, I have a few gold nuggets that are not obvious from the visual a.k.a rich text editor.

The Trick, In Intricate

Before WordPress 5 and the Gutenburg flavored editor, I lived in the WordPress Text editor– I love seeing raw HTML. Those days are gone; even with the Classic Block, I cannot get to the Text Editor.

One thing I never found in the visual editor, pre or post Gutenberg editor, was the thing that gives me formatting for code, which I like to do in text when describing things to do in an interface.  Where is the code button that was in the old Text editor? With some googling, I found a secret trick that works in either the visual editor, pre or post Gutenberg.

It’s right out of Markdown… which makes people more freaked out than saying HTML. But if I want to emphasize a bit of text in code formatting, I just type a back tick before the text and another one after.

In the Classic editor, you can find a range of keyboard shortcuts for formatting from the question mark icon (hopefully you know about the “kitchen sink” reveal button— the second row of editor buttons that appear when you click the last icon on the right).

There actually are more conventions from Markdown that work in the rich text editor(s)- these are listed in the keyboard shortcuts window:

This more or less means you can use Markdown in the WordPress editor. I was actually unaware of all of these! The same command opens the shortcuts (command-option-h) in the Gutenberg Editor (it’s also available from the three dot menu in the far right top corner); There are more shortcuts related to blocks, and it does not display the Markdown ones, though they still work.

Gutenberg keyboard shortcut list

 

Do you know about drag and drop images? You can upload directly to WordPress by dragging an image file from your computer directly into the editing area (classic) or between blocks (Gutenberg). Just give it a try!

One thing that is very sweet in the Gutenberg Editor that you can copy HTML from some other source, paste it into the paragraph block, and it renders properly, fully formatted (in the classic editor you just get code). This is really useful, as I can copy the HTML created with my flickr cc attribution helper tool, paste it directly into a paragraph block, and get the fully formatted content.

Let’s say I want to use it on an image of a Scary Black Pigeon. I get this blog of HTML generated:

Almost by accident I saw what happened- I pasted the raw HTML into a new block… and I get this automatically:

The Scary Black Chicken

The Scary Black Chicken flickr photo by cogdogblog shared under a Creative Commons (BY) license

Unlike most WordPress users, I have taken somewhat of a liking to the new editor, or at least less of a cussing relationship; see my post about blogging on a Gutenberger diet.

See also WP Beginner’s Time Saving WordPress shortcuts.

The Trick, Give it a Kick

Tweet back a reply with a rich text editor tip you tried and/or know about.

Featured dog trick image by Yama Zsuzsanna Márkus from Pixabay