How can I change the display of an element?

An element has two different settings available. In the Global settings, you configure the functionality of the element. For each element, we describe the global settings in the corresponding article. In this article, we will show you how to change the display and layout of the element.

Element Content Styling

Once you've added an element in the Form Builder, you'll immediately see a pop-up with the general settings of the element. If you click on the gears on the left side, you'll see the overview below. Depending on the element, some parts may not be available. In this section, we discuss the settings under 'Element Content Styling'.

Element_Content_Weergave_EN

Visibility

In most cases, elements are set to be visible by default in the draft and the document. When a user fills out a form, we call it a draft. Once the user completes the draft, it becomes a document.

Visibility (Draft)

You can configure the element so that it is not visible during the drafting process but is visible in the final document. This is useful, for example, for additional text that adds value only to your document but is not needed for the user filling out the draft.

Visibility (Document)

Conversely, it's also possible to show information to the user during filling out the form but hide it from the document's content. Additionally, you can specify to hide the element only if it has no 'value'. This is useful when an element is not mandatory to fill out, and you only want it in your document if it's filled out.

Lastly, you can check the box for 'Hide when there are no other visible elements in the row'. This is particularly useful if you have a form set up where the questions are placed on the left side and the answer options on the right side. You can then hide the questions by checking the box. If no answer is given, the question will be hidden in the document.

Alignment

With Incontrol, you can align the entire element for your documents. Each element can be aligned left, right, or centered. The default setting will be based on the language. For example, Chinese will automatically align to the right. Additionally, for the amount and unit element, you can choose to show them in a split.

Uitlijnen_Opties_EN

In the image above, you can see the different options and the effects of alignment.

Note: Alignment applies to the entire content of the element. The specified 'Label' and 'Text' will also align accordingly.

Content Formatting

For the content of the element, you can set whether you want it to be standard, bold, and/or italic. The 'Label' and 'Text' will not change by setting Bold or Italic in the settings. This only affects the user's input in the element. Below is an overview of the different settings.

Opmaak_Tekst_Opties_EN

Border Type and Background Color

For the content of the element, you can choose to place a border around the element and give it a background color. It's good to know that the border and background color are only placed around the content of the element. Any sub-forms of the element will not be provided with the border and background color. You can read all about sub-forms here.

Borders

You can choose between a dotted line or a solid line for the element. In this case, you can also choose to include text. This text will only be visible during the drafting process and not in the document.

Background Color

You can specify whether you want the element to have an alternative background color. The default color is 'gray' and cannot currently be set to another color.

Full Element Styling

Under 'Full Element Styling', you also have the options to set a border and background color. In the image above, you can see the effect of this.

Advanced

In the advanced settings, you have the option to provide an alias. With this, you can reuse the specified value of the element later. You can read all about this in this article.