Body Text Component

Showcases the Body Text component. [5:12]

Two options for completing this exercise...
  1. Request a Self-Paced account on the Training Server. Then just follow the instructions as is.
  2. If you already have access to the main Author Server, adapt the instructions to fit your own site.

Scope

Body Text is used to display the main textual content on your page, and each section of text will need its own Body Text component. Thus it is one of the most common components on our websites.

Instructions

1. Log into the UBCMS.

2. Open the Sites Console and navigate to your site; e.g. Sites + Self-Paced Training + {your site}.

3. Choose any page on your site or create a new page.

4. Select that page and click Open in the Commands Menu that now appears.

5. To add a component...

  • Click the Toggle Side Panel button in the upper left of the window.
  • Switch to the Component Browser.
  • Components are listed alphabetically. Or type part of its title and click Enter.
  • Find your desired component and drag it onto the page.

6. Select the component, then click the wrench icon to Configure it.

7. Type in some text or copy and paste from the block of Sample Text below.

8. Try using some of the Rich Text Editor tools including the Spell Checker.

9. Click the checkmark icon when you are done. (The 'X' cancels your changes.)

10. If you pasted in the sample text, what formating was retained?

Practice good web writing standards: write clearly, focusing on your audience, with language that your visitors are looking for.

Rich Text Editor: because this is a text component, it supports additional formatting which we can add using this toolbar across the top, called a Rich Text Editor. Some basic word processing features are supported, such as bold, italics, underlining, bullets, and hyperlinks. There is also a very simple spell checker.

Pre-formatted text can be pasted in from other sources (e.g. a word processor or a non-UBCMS website). This allows inclusion of special characters, hyperlinks, and simple text formatting (e.g. bold, italics, underlining), while incompatible formatting will be suppressed (e.g. font colors, different font types or sizes, headings, lists, and images) and you will often see extra blank lines or spaces. Expect to do some cleanup before you are done.

Finally, for accessibility, do not mimic other components within this component. For example, do not bold a line of text to make it look like a heading or add a few blank lines for more whitespace--instead, use the Title component for headings and the Divider to break up the page.

Additional Reading

Sample Text for the Exercise

If you like, use this sample block of text which contains some formating, a link, and a typo!

More than 230,000 UB alumni are making a difference in every state and 130 countries around the world. Among our celebrated graduates are NASA’s lead astronaut for medical issues; a former president of the American Medical Association; the former minister of educaton in the People’s Republic of China; the CEOs of Paramount Pictures, J. Crew and A&E Television Network; and the Washington Post’s Pulitzer Prizewinning editorial cartoonist.