Adding content with the Visual editor

The editor used to enter content into your Page or Post is very easy to use. It’s much like using a regular word processor, with toolbar buttons that allow you to Bold (Bold buton) or Italicize (Italic button) text or enter in Headings (Paragraph button) or bullet points (Unordered List button Ordered list button). You can even use most of the basic keyboard shortcuts used in other text editors. For example: Shift+Enter inserts a line break, Ctrl+C/Cmd+C = copy, Ctrl+X/Cmd+X = cut, Ctrl+Z/Cmd+Z = undo, Ctrl+Y/Cmd+Y = redo, Ctrl+A/Cmd+A = select all, etc. (use the Ctrl key on a PC or the Cmd key on a Mac).

At the top of the editor there are two tabs, Visual and Text (Visual/Text button). These switch the editor view between the Visual editor and the Text editor. The Text view will enable you to view the HTML code that makes up your content. For the more experienced users this can be helpful at times but for those not familiar with HTML tags, it’s not recommended.

When creating a new Page or Post, the first thing to do is enter in your title in the top entry field where it says Enter title here. After moving the cursor down to the editor a new Permalink is created for your page. Permalinks are the permanent URL’s to your individual Posts, Pages, Categories etc.. Though not usually necessary, you can manually edit your permalink by clicking on the actual permalink (the part after the domain name with the yellow background) or by clicking the Edit button next to it. Once you’ve modified it, click Ok to save or Cancel to cancel your changes.

At the top of the editor where your content is written, there are numerous formatting buttons. Clicking the Show/Hide Kitchen Sink button (KItchen Sink button) will show or hide a second line of formatting buttons which gives you extra functionality. The editor buttons perform the following functions:

Add media button Add Media – Used to upload and insert media such as images, audio, video or documents
Bold buton Bold – Bold text
Italic button Italic – Italicise text
Strikethough button Strikethrough – Add a strikethrough to your text
Unordered List button Unordered List – Create an unordered (bullet point) list
Ordered list button Ordered List – Create an Ordered (numbered) list
Blockquote button Blockquote – Used as a way of showing a quote. How this looks will be entirely dependent on the Theme that your site is currently using
Align Left button Align left – Align text to the left
Align Center button Align Center – Align text in the center of the page
Align Right button Align Right – Align text to the right
Insert Link button Insert/edit link – Used to create an html link to another page or website. The text that you want to link needs to be highlighted first before the button become will become active.
Unlink button Unlink – Remove the html link from the selected link. Your cursor must be sitting on an active link for the button to be active
Insert More button Insert More tag – Inserts the More tag into your Page. Most blogs only display a small excerpt of a Post and you’re required to click the Post title or a “Read more…” link to continue reading the rest of the article. When you insert a “More” tag into your Post, everything prior to the tag is considered as this excerpt. Most times you’d only use this button when you’re creating a blog Post, rather than a Page
Spell Checker button Toggle Spellchecker – Used to toggle the spellchecker on and off. You can also select between a range of different languages
Fullscreen button Toggle fullscreen mode – Clicking this button will enlarge the editor so that it fills the browser window. Clicking the Exit fullscreen link at the top of the screen will reduce it back to its original size
KItchen Sink button Show/Hide Kitchen Sink – Used to show or hide the second row of formatting buttons on the editor toolbar
Style button Style – Used to format the Page text based on the styles used by the current Theme
Underline button Underline – Underline your text
Align Full button Align Full – Align text on both the left and right (ie. justify)
Text Color button Select text color – Use to change the color of text
Paste Text button Paste as Plain Text – Copying & pasting text from other sites or word processors sometimes leaves the text formatted differently to what you were expecting. The reason for this is that quite often the html tags or codes that formatted the original text are pasted along with the text itself. To avoid this, Paste as Plain Text will strip all these formatting and html tags. Checking the keep linebreaks checkbox will preserve all HTML <br /> tags. Unchecking this option will remove them.
Past Word button Paste from Word – Pasting text from MS Word typically includes a huge amount of extra unrequired HTML tags which usually leaves the text formatted incorrectly. Using the Paste from Word option will remove these additional tags and clean up the HTML
Remove Formatting button Remove formatting – Use this to remove all the formatting (eg. Bold, Underline, text color etc..) from the highlighted text
Insert character button Insert custom character – Used to insert special characters not easily accessible via the keyboard (eg. ¼, ½, ¾, ©, €, Ö etc..)
Outdent button Outdent – Removes one level of indenting
Indent button Indent – Indents text by one level
Undo button Undo – Undo your last action
Redo button Redo – Redo your last action
Help button Help – Displays information about the WordPress visual editor along with keyboard shortcuts
Visual/Text button Visual/Test – Switches the editor view between the Visual Editor and the Text editor. The Text view will enable you to view the HTML code that makes up your content. For the more experienced users this can be helpful at times but for those not familiar with HTML tags, it’s not recommended