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. Easily create, edit, and format your content in a familiar way.

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.

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.

Follow the information below to complete some of the lessor known tasks from the Editor Tool bar in WordPress.

Editor Tools

Text Settings

The default Text Setting in the WordPress editor is Paragraph. By default text in the text editor will be Paragraph until you change the setting to a semantic heading. To locate headings, select the drop down menu to view your choices.

Configure Text Settings

  1. Put your cursor on a new line in the text editor.
  2. Locate the Paragraph drop down, then select the Heading level. Your headings should follow semantic numbering.
  3. Type or paste your heading.
  4. You can also simply click on the text you want to make a to and the select a Text Setting.

Buttons and Link Formats

Text Formatted Button

Text Formatted Buttons are available to create in the WordPress Editor and in Panels. Buttons should be used to take action or begin processes. Use buttons for call to 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.

Create a Text Formatted Button

  1. 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”.
  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 Buttons.
  6. Choose a button option.

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.

Text CTA Link

Use this format when you want to draw attention to an important call to action on your web page. This bold sans serif font changes the format from the paragraph serif and makes it very obvious to the visitor that the link is a call to action. Text links that point to other pages or sections in your site are setup by accessing Text CTA Link in the Formats drop-down menu.

Create a Text CTA Link

  1. Type the action text, then highlight the words you want to make a button.
  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).

Blockquote

Blockquotes are used to highlight information that is quoted from another source. This text format is set off from the main text as a block of text. Rendered visually with white space margins, a bold sans serif font, and center alignment. Block quotations should be used sparingly.

Placing a Block Quotation on Your Web Page

  1. Put your cursor on a new line in the text editor.
  2. Type or paste your blockquote text.
  3. Locate and activate the Blockquote tool.
  4. View your new formatted text.
  5. To remove Blockquote formatting, highlight text or place your cursor in the text, and deactivate Blockquote by clicking the icon.

Insert/edit Link

Use the Insert/edit Link feature to attach a URL to your paragraph text. Link text that you want to point to a page or section in your web site. NOTE: Link text should be descriptive and tell the user where they are going. Do not use the hyperlink itself as the link text.

Using the Insert/edit Link Tool

  1. Select the text that you want to link.
  2. Find and locate the Insert/edit link tool.
  3. Paste or type to search a URL, then click the Apply button.
  4. To Edit or Remove link, click the hyperlink and select your option. Edit allows you to change the settings of your linked text. Removing, breaks the linked text.

Insert Media

Add visual interest to your text by inserting media in the text editor. Adding media in the text editor is a different process than inserting into a panel template. For more information, visit Images and Media.

Inserting Media in Your Web Page

  1. In the WordPress editor, position your cursor where you’d like to insert an image, document, and/or audio file, and click the Add Media button above the editor toolbar:
  2. There are three upload options: Choose the Upload Files tab and select or drag/drop a file to upload media to your site; Choose the Media Gallery tab to insert media you’ve already uploaded; Or use the “Insert from URL” option to import media hosted elsewhere.
  3. Make sure the Alt Tag input field has been filled in and the image is optimized for Thumbnail (150 x 150), Medium (300 x 159), Large (1024 x 541), Full Size (1300 x 687).
  4. To edit the image display settings, click the image and select Align left, right, center or no alignment.
  5. To remove the image, click the image and select the X icon.
  6. For more advanced editing options, click the image and select the Pencil icon.

Embedding streaming media

Using a feature called oEmbed, WordPress can easily embed media hosted externally on a variety of platforms. The example below uses YouTube, since YouTube is a common multimedia source, but the same process of pasting a shareable URL as text (not a hyperlink) works for most streaming services,

How to Use oEmbed to embed a YouTube Video 

  1. View your video on YouTube, and click on the Share menu item under the name of your video/organization.
  2. Copy the URL on the Share tab. Note: You do NOT need to select the Embed tab and copy the iframe code listed there. The oEmbed protocol allows us to embed YouTube videos on Boise State WordPress sites using only the short Share URL.
  3. Open the Edit Page screen for your WordPress page or post where you would like to embed the video and simply paste the Share URL from YouTube into the editor on your page/post. Make sure the URL is pasted as text and is not added as a clickable hyperlink. https://youtu.be/uygracR32Vo
  4. Update (save) your page/post. Your YouTube video should now be embedded where you pasted the Share URL.