You're looking at an older version of Totara.

Please see Totara 14 help for the latest version.

On this page

Search

The text editor in Totara is very important and appears frequently in different parts of the site. It is the primary tool for entering and formatting text. You'll see it when entering descriptions, replying in a forum, or adding a Label on a course page (as well as a host of other places). 

The default text editor is the Atto HTML editor, although this can be changed at a system level by the Site Administrator or by an individual in their user preferences. By default there are different editors to choose from:

  • Atto HTML editor: This is the default text editor, it has most of the basic formatting controls you find in a word processor. It supports drag and drop of images, plus it will auto-save changes. 
  • Weka editor: A text editor built with native mobile support in mind. This allows all content types to correctly render on mobile devices, including in the Totara Mobile app.
  • Plain text: There is no tool bar for formatting as there is in the other options. Instead there is a dropdown menu under the text box where you can choose the formatting you want, this will then mean that you can include your own formatting tags etc. without these being changed by Totara. 

Manage editors

A Site Administrator can decide which text editors will be available to other users and configure the options for different editors. Go to Plugins > Text editors > Manage editors from the quick-access menu. 

Managing the available text editors.

Weka editor

The Weka text editor is a JSON editor designed to be compatible with mobile devices, and can be used to optimise content for the Totara Mobile app. This is significantly simpler than the Atto editor, offering basic formatting (e.g. bold, italic, bullet points), and the ability to insert hyperlinks, attachments, images and emojis/emoticons.

The Weka editor is the only text editor available for Totara Engage. For example, when creating a resource or workspace discussion users will need to use the Weka editor.


The Weka text editor when creating a Totara Engage resource.

Adding links and embedding media

You can add links in the Weka editor by clicking the Insert link icon (). For links to other web pages, simply enter the URL and the Display text (the clickable text that will be visible to the user), then click Done.

Additionally you can choose to display the link as a card, meaning the link will be displayed with a title, icon and short description taken from the linked web page. Click on the link in the text editor, then select Display as card from the dropdown menu. 

Displaying a link as a card.

In the image below you can see the same link displayed as both text and a card.

Text and card-based links in the Weka editor.

For security reasons, the card will only be able to pull this information from https:// URLs and sites which are not part of a private network. By default, hosts with internal IP addresses are blocked. If you want to explicitly allow internal links to be parsed to add additional information to cards then you can add them to the $CFG-> link_parser_allowed_hosts configuration setting as comma-separated list of hosts, i.e. 'myinternalwebsite.intranet.example.com, anotherexample.wiki.example.com'. Please note that this does not automatically reject other hosts, it will just allow previously blocked hosts. If you want to explicitly block hosts from being parsed you can add those to the $CFG-> link_parser_blocked_hosts configuration setting in the same manner. This will result in links to those hosts not being parsed. The restriction to https-only links still applies.

See the embedding media documentation for more information on embedding videos and images in the Weka editor.

Mobile-friendly content

There are two ways to create mobile-friendly content for the Totara Mobile app using the Weka editor. Firstly, any content created directly in the Weka editor will automatically be mobile friendly. If you have existing content created in another text editor (e.g. Atto) you can make it mobile friendly by following these steps:

  1. Navigate to the section you want to make mobile friendly and click Edit.
  2. Use the dropdown below the text editor to select Mobile-friendly format.
  3. Please note that some content (such as images) may be lost when converting content to the mobile-friendly format, so make sure you keep a copy of the existing content before saving.
  4. Click Save changes.
  5. You will then be prompted to review the content in the mobile-friendly format and make any changes as required. 
  6. Click Save changes again when you're done.

Please note that this is a one-way process. After converting your content to the mobile-friendly format, you will not be able to revert it to the standard HTML format.

Changing a text editor to the mobile-friendly format.


This method can be used for:

  • Course/program/certification summaries
  • Topic descriptions
  • Labels
  • SCORM summaries

Accessibility

The Weka editor includes tools to enable users to create accessible content. This section provides information on the accessibility tools that are included in the Weka editor as well as best practice for creating accessible content with the Weka editor. For more information on our WCAG/ATAG 2.1 assessment for the Weka editor please refer to the accessibility conformance report.

Non-text content: Images

You can add alternative text to images to allow screen-readers to identify image content. 

To add alternative text follow these steps:

  1. Upload an image in the text editor.
  2. Click the image and select the ellipsis icon directly below the bottom-right-corner of the image. 
  3. Select Add alt text.
  4. Enter the alternative text and click Done.
Adding alt text to an image.

Alternative text should be a brief and specific description of what is shown in the image. It is not necessary to preface the description with 'image of' or 'picture of'. Images of text should be kept to a minimum, however if images are used as button functionality, the alt text attribute should describe the function of the image, for example 'Sign up' or 'Submit'.

Non-text content: Audio and video

For non-text content such as audio clips or videos, it is recommended that the media either includes captions within the video and/or a transcript is uploaded alongside the audio or video.

Formatting text content

When formatting headers and content, you should use the formatting tools for Heading, Subheading and Paragraph to create hierarchical content as opposed to using the Bold and Italics tools. The header formatting creates hierarchical content to support the user experience for users with assistive technology such as screen-readers. It is recommended that the use of Bold and Italics is limited to adding emphasis to specific words or phrases within paragraph text. To format text content, select the relevant icon before typing or highlight text content prior to selecting the formatting tool. 

Lists

If you need to include lists in your content, it is recommended that you use the bullet list or numbered list within the editor. When you enter content within the editor using keyboard alternatives such as ‘- [space]’ or ‘1.’ the bullet or numbered list will be automatically selected.

Atto HTML editor 

The Atto HTML editor is easy to use and will seem familiar to those who have previously used the TinyMCE editor, or in fact any word processor. It is important to note that although a limited range of tools are initially display, clicking the first icon will expand another row of editing tools. The editing space can be expanded by clicking and dragging the bottom-right corner. 

If you want to know what any of the icons do, then hovering your mouse cursor over them will bring up the name of the button, which normally also explains what the button does (e.g. Bold icon. is Bold which will make text appear emboldened). 

Atto text editor.

Atto auto save 

As you type in the Atto text editor there will be a message in the bottom left that lets you know your text has been automatically saved as a draft. This is very useful in avoiding data loss which could happen if for example, your connection is lost or you accidentally move to another page.

The auto save period is set by the Site Administrator from the Administration menu, under Plugins > Text editors > Atto HTML editor> Atto toolbar settings. 

Image drag and drop

If your browser allows drag and drop you can add images into the Atto editor simply by dragging them from the folder they are saved in and dropping them into the Atto text editor area. 


Provide feedback about this page using the link in the bottom right of this page. 

 Still have questions? 

Why not post them in the forums on the Totara Community?



  • No labels