The image can be referenced in other content blocks of the same task anywhere rich text input is available.
To add the image in the rich text editor, first click the image icon on the toolbar. This will open the Image Properties modal, which includes the following tabs: Image Info, Link, More Options.
Image info
| Field / Choice | Explanations | Conditions |
| URL | A link to an external image source can be entered in the field. | Text field. |
| Dropdown menu for selecting an image file inserted into the content block. | If image files are inserted into the content block in the task, they can be selected from the dropdown menu. | Drop-down menu |
| Alternative Text | Allows you to add alternative text to the image, which will be read by a screen reader. | Text field. |
| Width |
Image width in the task display. This option allows you to set the width of the image when displayed in the task, specified in pixels. If the lock icon next to the width and height fields is in the "locked" position, the image's width and height will be adjusted proportionally. This ensures the image maintains its aspect ratio while resizing. |
Text field. |
| Height | Image height in the task display in pixels. | Text field. |
| Border | Image border width in pixels. | Text field. |
| HSpace | Allows you to add empty space to the left and right of the image (value in pixels). | Text field. |
| VSpace | Allows you to add empty space above and below the image (value in pixels). | Text field. |
| Alignment | Image placement in text. Options: <undefined>, Left, Right | Drop-down menu |
Link - Adding a link to an image (clicking the image opens a new page)
| Field / Choice | Explanations | Conditions |
| URL | A link to an external source can be entered in the field. | Text field. |
| Target |
Here, you can choose how a linked page is displayed to the task solver. The options are:
|
Drop-down menu |
Täpsemalt
| Field / Choice | Explanations | Conditions |
| ID | HTML element ID of the image. | Text field. |
| Language Direction | Text direction (screen reader may use it when reading text semantically associated with the image). | Drop-down menu |
| Language Code | Text language (screen reader may use it when reading text semantically associated with the image). | Text field. |
| Long Description URL | URL to a more detailed explanation of the image (screen reader may use it). | Text field. |
| Stylesheet Classes |
This field allows you to enter previously created classes:
|
Text field. |
| Advisory Title | Text displayed to the solver when they hover over the image. | Text field. |
| Style | This field allows you to enter more specific design settings in CSS format. | Text field. |