Field Layout Options

The layout defines how the custom field is displayed at the front-end while viewing single record. Some layouts depend upon the type of the field. Additional settings or options may appear after saving.

1. Default (Inline or Horizontal)

The label and the field value are displayed in the same line. You can add additional CSS classes to style the display, label and value.

2. Stacked (Block or Vertical)

The label and the field value are displayed in different lines. You can add additional CSS classes to style the display, label and value.

3. Accordion

This can be used for sub form field type. In the sub form, you need to create two fields. The first field will be used as the title of accordion. The second field will be used as the content of accordion.

4. Alert

The "Alert" layout displays the field as alert boxes.

5. Badge

You can use this for field type that contains less content like labels, tags, text, calendar or number.

6. Button

This layout is used with the Url field. The field will be converted to clickable button with optional icon.

7. Countdown

Use this layout with the Calendar field. It displays a countdown timer.

8. Comma Separated Values (CSV)

You can use this layout for check boxes field, where multiple values will be displayed as comma separated values.

9. Date

Use this layout with the Calendar field. You can also display the calendar icon before the date.

10. File

Use this layout with the Upload field.

11. Gallery

You can use this layout when the output of the field is name of the folder. It will display image gallery for the images stored in the folder.

12. Image

Use this layout to display the image. The value of the field should be the Url of image.

13. List

This can be used for check boxes or sub form field type.

14. Link List

You can use this layout for sub form field type.

15. Map

You can use this layout for sub form field type.

16. Progress

This can be used with Number field type. This layout displays a progress bar according to the field value.

17. QR Code

You can use this layout to display QR code for the output.

18. Table

You can use this layout with sub form field type. The value is displayed as HTML table.

19. Tabs

This can be used for sub form field type. In the sub form, create two fields. First field will be used as the title of the tab. Second field will be used as the content of the tab.

20. YouTube

This can be used with the Text field type. The output value should contain the YouTube ID.