The Editor allows you to create and manage content while seeing an indication of what the end result will look like.
What is the Editor?
It's the place where you edit most of the written content in the CMS. It does what it says on the tin what you see in the Editor is close to what you will get on your finished page.
Most common editing tasks can be done within the Editor. You can also use the CTRL+C and CTRL+V shortcuts to copy and paste text into the editor from Google or Microsoft documents. Text pasted into your browser automatically takes on the formatting of the source text.
Tip: Pressing Ctrl+Shift+V pastes text without any formatting.
Where is the Editor used?
You'll use the Editor to edit:
- The body content of Basic Content type pages
- The body content of News stories
- The content inside Text boxes
What can I do in the Editor?
You can do lots of things, such as formatting text and adding a quote or a table.
All of the features of the Editor can be found in the toolbox above it. If you hover your mouse over the buttons you will be able to see what each one does. As additional functionality is added to the CMS the toolbar options may change.
- Paragraph format
- Insert special character
- Superscript and Subscript
- Remove format
- Link / Unlink
- Insert/remove numbered or bulleted list
- Increase indent/decrease indent
- Undergraduate or postgraduate taught course
- News story
- Staff or Student profile
- Component from Library
- Insert horizontal line
- Insert accordion
- Block quote
- Shaded box
- Undo, Redo, Cut, Copy, Paste
- Show blocks
Maximises the editing panel to the full width of your full screen. This feature is useful when you're working on a large document and the toolbar gets pushed up out of view.
Allows you to format the text using the default size ('normal'). You can also apply heading styles H2 (second most important heading) through to H6 (least most important heading). H1 is automatically applied to the page title only.
Use a hierarchical heading order (starting with H2) on your page.
Adds extra weight to your text to highlight important information. This should only be used on regular text and not headings. Avoid overuse.
Italicises your text. This should only be used on regular text and not headings. Check the style guide for italics.
Provides you with a selection of special characters including trademark ™ and copyright © symbols.
Removes all formatting from the selected text to return it back to the default weight and size. This is especially useful when you have copied text into a page from a different word processor, such as Word or Google Docs.
Use these buttons to add a link from any text. Read more about inserting links using this editor.
An anchor allows you to provide a link to content on the same page. To insert one, scroll down to where you want to link to, select some text - usually a header - and click the anchor button. Name your anchor.
If you are editing a Basic page and want the anchor to be used in the 'On this page' Component then it is essential that you select some text before you click the anchor button. You'll know you've done this correctly as the text will appear next to the anchor inside a dotted box.
To provide a clickable link to this anchor, select some text and click the link button. In the URL field type # followed by the name of your anchor. Do not include spaces or any upper case characters.
Select your text and click the button for your desired type of list. Highlighting and clicking again will remove the list formatting.
- Option A
- Option B
- Option C
- Step 1
- Step 2
- Step 3
Select your text and click the button to increase or decrease the indent of your new list item(s). To keep your content laid out neatly, do not indent lists by more than three levels.
Example increased indent list:
- Level 1 indent
- Level 2 indent
- Level 3 indent
- Level 2 indent
- Level 2 indent
- Level 1 indent
Insert a piece of media from the media library. Image containers span the full width of the page even if the contained image isn't. Media containers can be dragged around the page to position them wherever you want.
To learn more about how this feature works, read our guide about inserting images and videos.
Use the node feature to insert Smart cards. Once embedded a grey bordered box will surround item. The box is only visible in the CMS Admin and signifies that the content can not be edited in-page.
Insert a predefined teaser view link to either an internal or external news story. Once embedded a grey bordered box will surround item. The box is only visible in the Admin and signifies that the content can not be edited in-page. If you need to edit it you'll have to do so in the source News link. Changes will affect all instances on your site.
Use to insert a teaser or card to a Staff or Student profile.
Insert a predefined teaser view link to an event. Once embedded a grey bordered box will surround item. The box is only visible in the Admin and signifies that the content can not be edited in-page. If you need to edit it you'll have to do so at source in the Paragraph library. Changes will affect all instances on your site and central content.
Use this to add predefined content into your page. Once embedded a grey bordered box will surround item. The box is only visible in the Admin and signifies that the content can not be edited in-page. If you need to edit it you'll have to do so at source in the Paragraph library. Changes will affect all instances on your site and central content.
Inserts a full-width line across your page. Use this to break up larger pieces of unconnected content.
An example horizontal line is right underneath this sentence.
Accordions can be used to contain large amounts of content but should be used sparingly and assessed on a case-by-case basis. Normally, using Anchor links and the 'On this page' feature is a more effective way for a user to navigate a long page. Think about what content will be left on the page afterwards – if there’s very little else, it's probably best to keep it on the page. Ideally, we shouldn't try and 'hide' content.
Avoid using for FAQs.
Clicking the accordion button will add an accordion template within the Editor. Add the title and content within the specified areas.
- Accordion title 1
Accordion content 1.
- Accordion title 2
Accordion content 2.
Block quotes are great for breaking up a large body of text. Add the quote text, name and attribution to the provided fields.
Recommended use of quotes:
- For pages with long quotes, eg Student profile/News story: a short, concise highlight can be pulled out and added using the block quote feature. Leave the original text where it is. Add the quote somewhere between the first paragraphs of the page and a few paragraphs before it appears in the main body
- For pages with a short quote, eg Basic page about career options (more for marketing purposes): the quote itself can be added using the block quote feature. Replaces the original text.
Gives your content a shaded background and prove to be an effective way of breaking up / distinguishing content, but should be used sparingly (one or two per page). Keep the content short so the shaded box highlights key information.
You can add other elements such as text, media and quotes within the box. However, you shouldn't add elements such as tables and accordions.
Example shaded box:
Type, paste or drag and drop text here...
A full-width responsive table with alternate white and grey striping.
|Item header||Data header 1||Data header 2|
These functions work just as they would in a word processor document like Microsoft Word or Google Docs.
Why not have a play around with the Editor using your training account? This way you can get a feel for what is possible and what looks best.
Get in touch
If you have CMS questions or are stuck then get in touch and we'll do our best to help.