Dashboard layout

Dashboard layout

When you build a dashboard, decide how to display your panels on the page. Note that, after the chrome and search panels, dashboards use different layoutPanels than search views. So make sure you know whether you're using a dashboard or search template.

Chrome

Dashboard chrome layout panels are ordered similarly to search views:

• messaging
  • Use this layoutPanel for messaging modules.
• appHeader
  • appHeader contains all the overall links for Splunk AccountBar.
• navigationHeader
  • Use this layoutPanel for the AppBar module, which contains all the navigation for the App.
• viewHeader
  • viewHeader is a header panel for your view, where you can put a title for your page.

Searches in dashboards

If you want to include searches in your dashboard, put search modules in the following panels:

• splSearchControls-inline
  • This panel aligns search modules next to each other in columns, with the first module taking up any space the other modules don't.
• mainSearchControls
  • This panel aligns search controls one after another, generally vertically.

Main dashboard layout

Panels after this point are arranged in a coordinate system by setting the layoutPanel param on the parent module in a panel. The coordinate system specifies a row and a column for the panel, such as: layoutPanel=panel_rowX_colY. You can use any number of rows, but you will want to limit yourself to about 3 or 4 columns (2 is standard for displaying data).

For example, here are two parent modules of panels in the tutorial dashboard:

  <module name="HiddenSearch" layoutPanel="panel_row1_col1" group="Messages per minute last hour" autoRun="True">

...

 <module name="HiddenSearch" layoutPanel="panel_row1_col2" group="KBps indexed per hour last 2 hours" autoRun="True">

You can also set up a group of panels within a larger panel, which looks like this:

To set this up, specify one parent module. This example uses StaticContentSample to set a header for the entire group of panels. Each panel then has one parent module which specifies the layoutPanel with the addition of the grp tag for placement within the group.

<module name="StaticContentSample" layoutPanel="panel_row2_col1" group="All Indexed Data" autoRun="True">
  <param name="text">This will show you all of the data you have loaded into index=main over all time.</param>
  <module name="GenericHeader" layoutPanel="panel_row2_col1_grp1">
      <param name="label">Sources</param>
...
  <module name="GenericHeader" layoutPanel="panel_row2_col1_grp2">
    <param name="label">Sourcetypes</param>
...
  <module name="GenericHeader" layoutPanel="panel_row2_col1_grp3">
    <param name="label">Hosts</param>