Skip to main content

WordPress Text Editor

The WordPress Text Editor requires no special technical knowledge and allows you to create content using an interface similar to Microsoft Word and other text editors.

The Visual Editor is the default editing mode for WordPress, but if it does not appear to be enabled, you can select the Visual tab in the top right corner of the editor area.

Use the existing text formatting options outlined below to format styles in the WordPress Text editor. To ensure consistency and accessibility across the Boise State WordPress sites, do not use inline css or html tags to style text. Allow the Boise State WordPress theme to control all styles across the site.

Text Editing Tools

There are two (2) rows of editing icons contained within the visual editor. You can find out what any icon means or does by hovering over it with your mouse – a small tooltip will appear describing the icon and its purpose.

Paragraph and Headings

By default text in the editor will be formatted as Paragraph text. To format selected text as a heading, choose the appropriate heading level from the dropdown. Headings should go in order and heading levels should not be skipped.

Watch example of how to add headings to text in WordPress

Video does not contain captions or description. See text description for details.



adding headings to WordPress

Text description of process

From your WordPress visual editor, highlight the text you want to make a heading then select the appropriate heading from the drop-down list. You can also add your cursor to the front of your line of text and select an appropriate heading to change the entire line.

To view the HTML tags added to your content, you can switch from the visual editor to the text editor.

Using Panels to Publish Content?

If you use the panels available in the Boise State WordPress theme to publish content, using the Title fields will create headings on the page.  Review Recommendations for Accessible Panels learn more about recommendations for formatting content within the panels.

Text CTA (Call To Action)

Use this format when you want to draw attention to an important call to action on your web page. This bold sans serif link style can be used instead of a button to draw attention to important calls to action like “Read the full report” or “Review our grading policy”.

  1. Type the call-to-action text, then select the words that should be included in the link.
  2. Select the link icon in the Editor Toolbar to Insert/edit a link.
  3. Add your destination URL.
  4. Click the Formats drop-down in the editor toolbar.
  5. Select Text CTA (Sans Serif).

Example Text CTA

Buttons

Buttons can be created in the default WordPress text editor and in the text editor in panels. Use buttons for user actions or to begin a process, like “Submit Form”, “Add to Cart” or “Search”. Items that don’t qualify as a button should be a link in the navigation or a text link on the page.

To create a button, type the action text, then highlight the words you want to make a button. Use sentence case for button labels. Button labels should be as short as possible with “trigger words” that your users will recognize to clearly explain what will happen when the button is clicked. For example, “Sign up now” or “Apply”.

  1. Select the link icon in the Editor Toolbar to Insert/edit a link.
  2. Add your destination URL.
  3. Click the Formats drop-down in the Editor Toolbar.
  4. Select Buttons and choose one of the button options.

Remember to use the navigation included with the Boise State theme to link to other content on your site and do not use buttons as navigation. Users expect to find navigation in one consistent place and format.
Example Large Standard
Example Large Ghost
Example Small Standard
Example Small Ghost

Text Style Options

Bold (strong) and italics (em) options are available for styling text.

  • The strong element indicates that the text is of strong importance as related to the surrounding text.
  • The em element indicates that the text has a stressed emphasis as compared to surrounding text.

It is important to understand the meaning of the strong and em text markup elements and not over-use these options or utilize them to replace headings.

You might notice that some text styling options are not available in the editor.

  • Alignment – Most languages, with some exceptions, are read top-to-bottom and left-to-right. Therefore, left-aligned text is easier for readers to scan, read, and comprehend your web content. Boise State WordPress sites left-align most content by default.
  • Underline – On the web, users expect underlined text to be hyperlinked, which the Boise State WordPress theme will do by default. Underlined text that is not a link can be very confusing for your audience and should not be used.

For more information about text, alignment, and other presentational attributes, review WebAIM article Text/Typographical Layout.

Blockquote

Blockquotes are used to highlight information that is quoted from another source.

Blockquotes are rendered visually with white space margins, a bold sans serif font, and center alignment. Block quotations should be used sparingly.Boise State University Webguide

Add the Blockquote style by selecting the quoted text and activating the Blockquote tool option in the visual text editor. Include the source of the quotation by adding a cite tag just before the closing blockquote tag. You will need to edit the page in Text mode to use a cite tag. See w3schools.com for more information about the cite tag.

Insert/Edit Link

Use the Insert/edit Link feature to attach a URL to your paragraph text. Link text should be descriptive and tell the user where they are going. Do not use the hyperlink itself as the link text.

  1. Select the text that you want to link.
  2. Find and activate the Insert/edit link tool.
  3. Paste or type to search a URL, then click the Apply button.

To Edit or Remove link, click the hyperlink and select the relevant option. Edit allows you to change the settings of your linked text. Removing breaks the linked text.

Paste as Text

When you copy and paste content from another source into your webpage, avoid introducing extraneous styling. Paste your content as plain text either by choosing the “paste as plain text” button on the visual editor toolbar, or by typing the keyboard shortcut CTRL+SHIFT+V.

The “Clear Formatting” tool can also be helpful in removing unwanted styling.

Back To Top