Show/Hide Toolbars

Thereforeā„¢ Help

Tutorials > Solution Designer > Design > eForms

Adding a logo or image to a form

Scroll

When configuring an eForm users are able to add logos or images as part of the eForm that form takers later on can see but not interact with.

 

1.In the Form Builder (of the Thereforeā„¢ eForms interface), drag a File component into the Form Creator.

SD_T_Design_Eforms_AddLogo_001

2.Under the Display tab, check the Hide Label and Disabled checkboxes.

SD_T_Design_Eforms_AddLogo_003

3.Under the File tab, set Storage as Base64 and check the box Display as image(s), then click the Save icon.

SD_T_Design_Eforms_AddLogo_002a

 

4.Under the Data Tab, drag an image (or browse using the provided link) into the File component. Then click on the Save button. The image will now be visible on the eForm.

SD_T_Design_Eforms_AddLogo_004a

SD_T_Design_Eforms_AddLogo_005

Controlling where an image is displayed in the eForm

For full layout control, it is recommended to use a plain HTML element.

 

Embed the 'src' of an image in plain 'html'. The 'src' should look like:

<img src="data:image/png;base64,<base64 encoded image data>"

Ā                alt="Test" style=" display: block; margin-left: auto; margin-right: auto; width: 40%;"/>

 

This can then be pasted into the Content field of the Display tab.

 

The 'src' can be generated by uploading the image onto a website such as:
https://www.base64-image.de/

 

info

Note:
You can add manual line breaks if the image data gets outside of the editor width.