On this page:
Additional tips can be found for Using any Rich Text Editor. Below tips are specifically for College of Fine Arts Drupal website:
- Hover your mouse over the buttons to see a tool-tip text in a pop up describing the button.
- Lines and paragraphs are automatically recognized. The <br /> line break, <p> paragraph and </p> close paragraph tags are inserted automatically. [shift+return=line break (single space) & return= paragraph break] If paragraphs are not recognized or fantom paragraphs appear, contact the COFA Web team.
- Web page addresses and e-mail addresses, typed on the page, turn into links automatically.
- Title of a work of art or performance included in the Title field of a page can be tagged as a citation. E.g. Andrew Hinderaker’s <cite>Colossal</cite> Earns Rave Reviews
Rich Text Editor Buttons
Formatting
Format drop-down
Insert headings or format text as a normal paragraph. Headings should follow the hierarchy of your content outline. By default the page Title field is Heading 1. Heading 2 should always precede heading 3 and so on. Never skip from heading 2 to heading 4. Style variations available in the Styles drop-down, learn more below.
Styles drop-down
Read more below about the variety of different styles and formatting options.
Basic Functions
Text Alignment – Left, Center or Right justify
Ordered list (numbered), Unordered list (bulleted)
Link – Tips for using the Link Button
Media and
URL embed.
Use the Media button to upload media (images, documents, YouTube or Vimeo video links) to the Media Library or use the URL embed button to embed multimedia and other kinds of content from external websites, like YouTube, Vimeo, Spotify and SoundCloud. Learn more about Media (Images, Documents & Videos) Management.
Horizontal rule
Block quote
. Superscript
Subscript
Editing Tools
Remove formatting
If anything ever goes wrong try selecting the area and removing the formatting.
. Insert Table
Read more about adding tabular data.
Undo and Redo
Source – View and edit the HTML code
There are some features of the site that will require you to edit the source code. Check out the HTML page to learn about these features and some other times you will want to edit the code.
Special characters drop-down
Allows you to include characters such as umlauts and ampersands. If the language of your content changes please provide the proper language encoding. In most fields, including first and last name fields, it’s safe to simply type the keyboard command to insert common special characters but always check in numerous browsers.
Choose Language drop-down
The default language of our websites is English. If you need to include content in a foreign language, this wraps that content in an HTML lang tag to inform the browser and screen readers that the content is to be read and interpreted as a language other than English.
Styles Drop-Down
The drop-down has small demo boxes for each option.
Variations for P (paragraphs) and H2-H6 (headings) – Each site is different. The Variation option may allow you to change the color, size or case. The goal is that you have enough options to expresses the desired prominence, grouping and hierarchy while accurately representing the outline of the page.
Big Paragraph & Bigger Text –Makes the text between 125-140% bigger. Bigger Text is inline within a paragraph or on a heading. Big paragraph increases both the text size and the leading / line-spacing, to be used on a multi-line paragraph. Making the text bigger is visual only and has no semantic meaning.
Smaller Text & Small Paragraph – Is the same as the Big options above but makes the text between 70-80% smaller.
Side Comment – visually does the same thing as the Small options but has a semantic meaning indicating that the text is fine print, like a copyright or legal text.
Cited work – Indicates semantically that the text is the title of a work, publication or performance. Eg.Hamlet. On most sites, it is visually represented as italic.
Strong & Emphasis – To indicate importance, insert text with emphasis or strong, which will visually appear italic or bold. Emphasis and strong provide semantic guidance for the device displaying the content. For example, a screen reader will verbalize strength or emphasis. Learn the semantic differences that create italic and bold styled text.
Visually Bold & Visually Italic – Use cases for these options are very uncommon. Only use these options if you really don’t want the text to have a semantic mean.
Visually Hidden – Hide content from the visual display to provide more context to Google, screen readers, and other non-visual displays. There are a few uncommon uses cases. The most common is to help add Non-Visible Link Context.
Span Clear Float – Whenever you have inserted an image that has Left or Right Image Alignment you should tell the text where to clear the floating or the image alignment may not always look correct on different size screens.
Manual Hyphens – If you are not happy with the hyphenation of your text you may try this option. It requires 2 steps: First, selected the text which you would like to manipulate the hyphenation and apply this style. Second, use the Source button to edit the code, as described above. Type in the code for a soft hyphen, an invisible format character indicating a desired hyphenation location, where you would like it to hyphenate. Type the text:
­
For example, in the text of an email:
<a href=”mailto:admissions@austin.utexas.edu”>
admissions@­austin.­utexas.­edu</a>