Form Elements in Layout Builder Tiles

Use elements in global tiles to create a form-based experience for content editors. Like components, use these tiles to create layout pages (LCFs) that prompt editors for information and add the information to complex design elements.

Add an element to a global tile, as follows:

1. When you create or edit a global tile, click Insert Element in the HTML or JavaScript toolbar.
2. In the Choose Element Type box, select a type.
   
   Short Text

   Creates a one-line text field for content.

        Can also be used for HTML attributes.

   Long Text

   Creates a multi-line text field for content.

   Checkboxes

   Provides a list of choices from which multiple options can be selected.

   Dropdown

   Provides a dropdown list from which multiple options can be selected.

   Dynamic Dropdown

   Link to a publicly-available data file that will define the dropdown options available to the content editor.

   Format your data file, as follows (remove comments to make valid JSON):

   {
     "items": [ // array
       ...other items
       {
         "displayName": "visible for user selection",
         "value": "actual value being set"
       }
       ...other items
     ]
   }

   You can also copy the following examples:

   Radio Boxes

   Provides a list of choices from which one option can be selected.

   Toggles

   Provides two choices from which one option can be selected.

   Multi-Select

   Provides a list of choices from which multiple options can be selected using Ctrl+Click.

   File Chooser

   Content editors can select a path to a file or page. They can also paste in an external URL.

   Image Chooser

   Content editors can select an image.
3. In the New Element box, enter information in the form fields.
   • Reference the field descriptions for elements.
4. Click Save.

Next, create the source code to display the form content on the page. Then Launch the tile to make it available for use in layouts and pages.

You can add the same element to a tile multiple times. To edit, click the element pill in the editor.

Elements on PagesLink to this section

LCFs that use elements will open a panel where editors can change the editable information.

1. Create or edit an LCF that uses an element tile.
2. Click anywhere in the tile.
3. In the editing panel, type to change the information in the form fields.
4. Save to close the editing panel.

Editing and Deleting ElementsLink to this section

If you make changes to element tiles that are in use on pages, update the layout(s) that use the tile. Edits will appear automatically in pages on the staging server that use the tile.

If you delete an element from a tile that is in use on pages, we will store any previously-saved data that was entered in the form. Editors will see this as inactive form data in the editing panel on the page.