In the Layout perspective, you can design the layout of your dashboard from scratch or by using a CDE template. While defining the layout you can apply styles and add HTML elements as text or images.
Use the Layout Structure toolbar in the top left of the window to add and delete rows, columns, HTML blocks, and images in your dashboard. To move elements around, drag and drop them within the Layout perspective. You can also add resource files (JS or CSS) or snippets.
| Icon | Icon Name | Description |
|---|---|---|
 |
Save as Template | Select to save the dashboard as a template which can be applied to other dashboards. The generated template can contain just the layout structure or may include components and data sources. |
 |
Apply Template | Select to apply a template to a dashboard. You can select from a list of pre-defined templates or use a template you created. |
 |
Add Resource | Select to add CSS or JavaScript resources to the dashboard. These can be snippets, which will be included in the dashboard’s HTML as inline code, or external files, which are loaded with the dashboard’s HTML. |
 |
Add Bootstrap Panel | Select to add a Bootstrap panel to the dashboard layout. The Bootstrap panel contains a panel header, panel body and panel footer. |
 |
Add FreeForm | Select to add an HTML free-form component to the dashboard. This is a
user-defined HTML tag with user-defined CSS classes and user-defined attributes. For
example, you can have a tag such as the
following:<div id="elementName" class="customClass" title="customTitle"></div>This element can then receive other elements, providing limitless custom nesting potential, and you can view it easily in the layout structure, which is not always possible with an HTML element. |
 |
Add Row | Select to add a row to the dashboard. |
 |
Add Column | Select to add a column to the dashboard. |
 |
Add Space | Select to add a separator to the dashboard. Optimally used between rows to add a space. |
 |
Add Image | Select to add an image to the dashboard. Note that images are typically added via CSS instead of through the Add Image button. |
 |
Add Html | Select to add inline HTML code to the dashboard, such as text. Note that an HTML element can only be added to a column, not a row. |
 |
Duplicate Layout Element | Select to duplicate a dashboard section as laid out in the Editor |
 |
Delete | Select to delete a dashboard section as laid out in the Editor. |
As you build the layout you will see the structure of nested rows and columns below the left toolbar in the Layout Structure panel. As you select one of the elements on the layout structure, the Properties panel on the right is updated. Here you can configure the element to your specifications.
