WordPress’ rich text editor (RTE) is good user interface.  Good UI is easy to understand and explains itself.  That does not mean that there aren’t some things you should be told about it.

Ideally and for a number of reasons, all writing for your site would be done from within WordPress using its RTE.  What you are composing is HTML and word processing programs produce something…well, different…especially Microsoft Word.  I used to say that if you must use Word you must use the paste from Word function, but that was recently removed from the RTE in favor of automated scrubbing — it’s not perfect, but at least now it’s automatic.  I would still recommend fully escaping any formatting you paste in, so if you don’t absolutely need formatting to carry over, either use the Paste As Text toggle in the second row of the RTE (more on that later) or use Shift+Ctrl+V to paste your content as plain text and then format it.

The WordPress editor automatically manages paragraph tags, so the <p>’s and </p>’s in effect on the front side of the site are not stored in the database or visible in the Text view from the admin.  These generated paragraph tags are started and/or ended with each strike of the Enter key.  To effect a single line break, hold down the Shift key before striking Enter. Note: there are very few legitimate uses for single line breaks in web content, so use this knowledge carefully.

The first several buttons in the RTE’s controls should be somewhat familiar – Bold, Italic, Strikethrough, Bulleted (unordered) List, Numbered (ordered) List, Blockquote, Horizontal Rule, Left Align, Center Align and Right Align.  The next button, Insert/Edit Link, is only available when a string of text is selected and when you click it, you’ll get a modal (popup) dialog with a number of fields.  The URL is of course the address of the page you wish to link to and the Title is the text that will be displayed when the user hovers over that link — this is not just good for your readers; search engines take note of this content as well. To remove a given link, select the text that is currently linked and click the next button in the RTE’s controls, Remove Link.

The button after that one inserts a More tag (<!–more–>), which is visually represented by a dashed line.  The result of using this depends on your theme, but the idea is that it give you control where your posts are truncated in summary view, as opposed to displaying the entire post, letting it be truncated automatically or using the Excerpt field.  You can customize the text of the link that users see by adding a space and your content, e.g. <!–more Click me now!–>.

The last button in the left-aligned portion of that first row is the Kitchen Sink or Toolbar Toggle and clicking it opens another row of controls.  The first in that second row is the Format select, which provides for non-paragraph formatting like Preformatted (i.e. code) and headings (levels 1 through 6).  Think of your post’s content as a stand-alone document — the first heading should be a 1, any siblings should also be 1’s, children should be 2’s, their children should be 3’s, etc.  This is not a design choice — you’re writing content and design is for your blog’s theme.

The controls that follow are Underline, Justify, Text Color, Paste As Text (previously mentioned), Clear Formatting (of selected text) and Special Character (which give you access to smart quotes/apostrophes, ampersands and the like), Indent, Outdent, Undo, Redo and Keyboard Shortcuts, which documents key commands in a modal dialog.  Floating to the right of the first row of controls is Distraction Free Writing, which puts the editor in full-screen mode, where there are fewer controls but less clutter.  Above that is the toggle for Text view, where you can see what using these controls produces in terms of code and employ a simpler set of controls.

Technically outside the RTE, just above the controls, is the Add Media button, which when clicked opens a modal dialog for inserting images, audio or video wherever the cursor is positioned.  In that dialog for the selected image you will be presented with fields for Title (like the aforementioned title for links for when the image is linked), Caption, Alt Text, Description, Alignment, Link To and Size.  Always try to include alternate text for images because in the event the image fails to load this description will display, search engines will note the copy for this attribute’s value and anyone visiting the site using a screen reader will be read this text to describe the image.  You can always return to edit the attributes of a given image in your content at any time by clicking on the image and then on the Edit button that appears over it.

I hope that you’ve found this introduction to WordPress’ Visual view’s rich text editor useful.  If you have any questions, comments or suggestions for a followup post on the other features of the Post/Page content editor, please leave a reply below.  In the meantime, happy publishing!