Text

Audience: All editor roles

Please note this product is in development and you may find videos and documentation don't reflect current functionality. 

Topic covers how to add and edit a text component on a page.

The Fresco text editor is CKEditor, a WYSIWYG (What You See Is What You Get) editor which provides a useful set of tools for content editing.

Timed transcript

• After opening a page, click the blue plus icon where you want the new text to appear.
• Select ‘Text’ from the pop-up window.
• Add your content in the text window.
• On the 'Styles' tab, set the component width, optional anchor link, and column span.
• Click 'Apply' to add the text to the page.

If you're copying and pasting text from another source like a document or webpage, always remove any hidden formatting. Copied text often includes invisible styles or code that can interfere with your site's appearance and functionality. You can either:

• paste the text, then highlight it and click the ‘Clear formatting’ icon in the toolbar
• paste the text using CTRL + SHIFT + V.

This strips all styling and HTML, leaving plain text which is safe for your site.

Styles and formatting can be applied using the options in the toolbar:

Image

• Heading and paragraph styles
• Bold / italic
• Subscript / superscript
• Undo / redo
• Lists (bulleted / numbered)
• Tables
• Links
• Media, such as images and documents
• Horizontal line
• Text alignment
• Indent in / out

Avoid underline - it can be mistaken for a link.

Use the toolbar to: 

Image

• Move the component up or down the page
• Edit the component settings
• Copy the component
• Delete the component from the page. 

• Write clearly
  Use plain English. Avoid jargon and long sentences - this helps all users, especially those using screen readers.
• Structure content well
  Use headings (H2, H3, etc.) in order, and break up text with bullet or number lists for easier scanning.
• Use descriptive link text
  Avoid vague phrases like 'click here' and 'find out more'. Instead, say what the link does - e.g. 'Download the annual report (PDF)'.

For more information, see the University's accessibility training and resources.

0:01
In this video, you'll learn how to add and edit text in Fresco.

0:06
After signing into Fresco, go to the 'Content' section. Find the page you want to edit and click the 'Edit' button to open a draft.

0:18
Locate the section you wish to edit and click the blue '+' icon where you want the text to appear.

0:26
In the pop-up window, select 'Text'.

0:29
Please note, not all of these components will be available to you immediately.

0:35
Add your content to the new window and use the WYSIWYG toolbar across the top to format it.

0:44
To do this, you need to highlight the text and select one of the options from the toolbar.

0:49
Use the drop-down menu to apply a heading, or select paragraph for normal text.

0:54
Format the text using bold, italic, subscript and superscript, but please don't use underline as this could be mistaken for a link.

1:08
You can clean up pasted content using the 'Clear formatting' tool.

1:14
You can undo and redo your changes, add bulleted or numbered lists, and you can add a table and select the number of columns and rows you need. To insert a hyperlink, click the icon and paste the URL into the URL field.

1:35
Or you can also type a page name to select a page from your site.

1:44
Use the 'Title' attribute to provide additional information but please note this is optional.

1:52
To add media such as an image or a document, select the media icon and then choose the type of media from the left.

2:03
Then you can either upload a file or choose from one of the existing ones.

2:09
Click 'Insert'.

2:10
When you're done, you can also add a horizontal line.

2:17
Align your text and you can indent or outdent.

2:24
If you're copying from another source, like a document or web page, it's always important to remove any hidden formatting.

2:33
Copied text often includes invisible styles or code that can interfere with your site's appearance and functionality.

2:41
There are two ways to do this.

2:43
You can either paste the text into the window, highlight it, and click the clear formatting icon. Or you can paste the text using Ctrl, Shift and V.

2:55
This strips all styling in HTML, leaving plain text that is safe for your site.

3:02
When you're done, go to the 'Styles' tab.

3:07
Here you can adjust the width of the component, you can add an optional anchor link, and you can choose how many columns the text component spans.

3:17
Click 'Apply' and the text will appear on the page.

3:23
To edit existing text, click on the text.

3:28
The edit pane will appear on the right.

3:30
Any changes you make in the edit pane will immediately appear on the left.

3:36
Close the window when you are done.

3:40
And lastly, use the 'Text toolbar' if you need to copy the component or delete the component from the page.

3:49
This toolbar functionality is covered elsewhere on our Fresco Help site.

3:54
When you're finished, click 'Save' and then click 'Exit Editing' to preview any changes.

4:03
And that's it.

4:04
You've successfully added and edited text in Fresco.
 

Back to top