Editing text with the RTF editor

When editing text in Omnia, a RTF editor can be available. What is available in the editor is set up in Omnia admin, and in a few cases in the block itself.

Note! Options available in the RTF editor can differ a lot, depending on how it’s set up. Not all options described below may be available.

For more information about the settings, see: RTF editor settings

Using the RTF editor

Here’s all of the options that may be available in the editor:

../../_images/rtf-editor-all-options-v7-2.png

There are two lists and a number of icons available. You use the flag to note the language for the text you’re entering.

You point at an icon for a tool tip. Here’s an example:

../../_images/rtf-editor-all-tooltip-v7-2.png

Some options are also available as a floating toolbar, when text is selected, for example “Add link”, “Keep text only” and “OpenAI” (if available):

../../_images/rtf-editor-all-floating-v7-2.png

Se below for more information.

Add style

A number of styles can be available. To add a style, do the following:

  1. Select the text.

  2. Open the “Styles” list and select style.

../../_images/rtf-editor-all-style-v7-2.png

This example only shows headings, but there are other styles available below. Any style can be added to this list in Omnia admin (see link above).

Add and edit media

You can add an image or a video to the text. This is how:

  1. Click where the image or video should be added.

  2. Click the media icon.

../../_images/rtf-add-image-v7.png
  1. Use the media picker to add the image or video.

../../_images/rtf-add-image-media-picker-v7.png

See this page for more information: Media picker

The image/video area fills up the whole width (same width as the text), the height/width ratio intact. Some tools also becomes available. Here’s an example for a photo:

../../_images/what-the-heck-v7.png

From left to right:

  • To create a clickable link on the image.

  • To edit the image in Media Picker.

  • To remove the image.

  • To set the width of the image.

For a video, it’s not possible to create a clickable link. The other three tools are availble for a video as well.

To create a clickable link, click the link tool shown on the image and use the Add link general asset to add the link, see: Add link

When you click the tool to set the image width, the the tool becomes two. Click this one to set the width:

../../_images/rtf-add-image-tools-width-1-v7.png

The following is shown:

../../_images/rtf-add-image-tools-width-2-v7.png

Responsive width is the default, meaning the image fills the whole width of the RTF area in the block, with the height/width ratio intact. (This works the same for a video).

You can also set an exact width in pixels by selecting “Fixed width”.

Add an animated GIF

It can be possible to add an animated GIF to the RTF editor, if settings allow it, using this icon:

../../_images/rtf-animated-gif-icon-v7.png
  1. click where the animated GIF should be placed.

  2. Click the icon.

Something like the following is now shown:

../../_images/rtf-animated-gif-select-v7.png
  1. Use the search field or just browse to find an animated GIF.

  2. Click the GIF to add it.

  3. Click the GIF in the RTF editor, for editing options.

To remove an animated GIF, click it and click the dust bin shown.

You can also add a clickable link to the GIF, using the normal link tool, see above under the heading “Add and edit media”.

Add an emoji

It can be possible to add an emoji to the RTF editor, if settings allow it, using this icon:

../../_images/rtf-emoticon-icon-v7.png
  1. click where the emoji should be placed.

  2. Click the icon.

Something like the following is now shown:

../../_images/rtf-emoticon-select-v7.png
  1. Use the search field or just browse to find the emoji you want.

  2. Click the emoji to add it. (You can add more than one if you want to).

  3. Click outside the emoji window to close it.

Add a table

To add a table, do the following:

  1. click where the table should be placed.

  2. Click the table icon.

../../_images/rtf-editor-table-v7.png
  1. Click somewhere in the table for more options.

Something like the following now becomes available:

../../_images/rtf-editor-table-edits-v7.png

Most of these option you recognize from other applications, for example Microsoft Word.

In the Table styles list, a number of styles are available:

../../_images/rtf-editor-table-edits-table-styles-v7.png

You can also style an individual cell using the icon to the far right.

../../_images/rtf-editor-table-edits-cell-style-v7.png

Pasting text only

A well known problem when pasting text from other sources into an HTML environment is that styles and the like from the original text does not work - or is not wanted. To make that problem go away, you can paste the text as text only.

All style tags are removed. Default HTML styles is kept.

  1. Paste the text.

  2. Click the Keep text only icon.

../../_images/rtf-editor-test-only-v7.png

You can also use this option on text you already have in the block. Just select the text and the option becomes available.

Pasting contents from Microsoft Word

When pasting contents from a Microsoft Word document into a rich text field, some of the text formats can also be pasted. Headings are also regocnized and the RTF editor settings for these headings are applied.

Note that bold, underscore and headings are considered default HTML styles and will be kept, with the RTF editor settings, even when pasting text only is selected.

Images from the Word document are also pasted, if you select them. Note that this apply to Rich text fields (blocks) only. It does not work for plain text.

Add an anchor (bookmark)

Anchors can be used in the Add link general asset and when creating a link button using the Action button block. So, if you add an anchor (bookmark) to the text, links can be created to that anchor.

Here’s how to add an anchor:

  1. Type the text.

  2. Select the text where the anchor should be placed.

  3. Click the anchor icon.

../../_images/anchor-icon-v7.png
  1. Add an anchor name and save.

../../_images/anchor-name-v7.png

For more information about Add link, see: Add link

For more information about the Action button block, see: Action button

Using machine translation

If the option is available you can machine translate the text in a block, this way:

  1. Click the icon.

../../_images/rtf-editor-machine-translation-v7.png
  1. Select the language to translate to.

../../_images/machine-translation-select-language-v7.png

Any language can be selected here. The languages set up in Omnia admin are shown at the top of the list. To select another language, select “Show all Languages” at the bottom of the list.

../../_images/machine-translation-select-language-all-v7.png

Note! You can use Ctrl-Z or just discard changes if you change your mind.

Using OpenAI

If available, you can use OpenAI to suggest changes to the text, or maybe even to suggest some text for you.

If OpenAI is available, you use the following icon to start the option:

../../_images/openai-icon.png

If you select a part of the text, it’s also available on the floating toolbar:

../../_images/openai-icon-floating.png

Here’s how to use it:

  1. Click the icon to process the whole text, or select part of the text and then click the icon to only process that part.

  2. Choose what to do.

What is available here can differ greatly, if available at all. It’s fully up to administrators to set up in Omnia admin. Here’s an example:

../../_images/openai-options.png
  1. Select option.

  2. Check OpenAIs suggestion and edit if needed (or cancel the whole suggestions with Ctrl-Z).

If a Custom option is available (can be named something else) you can ask OpenAI to do more or less anything you like (with text that is).

The chat window, which can be called something else, can look this way:

../../_images/openai-chat.png

You can ask OpenAI to do any changes to the text, or create new text, by using “normal” conversation. Just try it out, what will be saved is totally up to you.

In this example the author was thinking about adding a section about the central railway station in Stockholm, but didn’t know what it was called. So he simply asked OpenAI that.

../../_images/openai-chat-example.png

HTML

If it’s available, you can work with the HTML code, if you know how. When you click the icon a separate window is opened, where you do your HTML work.

../../_images/rtf-editor-html-v7.png