Writing A WordPress Post with the Visual Editor

Word Press uses an open-source visual HTML editor called TinyMCE. The Visual Editor (the figure below) takes care of all the code behind the formatting of your words. If you’re not interested in learning how to hand-code HTML, you’ll want to use this editor to post to your blog. The following article cover the Visual Editor’s buttons and show you what they do.

When you hover your mouse pointer over a button in the Visual Editor, a tool tip pops up, displaying the keyboard shortcut for that button.

Formatting toolbars: Top row

No matter which view you use, you’ll see a toolbar at the top of the editing form. Each toolbar button formats your post in one way or another.

Sometimes you want a word or phrase to stand out, and one of the best ways to achieve that goal is to boldface that text. Select whatever words you want to boldface; then click the Bold button. The selected words will be bold in the editor window and in the post as well.

Italics are another way of emphasizing your words, and as you might guess, the Italic button applies that format. Select the words you want to italicize, click the button, and you’re done.

The Strikethrough button is a great way to acknowledge a mistake without removing the erroneous information. My face Strikethrough is also used for comedic effect in many cases.

The next two buttons let you create lists. To create a bulleted list (also known as an unordered list), click the leftmost of these two buttons; then select some text or an image to be your first list item. WordPress inserts a bullet, and when you press Enter or Return, you can add another item to the list. (Pressing Enter or Return twice ends the list so you can go back to writing normally.) A numbered (or ordered) list works the same way but creates a list whose items are numbered (as you may have suspected from the name).

Quoting people is fairly common in the blogosphere, but how do you note that the relevant section of your post is a quote from elsewhere? Block quotes are the answer. When you select some text and click the Block Quote button, WordPress creates a block quote and populates it with the selected text. Depending on the styling of your blog, block quotes can appear in a variety of ways. Usually, a block quote is indented and shown with a different-colored background, so that there’s no doubt in the reader’s mind that this section is a quote.

The next three buttons—Left, Center, and Right—allow you to align the text of your post. You can use whichever option you want, but WordPress defaults to left-aligned text.

I’ll wager you’ll use this set of buttons the most. The button with the three links of chain on it turns any selected word or phrase into a hyperlink. Clicking this button brings up the Insert/Edit Link dialog box (Figure below), where you set the following options:

• Link URL. The destination of the link (a URL of some kind).

• Target. The target setting specifi es where the link opens in the user’s Web browser. You can have the link open in the same browser window or a new one.

• Title. The title of the link, which shows up when someone hovers a mouse pointer over the link or accesses your site with a text browser.

• Class. Class is a styling option that can be used, in conjunction with some CSS, to apply formatting to your links. If you don’t know what CSS is, chances are that you can ignore this option.

If you want to change any of these values for an existing link, click the Hyperlink button again; the dialog box shows you the current values, and you can change them however you want. Back in the Visual Editor toolbar, click the button with the broken chain link to remove the linking code from the selected word. The word itself isn’t deleted—just the code that makes it a link.

It’s commonplace to see a Read More link at the bottom of blog posts nowadays. The idea is that you should cut longer blog posts into two sections so that your blog’s front page isn’t overwhelmed. Clicking this button inserts a <!–more–> quicktag and displays a dotted line across the posting fi eld in the Post panel. Anything before the dotted line is displayed on the front page of your blog. At the end of that section is a Read More link. Clicking the Read More link takes you to the entries page, which contains the full text of the post (including everything after the dotted line in the Post panel).

I don’t know about you, but spell checkers have ruined what little spelling ability I have. WordPress furthers my spelling decline by offering spell check. Clicking the Spell Check button enables it; clicking the button again disables it. Misspelled words are underlined in red; click an underlined word to see a list of suggested spellings, as well as options to ignore this occurrence of the word or all occurrences in the entire post.

Full-screen mode is all the rage with desktop word processors. It allows you to block out all distractions and concentrate on the work at hand: crafting memorable words for your readers. The Full Screen button expands the Post panel’s posting fi eld to occupy your entire screen. Click the button again to toggle back to normal view.

The very last button is interesting, because it isn’t the last button at all. Clicking the “kitchen sink” button (yes, that’s the real name) reveals a second toolbar that’s hidden from view by default (see the figure below). I will explain everything about it in the next article.

Blogging is FUN !

Filed Under: Wordpress