Image

The Image form control allows you to add images to your form via a URL.

Note: 

  • No start event variables are generated from Image controls because they are display-only.

  • You can arrange up to six of this control on a single row in the form.

  • The image control can be used in form rules to trigger an event when it's clicked.

Section Setting Description
(unlabeled) Name

The tooltip text for the Source URL image which is displayed in the form.

 

Alignment

Applies the selected alignment to the heading text on the published form:

  • Left
  • Center
  • Right
 

Source URL

URL to the image file.

Note: 
  • Start URL with http:// or https://

  • To use a Google Drive hosted image, you must modify the shared URL so that it is accepted by the Nintex Automation Cloud form image control. For instructions on how to modify the URL, read this Community article.

Hover over or click in this field, and then click Insert to launch the Insert window to insert a variable or create inline formulas using the Formula builder. For example if you want to display an image based on a selection or value of another control in the form you can insert a form control variable.

For more information about how to insert an inline formula, see Open the Formula builder from the Designer tab.

For detailed descriptions on the Insert window, see Insert variable dialog fields, buttons, and settings.
 

Alternative text

The tooltip text which displays when no URL has been entered in the Source URL field, or the image cannot be displayed e.g. an image cannot be accessed.

 

Image width (%)

Percentage of original image size to display.
 

Visible

Shows the field on the published form when loaded.
  Shrink Reduces the width of the control when placed in a row with other form controls.
  Expand Increases the width of the control when placed in a row with other form controls.
Styling CSS class

Add a CSS class to apply a style to this form control. You can create the CSS class in the CSS code editor in form styles. Enter one class name or multiple class names separated by a space.

For more information, see Add a custom CSS to individual controls.
  Border color

Border color to apply to the field.

To select a color, click the color box and use the color picker to specify the color you want. You can click on the color map to select the color or enter the Hex code.

To revert back to the global style, click Reset to global style.