- Visual vs Text Tabs
- Emphasis in Text
- Links
- Lists
- Headings
- Horizontal Rules
- Single and Double Spacing
- Tables
Visual vs Text Tabs:
Visual Tab
The visual tab is the standard WordPress editor.The visual tab gives you a preview of a basic version of the site as you are editing it.
Text Tab
WordPress editor tab allows Advanced WordPress editors to use html. Most editors should use the visual tab instead. Read more about using HTML
Emphasis in Text:
Bold:
The bold button creates bolded text using the strong tag. It should be used for important text.
Italicized:
The italics button creates italicized text using the <em> html tag. It should be used to emphasize text.
Underlined:
Avoid using underlined text on your pages, as underlined text typically suggests a link.
HTML
Bold:
<span class=”strong”>bold text</span>
Italicized:
<span class=”em”>italicized text</span>
Adding Links:
Links can be added by highlighting text and clicking the add link button. From here, you will enter the link destination in the URL field. For example, if you would like the link to lead to Google, you would enter “https://google.com” in the URL field. Note that the “https://” is required when entering the URL.
If you would like the link to lead to an internal page from within your site, instead of entering the destination URL you can link to existing pages by selecting a page at the bottom of the window, or using the search field.
The button to the right of the add link button will break (remove) links that are highlighted in the visual editor
It is important to note that for accessibility reasons, your link text needs to be meaningful and describe the destination. A link that reads “click here” will be confusing to visually impaired visitors who require screen readers. Instead, the link should be descriptive of where the link leads.
Lists:
There are two ways to create lists using WordPress:
Unordered lists use bullets.
- Fruits
- Veggies
- Meat
- Broccoflower
HTML
<ul>
<li>Fruits</li>
<li>Veggies</li>
<li>Meat</li>
<li>Broccoflower</li>
</ul>
Ordered lists use numbers.
- Item1
- Item2
- Item3
- Item4
HTML
<ol>
<li>Item1</li>
<li>Item2</li>
<li>Item3</li>
<li>Item4</li>
</ol>
Read more about unordered and ordered lists.
Headings:
There are three types of text that can be used when creating a post: paragraph text (default), heading 3, and heading 4:
Headings generally are used as titles for a section of a document. For example, the main title of a page is a heading 2 (not available in the drop down), then your secondary title will be a heading 3, and then any child headings to that should be a heading 4. Refrain from using heading 1’s and 2’s, as they are reserved for use for site and page titles and are not supported in the actual page’s content. Use paragraph for the main content that is being added.
Alternative styles available for headings
Horizontal Rules:
Horizontal rules are a faint gray line that is meant to separate thematic shifts in content. You can add horizontal rules from the first row of the visual editor menu. Add them by placing the blinking cursor directly after a paragraph and clicking the button:
Horizontal Rule
<hr />
An alternative to using the horizontal rule button is the following, darker, rule:
Strong Horizontal Rule
<hr class=”large” />
or in shortcode:
[largebreak]
Standard and large horizontal rule.
Single and Double Spacing:
While in WordPress’s Visual Editor, creating a new paragraph is done with the Enter (or Return) key and results in a double spaced break. In order to go to the next line (single spaced), you must hold shift while clicking enter.
Tables:
Tables, like Excel Spreadsheets, are divided into rows and columns and are great for organizing data, images, and other information. Tables are not good for controlling the layout of a website. Click here for more information on tables.