We are now on to tutorial 3. We’ve looked at how to add new Pages and Posts - now I would like to go into a bit more detail on how to use the text editor known in the industry as a WYSIWYG (What You See Is What You Get).
Use your mouse to hover over the icons in the image to get a description
The instructions below are in relation to the image above in order of top-left to bottom-right.
Used to add images to the content. Read the post WordPress Basics: Tutorial 1 – Adding a New Page.
This tab is set as default and is the whole premise behind a WYSIWYG (What You See Is What You Get). This should show you how your content will look like on the website, but never put too much trust in this. Always use the preview facility to get an accurate view of your post or page.
This tab will allow you to see and edit the HTML code outputted by the WYSIWYG. Note that the WYSIWYG will sometimes output code you can’t see in this view.
Highlight a word or phrase and make it bold. Can be useful for SEO, but should be used to emphasis text in order to help the read digest the content more easily.
Highlight a word or phrase and make it italic. Can be useful for SEO, but should be used to emphasis text in order to help the read digest the content more easily.
This will put a horizontal line through the center of a word or phrase. This can be used if you wish in the future to update a post or a page while keeping the old content so the read can see what has been changed.
Used create a list. Put each item of your list on a new line, then highlight and use the ordered list button to turn it into a list.
Used create a numbered list. Put each item of your list on a new line, then highlight and click the button to turn it into a numbered list.
A Blockquote is often styled differently and is most often used to quote someone, but can be used to make a portion of text stand out from the rest.
Aligns a body of text to the left. Often this is set as default.
Aligns a body of text to the center.
Aligns a body of text to the right.
Insert More Tag
You can use this to set what you wish to be displayed in the excerpt on the blog index or archive page. Depending on your theme, everything preceding the more tag will be in the excerpt.
Use this to check your spelling.
This will make your WYSIWYG full screen removing all distractions while writing your page or post.
A curious name, but will hide or show the second row of tools in the toolbar.
Use this dropdown to create your titles and subtitles. Highlight the phrase you wish to format and select an item from the dropdown. Note: in most WordPress themes, the post of page title is your Heading 1. You should have only one heading 1 on a page. The other heading such as h2 to h6 can be used multiple times on a page. They are often styled differently according to priority.
This will underline a word or phrase. Note that on the web, an underlined word often indicates a link.
Used to justify a body of text.
This will change the colour of your font. If you use this make sure it doesn’t clash with your theme colours.
Paste as Plain Text
You can use this to copy and paste text from another text editing program. This will remove all hidden styling and formatting before placing the text within your WYSIWYG.
Paste Text from Word
You can use this to copy and paste text from Word and it will convert the styling and formatting adopted by Word into legitimate HTML. Note: images will not be copied across and should be uploaded separately.
By highlighting a body of text you can remove all formating and styling.
Use this to insert special characters such as accented letters.
You can also use the shortcut Ctrl Z on your keyboard.
How to link words with the wordpress WYSIWYG
It is often useful and important for SEO to link parts of your page content to other pages on your website or to an external source. This is relatively simple to do. First, highlight the word or phrase you wish to link, this is known as the link (or anchor) text. Then in the toolbar of your editor, click the link icon which will no longer be greyed out. This will bring up the following box:
If you are linking to an external website, put the web address in the url field e.g. http://www.rocketmill.co.uk
You may wish a link to an external website to open up in a new window or tab. Do this by clicking the relevant check box
To link to page or post within your site click Or link to existing content. This will bring up a list of pages and posts. If the list is extensive use the search. Then click the desired result.
Once you are happy with your link click the blue Add Link button bottom right.