The icon for elements of type Image.
Functionality
Form elements of type image add an image to the current form and are just design elements. No value will be sent when the form is submitted. Add new images via drag & drop, by dragging the image from the file explorer of your choice to the images panel of the formcycle Designer.
There are two ways of specifying the size of an image:
- via the properties panel
- The height and the width can be adjusted in the basic properties panel of the formcycle Designer. Setting the width or height to 0 will not add the CSS properties width or height and the image will be sized automatically by the browser.
- via CSS
- Custom CSS can be used to specify the size of an image. For example, you can add a new CSS class in the CSS tab of the formcycle Designer and select this class in the CSS class panel.
Properties
Overview of the standard properties
This section describes only those properties that are different from the standard.
Style
This form element possesses the following additional properties for the section Style.
Name | Description |
---|---|
Alignment | Changes the alignment (left, right, center) of the image. |
Label
This form element possesses the following additional properties for the section Label.
Name | Description |
---|---|
Title | When set, a tooltip will show up when the user hovers with the mouse over an image. This uses the HTML attribute title. |
Alt Text | An alternative text that will be displayed when the image cannot be shown, for example when using screen readers. Sets the HTML attribute alt. |
Images
Images can be uploaded in the images panel of the formcycle Designer. To upload an image with drag & drop, drag the image from the file explorer of your choice, eg. Windows Explorer, Finder, or Nautilus, to this panel.
Images that have been uploaded already can be used simply by clicking on it. The selected image will now be shown in the form. Delete an image by clicking the icon at the upper right hand corner of the image.
Was this article helpful?
That’s Great!
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
Feedback sent
We appreciate your effort and will try to fix the article