Image

Last update: Edit

1 Introduction

The image widget can be used to show a static image on a page, layout, or snippet.

For example, you can configure an image clicking which a page with customer details opens:

Image Example

2 Properties

An example of image properties is represented in the image below:

Image Properties

Image properties consist of the following sections:

2.1 Common Section

For more information on properties in this section, see the Common Section section in Properties Common in the Page Editor.

2.2 Design Properties Section

The Design Properties allow you to change spacing and alignment of the widget and hide it on phone, tablet, or desktop, if needed. Design properties may vary depending on the type of the widget. For example, for the text widget you can change its font weight, color, alignment, and letter case.

2.3 Events Section

For information on the Events section and its properties, see On Click Event & Events Section.

2.4 General Section

2.4.1 Image

The file name that this widget shows. For more information on when to use images and supported formats, see Images.

2.4.2 Width Unit

The width of an image. Possible values of this property are described in the table below:

Value Definition
Auto (default) The width of the given image is used.
Pixels he width is specified in a number of pixels. If you specify both width and height, the image will be scaled automatically: the proportions will be kept, the picture will not be stretched.
Percentage The width is specified in a percentage of the original width. It can be larger than its original width in which case the image is stretched

2.4.3 Width

Specifies the width of the image in pixels or percentage. This option is displayed only when Pixels or Percentage are selected for the Width Unit described above.

Default: not applicable

2.4.4 Height Unit

The height of an image. Possible values of this property are described in the table below:

Value Definition
Auto (default) The height of the given image is used.
Pixels The height is specified in a number of pixels. If you specify both width and height, the image will be scaled automatically: the proportions will be kept, the picture will not be stretched.
Percentage The height is specified in a percentage of the original height. It can be larger than its original height in which case the image is stretched.

2.4.5 Height

Specifies the width of the image in pixels or percentage. This option is displayed only when Pixels or Percentage are selected for the Width Unit described above.

Default: not applicable

2.4.6 Responsive

This property influences how the image scales. If the value is ‘Yes’, the image will never get bigger than its original size. It can become smaller. If the value is ‘No’, the image can become both larger and smaller than its original size.

Default: Yes

2.5 Visibility Section

Visibility determines whether a widget is displayed to the end-user as part of the page.

For more information on properties of this section, see the Visibility Section section in Properties Common in the Page Editor.

3 Converting to an Image Viewer

You can convert an image to an image viewer that allows you to display dynamic data. For more information on image viewer and its properties, see Image Viewer.

To convert an image widget into an image viewer, do the following:

  1. Select the image widget on a page and right-click it.
  2. From the list of actions, select Convert to image viewer.

The image widget is converted to the image viewer and you can configure it.

4 Read More