Table of Contents
Media > Image Viewer
This page is suited to displaying an image with a lot of detail that you want learners to be able to examine closely. A toolbar allows learners to zoom in and out of the whole image, or a selected area, and Full Screen can be selected to maximise the area that can be viewed with a specific resolution.
Example demo
In the demo below, experiment with the tools in the toolbar to see how they function.
or view at Xerte Page Types - Media: Image Viewer (opens in new tab)
Editor interface
Core Properties
| Property | Description | Type | Additional information |
|---|---|---|---|
| Page Title | Text that appears in header of published page. | Text | |
| Page Text | Text and any other content you want to have displayed on the page. | Text+ (Toolbar) | You can add images, tables, sound, video and other content through the Text editor. |
| Align Text | Aligns text relative to the image. {Left/Right/Top/Bottom} | Drop-down | |
| Image: File | Upload the image here, through the Media Browser. | Link to Media Browser | |
| Image: Size | Sets the size of the image. {Small/Medium/Large} | Drop-down | Fixed refers to the size of the image as imported into Media Browser. |
| Image: Description | Description for accessibility. | Text |
There are no page-specific Optional Properties for this page type.
Language Options
| Property | Description | Type | Additional information |
|---|---|---|---|
| Move Button Tip | On Zoom In allows the image to be dragged around. | Text | Default - “Move” (this only works when the learner has zoomed in) |
| Zoom In Button Tip | Zoom in on the central point of the image displayed. | Text | Default - “Zoom In” |
| Zoom Out Button tip | Zoom out of the central point of the image displayed. | Text | Default - “Zoom Out” |
| Select Button Tip | Allows a rectangle to be selected, to which the view zooms in. | Text | Default - “Select Area” |
| Reset Button Tip | Resets the image to the default view. | Text | Default - “Reset” |
| Toggle Button Tip | Toggles between full screen (right panel hidden) and the default view. | Text | Default - “Toggle Full Screen” |