Templates present the data input Fields in a structured way on the screen or device, these Templates can then be selected to construct Forms. Use the Template Builder's quick drag-and-drop system with zero-coding.
To create a new Template, you must first be in the 'Template' section and then click on 'Add Template'. This will present you with the screen below:
- Title: What is the name you want to give this Template? This will appear on the screen above the fields that will be displayed in the Template.
- Identifier: What is the unique system identifier for this Template? This is auto-generated as the Label with no spaces, but can then be overwritten if required. This should reflect the Label you have given it, but cannot have spaces.
- Help Text: What Help text do you want to appear on the screen when the user clicks on the ‘i’ in the Title bar of the Template (see below).
- Collapsed by Default: This shows only the Title bar of the Template by default and can often help aid User experience when deployed correctly. An example below shows the 'Reference' Template collapsed. You can also collapse a Template at any point in an App by clicking anywhere on the Title bar of the Template.
- Template Icon: Select an image from your existing site Image Assets to display next to the Template Title, this should align with the subject of the Template. If you want to use a new image, click the upload button to the right to browse your devices files.
Note: If working with multiple languages, you can use the pencil to select a Translated Asset as your Template Icon.
How do you want the data input fields to be displayed on the screen?
When building a new Template, this is accessed by clicking 'Create Template' after you have filled out the Details. After this, just like with a pre-existing Template, click 'Design Template' to get into the builder.
- First, decide on the maximum number of columns you will need for any row of your Template at this point in time. By default this is set to 4, but you can add a column by clicking the '+' next to the 'Search Fields' box. Similarly, to add rows click the '+' below the bottom row, in this case row A.
Note: No matter how many columns you display, because the Softools platform is mobile optimised or ‘responsive’, Fields will automatically wrap to the next line if there is not enough space on the web-form.
- Then select the Fields you want to display in each of the columns in a given row by dragging them across from the right into the desired row and column. For ease where there are many Fields, use the 'Search Fields' box in the top right.
- For certain Fields types you can choose to make them Span a whole row (the width of the screen) by toggling the 'Span' switch to the left of the row.
- To delete a row from the template builder click on the ‘x’ at the end of the row.
Note: Some fields such as Long Text and GridFields will be automatically configured to span all columns of a row.
When you have finished building your Template, make sure to click 'Update Template' to save any changes.
Copying and Deleting Templates
The copy and delete Template functions are described below and accessed via the arrow on the 'Update Template' button.
This will create a copy of the Template, forcing you to give it a different ID to the original before doing so.
A template can be deleted if it is no longer required. Bare in mind deleting means it will be removed from any forms that it appears in, but this will NOT delete any of the Fields that are contained within the Template.