This post will walk through the most used formatting toolbar in WordPress seen on the Visual Tab at the top of a post when creating or editing a post. By default, there is one row of 15 graphical buttons on the visual toolbar (Extra buttons may be added at the far right by plugins). They appear in this order (from left to right):
- Unordered (Bulleted) list
- Ordered (Numbered) List*
- Block quotes
- Left – Align text+
- Center – Align text
- Right – Align text
- Insert/edit link
- Insert More tag
- Toggle Spellchecker (with multiple languages drop down menu)
- Toggle Full Screen mode
- Show/Hide Kitchen Sink (yes, that’s really what it’s called).
*Formatting described is used on the text in this post
+Text is left-aligned by default in WordPress
Each of the buttons has a keyboard shortcut which you can see if you place your mouse pointer over the top of the button and let it sit there, so I won’t go further into those.
The first nine of these buttons can be used in one of two ways. You can click it and the format will be applied to the text as you type or you can click and drag to highlight the text then click the button to apply the formatting only to that section.
The First three buttons, 1. Bold, 2. Italics and
3. Strikethrough are used in the Ordered (numbered) list above and are fairly self-explanatory.
The next button is the 4. unordered list, more commonly known as bullet points. This is well suited for blog posts as it’s:
- Eye catching
- Easy to scan
- Allows for the reader to get the point of the post very quickly
The next button is the 5. ordered list, also known as the numbered list (as seen above). It’s good for steps or when you have a set (like buttons at the top of the page) you want to reference in their order.
The next button is the 6. blockquote button. This is best for lengthy quotes from other authors, articles or blogs. it also works very well for testimonials on a page.
It visually calls out any quotes on your post or page.
The next button is the 7. align-left button. This displays your text with a straight edge on the left side of the page and a ragged edge on the right side. This is also the default alignment in WordPress.
The next button is the 8. align-center button. This will center your text on the page and can have a ragged edge on both the left and right sides. That depends on the length of the line itself.
The next button is the 9. align- right button. This displays your text with a straight edge on the right side of the page and ragged edge on the left side of the page.
The next button looks like link three pieces of chain linked together. It’s the 10. Insert/edit link button. This is a multiple step button. To insert a link, you type the text you want to be a link, then click and drag to select that text and click the button. This opens a dialog box with a field for the URL (web address the link points to), Title (this is what appears if you place your pointer over the link and it’s good for text readers and Search Engine Optimization SEO as well) and a check box asking if you want it to open in a new window/tab (if you’re linking to an external website, rule of thumb is you want to check this box so the reader still has your site open). It also has a droplist at the bottom titled Or link to existing content. this is to link to a post or page on your site, in that case you wouldn’t check the open in a new window/tab.
The next button looks like a broken chain. It’s the 11. Unlink button. All you have to do to use it is click somewhere in link text so your cursor is in the middle of the link, then click the button. This will delete the link information (URL, Title and checkbox) without deleting the link text.
The next button is the 12. Insert More Tag button. this can be used to split your post into displaying on more than one screen. This only works with a post, not a page. once you use the button, it will place a link at that spot that leads to the rest of the post.
The next button is the 13. Toggle Spellchecker button. You can use it on the post as a whole or any section you click and drag over with your mouse to select. The droplist contains multiple languages you can spellcheck.
The next button is the 14. Toggle Fullscreen Mode button. It has four arrows pointing in four diagonal directions. Click that button and it shows you what your post/page looks like without any of the WordPress interface surrounding it. To exit fullscreen mode, point your mouse at the top of the page and click the exit fullscreen link.
The last button is the 15. Show/hide the Kitchen sink button. It looks like three rows of small boxes in different colors and its sole purpose is to make the secondary toolbar that sits just below this toolbar appear and disappear. It is the last default button on the primary toolbar. If you have any buttons to the right of this button, it is usually because you are using a plugin that put it there.
If you don’t see the secondary toolbar, click the button and it will appear. That secondary toolbar is what the next post will be about.