Survey Component: Panel

Created:

Sep 13, 2020

Updated:

December 17, 2020



Overview

The Panel is the main page where all other components are placed in. You must have at least one panel in order to create a survey. For each page that is required in the survey, a new panel will need to be added.

‍

Configuration Options

Component Type Displays the type of this component.
Label Enter the name for the panel. This name will be displayed on the top row of the panel. (Optional)
Label Alignment Select the option to left, centre or right justify the label.
Label Font Size Set the size of the label.
Description Enter a description for the label.
Description Alignment Select the option to left, centre or right justify the description.
Description Font Size Set the size of the description.
Assistance Enter the text to be displayed as a help.
Tab Label Enter the name to be displayed for this panel in the Tabs view. (Recommended)
Panel Alignment Select the option to left, centre or right justify all the actions inside the panel.
Vertical Alignment Select Full or Fit content from the dropdown.

Full Is the default setting and will display the full configured height of the panel.)
Fit to Content Will adjust the panel size to based on the information in the panel.

Direction Select Column or Row from the dropdown.

Column Is the default setting and will display the all the components in the panel top to bottom.)
Row Will display the all the components in the panel side by side.

Width Sets the width of all components in the panel. This value can be entered as a % or in pixels (px)

Example: Width can be entered as 50% or as 450px.

Margin Sets the margins around the inside of the panel. The margin can be broken down into 4 sections separated by a space. Each section can be entered as a % or in pixels (px). The 4 sections are the margins for: Top, Right, Bottom, Left.

Example: The margin can be entered as 5% 5% 5% 5% or as 10px 10px 10px 10px.

Save Select save to save the changes made and continue editing.
Save & Close Select save & close to save the changes made and close the survey.
Close Select close to cancel the changes made and close the survey.

Changing the display order of a panel:

When right clicking with the mouse, 2 options will be displayed: Add and Panels
Add Will present the option to either add a new panel, input or action, or just add a new panel, depending if you right clicked on an existing panel or outside any of the panels.
Panels Will list all the names of the panels. When moving the mouse over the panel name there will be the following options:
Select Will bring you to the selected panel.
Move Up Will move the panel up one level by switching places with the panel just above it.
Move Down Will move the panel down one level by switching places with the panel just below it.
Move First *Will move the panel up to be the first one when entering the survey.
Move Last *Will move the panel down to be the one in the survey.

‍

Click Here to Download Linked File



What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.