Designing dashboards with advanced layout

Advanced layout is a flexible dashboard design system that gives you precise control over how tiles, filters, and controls are arranged. With advanced layout, you can:

• Visually group items inside containers to organize related charts, filters, and controls together
• Place filters and controls anywhere on the dashboard, not just the top bar
• Create multi-page dashboards with tabs so viewers can navigate between different views

Enabling advanced layout

Note

Upgrading to advanced layout is permanent and cannot be reverted. We recommend testing on a duplicate of your dashboard first. To duplicate, click File > Duplicate.

Duplicating dashboards requires the Duplicate content permission to be set to On.

Advanced layout is enabled per dashboard. To upgrade an existing dashboard:

Step 1: Open the dashboard in draft mode

Navigate to the dashboard you want to upgrade and click Edit.

Step 2: Enable advanced layout

Click File > Use advanced layout… A confirmation dialog will appear explaining that this is a beta feature.

Step 3: Confirm the upgrade

Click Yes, Upgrade to convert the dashboard to advanced layout. Your existing tiles will be preserved and placed into an initial container.

Containers

Containers are the building blocks of advanced layout. A container is a region on your dashboard that holds items and controls how they are arranged, including:

• Chart tiles (query visualizations)
• Text and markdown tiles
• Filters
• Controls (field switchers, time frame switchers, etc.)
• Other containers (for nested layouts)

Naming containers

Each container can have a name to help you identify it while editing. To rename a container, select it and edit the Name field in the properties panel on the right side of the screen.

Layout types

When you add a container to your dashboard, you choose between two layout types:

Grid

Grid containers give you free-form positioning. Items can be placed at any position and resized by dragging their edges. This is similar to the classic dashboard layout but scoped to a specific area of your dashboard.

Grid layout is best when you want precise control over where each item sits, such as arranging a set of KPI tiles in an exact configuration.

To use a grid container:

1. Click Add > Layout > Grid container
2. Add items to the container (see Adding items to containers)
3. Drag items to position them and drag their edges to resize

Stack

Stack containers arrange items in a single direction, either as a column (top to bottom) or a row (left to right). Items flow automatically and you control spacing and alignment.

Stack layout is best for building structured sections like a row of filters, a column of KPI cards, or a sidebar with controls.

Stack container settings:

• Direction - column (vertical) or row (horizontal)
• Gap - Spacing between items
• Padding - Spacing inside the container edges
• Wrap - Controls whether items wrap to new lines when they exceed the container width (Yes = wrap, No = nowrap)
• Align - How items align perpendicular to the direction (start, center, end, stretch)
• Justify - How items are distributed along the direction (start, center, end, space between)

To use a stack container:

1. Click Add > Layout > Stack container
2. Add items to the container
3. Configure direction, gap, and alignment in the properties panel

Tip

You can nest containers inside each other. For example, place a stack container (set to row direction) inside a grid container to create a horizontal row of filters within a larger free-form layout.

Resizing items in stack containers

Note

Resize handles are currently only available for items in column stacks. Row stacks do not support manual resizing yet.

Items within column stack containers can be resized by dragging resize handles, similar to resizing items in grid containers. This allows you to set specific dimensions for individual items while maintaining the automatic flow of the stack layout.

1. Select the item you want to resize
2. Resize handles will appear around the selected item
3. Drag a resize handle to adjust the item’s dimensions
4. Release to apply the new size

Resized items are sized in pixel values with a minimum size of 12px. Changes are previewed live as you drag and committed when you release the mouse.

Removing custom sizing

Right-click the item and select Reset sizing from the context menu. This removes all explicit sizing properties (width, height, and min/max constraints) and returns the item to its default automatic size.

Adding items to your dashboard

Use the Add button in the toolbar to add tiles and layout items to your dashboard:

• Charts - Add visualizations from your workbook queries
• Text - Add formatted text using Markdown
• Filter - Add interactive filters to control chart data
• Control - Add field controls to dynamically switch chart fields
• Layout submenu - Organize dashboard content with layout containers:
  • Grid container - Create a container with grid layout for flexible positioning
  • Stack container - Create a container with stack layout for linear arrangement
  • Page navigation - Add navigation between multiple dashboard pages (available only when your dashboard has multiple pages). Page navigation is automatically added when you create a second page, but you can use this option to add additional navigation or customize placement
• Page - Add a new page to your dashboard (available only from the toolbar Add button)

When adding elements from the properties panel using the Add child button, the Page option will not be available since pages are top-level elements.

Undoing and redoing layout changes

Note

Only layout changes can be undone. This includes actions like adding, moving, or resizing containers and tiles, or adjusting container properties.

When editing an advanced layout dashboard, you can undo and redo layout changes using the Edit menu, toolbar buttons, or keyboard shortcuts:

• Edit menu - Click Edit > Undo or Edit > Redo
• Toolbar - Click the (undo) or (redo) icons in the editing toolbar
• Keyboard shortcuts - Press ⌘Z (Mac) or Ctrl+Z (Windows) to undo, ⇧⌘Z (Mac) or ⇧Ctrl+Z (Windows) to redo

History clearing

Your undo/redo history is automatically cleared when you make non-layout changes to the dashboard, such as:

• Renaming the dashboard or tiles
• Editing filter configurations
• Updating query definitions
• Changing dashboard settings

After a non-layout change, you won’t be able to undo past that point. This ensures that layout changes and content changes remain independent and prevents conflicts between different types of edits.

Browsing items in the catalog

The catalog is a browsable library of all available items on your dashboard. Click the Catalog button in the toolbar to open it.

The catalog displays items in three groups:

• Controls & filters - All dashboard filters and controls, sorted alphabetically
• Queries - Chart tiles and query visualizations
• Text - Text and markdown tiles

Use the search field at the top of the catalog to filter items by name. To place an item, click it in the catalog and then select the target container from the menu that appears.

The catalog is useful for finding items that haven’t been placed yet or for quickly moving items into a specific container without selecting them on the canvas first.

Note

New queries added to the workbook are automatically placed on the first page. If a query has been deleted, use the catalog to find and re-add it to the dashboard.

Adding items to containers

There are several ways to place items into a container:

From the catalog

1. Click the Catalog button in the toolbar
2. Find the item you want to place (use search to filter by name)
3. Click the item
4. Select the target container from the placement menu

Using the properties panel

1. Select the item you want to place on the canvas (a chart tile, filter, or control)
2. In the properties panel on the right, click Place (for unplaced items) or Move (for items already in a container)
3. A menu will appear showing all available containers
4. Click the target container to move the item there

Drag and drop

You can drag items to reposition them within a container or move them between containers. This works for both grid and stack containers.

• Within a grid container - Drag items to any position and resize by dragging their edges
• Within a stack container - Drag items up or down (in column direction) or left and right (in row direction) to reorder them within the stack
• Between containers - Drag items from one container to another, regardless of whether they are grid or stack containers. This lets you quickly reorganize your dashboard layout without using the catalog or properties panel.

While dragging, JustAsk provides visual cues to help you place items:

• Containers that can accept the item show a colored outline when you hover over them
• Stack containers show a drop indicator line at the insertion point where the item will be placed
• The container you’re dragging from shows an outline to indicate the active drag operation

Unplaced items

New queries are automatically placed on the first page, items removed can be manually re-added using the catalog.

Editing charts

When you select a chart tile on an advanced layout dashboard, the properties panel will show chart settings inline, allowing you to edit visualization configuration without leaving the layout editor.

Editing chart configuration

To change the chart’s configuration, click the chart and then click the Edit button that displays in the properties panel:

In the properties panel, you can edit the chart’s:

• Title, subtitle, and description
• Visualization type
• Visualization settings such as colors, axes, stacking, and other display options

Changes are saved automatically as you work.

Editing in the workbook

For more advanced editing capabilities, click the icon (next to the icon) in the top right corner of the properties panel. This opens the chart in the workbook where you have full configuration options for the visualization.

Pages

Advanced layout dashboards can have multiple pages, creating a tabbed experience for viewers.

Adding pages

To add a new page, click Add > Page. Each new page starts with an empty layout where you can add containers and items. Dashboards can have up to 15 pages.

When you add a second page to a dashboard (going from 1 to 2 pages), JustAsk automatically adds page navigation to both pages so viewers can switch between them. If you add additional pages beyond the second, JustAsk copies the page navigation appearance from the previous page to maintain a consistent experience across your dashboard.

Note

Adding a page and its navigation happens as a single action. If you undo immediately after adding a page, both the page and its navigation will be removed together.

Duplicating pages

Duplicate existing pages in a dashboard to quickly create new pages with the same layout, containers, and content.

1. Click the Edit button on the dashboard to enter draft mode.
2. Select the page you want to duplicate.
3. In the container properties panel, click Duplicate page.

The new page will appear immediately after the original page in the dashboard navigation. JustAsk automatically generates a unique name for the duplicated page by appending Copy to the original page name. For example, Dashboard Copy or Dashboard Copy 2.

If the dashboard is going from 1 to 2 pages and the original page doesn’t have page navigation, JustAsk will automatically add page navigation to both pages. If duplicating in a dashboard that already has multiple pages, the page navigation from the original page is included in the duplicate.

Advanced page settings

To access page settings:

Step 1

Select the page you want to configure by clicking on it or using the page selector in the toolbar.

Step 2

With the page selected, click the icon in the properties panel.

Step 3

Select Advanced settings from the menu.

The Advanced settings dialog will open, where you can configure the following:

• Key - A unique identifier for the page. Keys must:

  • Be unique across all pages in the dashboard
  • Contain only letters, numbers, hyphens, and underscores
  • Not exceed 40 characters
  • Not be one of JustAsk’s reserved system values: chat, download, drill, edit, layout, monitor, move, performance, preview, publish, run, save-as, schedules, share, themes, transfer

  If you enter an empty value, invalid format, or a key that’s already used by another page, you’ll see a validation error and won’t be able to save until the issue is resolved.

Switching between pages

While editing, use the page selector in the toolbar to switch between pages. Click the dropdown to see all pages and select the one you want to work on.

Reordering pages

1. Open the page selector dropdown
2. Click Re-order
3. Drag pages into the desired order
4. Save your changes

Page navigation for viewers

When you create a multipage dashboard, JustAsk automatically adds page navigation to let viewers switch between pages. The page navigation widget renders as an inline page switcher that viewers can interact with.

Page navigation is automatically added when:

• You add a second page - When you add a second page to a dashboard, page navigation is automatically added to both pages
• You add subsequent pages - When you add a third or later page, the new page automatically receives page navigation matching the appearance of the previous page’s navigation
• You duplicate pages - When you duplicate a page in a multipage dashboard, the page navigation is included in the duplication

Customizing page navigation

You can manually add or customize page navigation at any time. To manually add page navigation to a page, click Add > Layout > Page navigation, then place it in a container where you want the page tabs to appear. This is useful if you want to:

• Add additional page navigation widgets (for example, at both the top and bottom of a page)
• Customize the appearance or positioning of the auto-added navigation
• Add page navigation to a page that doesn’t have it

Once added, page switchers offer rich editing capabilities to customize how viewers navigate between pages.

Editing individual tabs

Each tab in a page switcher can be edited through a popover interface that provides access to labeling, linking, and configuration options.

To edit a tab:

Step 1: Select the page navigation item

Click the page navigation widget on your dashboard to select it.

Step 2: Open the edit popover

Click the Edit page button on any tab to open its configuration popover.

Step 3: Configure tab settings

In the popover, you can:

• Change the tab label (connected or custom)
• Select which page the tab links to
• Configure custom URL options (if applicable)
• Remove the tab from the switcher

Reordering tabs

Tabs can be reordered using drag-and-drop to match your preferred navigation flow.

To reorder tabs:

1. Select the page navigation widget
2. Click and drag any tab to a new position
3. Release to place the tab in its new location

The new order persists and will be visible to all dashboard viewers.

Relabeling tabs

Tab labels can be managed in two modes: connected and disconnected.

Connected labels are linked to the page name. When you edit a connected label:

• The page itself is renamed
• Every tab pointing to that page (across all page switchers) updates to reflect the new name
• This ensures consistency when multiple tabs link to the same page

Disconnected labels are custom text independent of the page name. When you disconnect a label:

• The label becomes editable text that doesn’t track the page
• You can use custom names like “Overview” or “Details” that differ from the actual page name
• The page name remains unchanged

To relabel a tab:

Step 1: Open the edit popover

Click Edit page on the tab you want to relabel.

Step 2: Edit the label

• For connected mode (default): Type in the Label field. This will rename the page and update all tabs linked to it.
  • To use a custom label: Click the link toggle icon to disconnect the label, then type your custom text. The page name will remain unchanged.

Step 3: Save your changes

The label updates automatically as you type.

Note

Use connected labels when you want consistent naming across your dashboard. Use disconnected labels when you need multiple tabs pointing to the same page with different labels (for example, “Summary” and “Details” both linking to the same overview page).

Adding tabs

The add menu lets you include existing pages, create new pages, or add custom URL tabs to your page switcher.

To add a tab:

Step 1: Select the page navigation widget

Click the page navigation widget to select it.

Step 2: Open the add menu

Click the Add button (+ icon) in the page switcher.

Step 3: Choose what to add

Select from the available options:

• Existing page - Choose any page from your dashboard. Pages already in the switcher will be disabled with a tooltip.
• New page - Create a new page and add it to the switcher in one step.
• Custom URL - Add a tab that navigates to an internal path or external URL.

Removing tabs

Tabs can be removed from the page switcher without deleting the underlying page.

To remove a tab:

1. Select the page navigation widget
2. Click Edit page on the tab you want to remove
3. In the edit popover, click Remove

The page remains in your dashboard and can be re-added to the switcher at any time using the add menu.

Custom URL tabs

Custom URL tabs let you add navigation to internal dashboard paths or external resources directly from your page switcher.

Supported URLs:

• Internal paths (e.g., /dashboard/reports)
• External URLs with http:// or https://
• Email links with mailto:
• Relative paths and anchor links

Restricted URLs: For security, javascript: and data: URLs are not permitted and will be rejected.

To add a custom URL tab:

Step 1: Open the add menu

Select the page navigation widget and click the Add button (+).

Step 2: Select Custom URL

Click Custom URL from the add menu.

Step 3: Configure the URL tab

In the edit popover, configure:

• Label - Enter the display text for the tab (automatically in disconnected mode)
• URL - Enter the destination URL
• Target - Choose how the URL opens:
  • Same tab - Navigate in the current browser tab (default)
  • New tab - Open in a new browser tab
  • Custom - Specify a custom window name for advanced window management
• Forward params (optional) - Toggle on to append the current URL’s query string to the destination URL. This is useful for carrying over filter values or other parameters.

Note

The Forward params option only appends query parameters when the destination URL is same-origin (same domain). This prevents leaking filter or token state to external sites.

Linking multiple tabs to the same page

Page switchers support multiple tabs pointing to the same page, each with its own label. This is useful when you want to provide different entry points or contexts for the same content.

For example, you might have:

• “Overview” and “Summary” tabs both linking to your main dashboard page
• Multiple entry points labeled for different user roles or workflows

To create duplicate page tabs:

1. Add a tab for the page using the add menu
2. Add another tab and select the same page
3. Use disconnected labels to give each tab a distinct name

Each tab maintains its own identity and can be edited, reordered, or removed independently.

Automatic page syncing

When you add new pages to your dashboard, they automatically appear in all customized page switchers. This ensures that viewers always have access to newly created pages without requiring manual updates to each switcher.

How it works:

• Adding a new page (via Add > Page or page duplication) automatically appends a tab for it to every existing customized page switcher
• Default (All-mode) switchers already show all pages automatically and are not affected
• Empty switchers remain empty
• The new page tab is added at the end of each switcher’s tab list

This behavior maintains consistency across your dashboard and reduces the need to manually synchronize navigation widgets when your dashboard grows.

Filters

Advanced layout filters support additional display options beyond the standard dashboard filters.

Displaying single select options as buttons

Note

This section only applies to string filters.

Single selection string filters can be displayed as a row of buttons that users can click to select. This provides a more visual, accessible way to switch between options.

Single selection button options can be displayed in two ways:

Inline

Displays inline with the dashboard content

Popover

Opens in an overlay when clicked

Filters must be in a container to use button options. When a filter option is clicked, the queries connected to the filter will update.

By default, up to the first 50 values for the filter column are used as options. You can customize which values are included using the Values setting described below.

Button options work best with a small number of choices, typically between two and seven.

To configure a string filter for single selection:

Step 1: Add and configure the filter

1. Open a dashboard and enter draft mode by clicking Edit. 2. Click Add > Filter to add a new filter. 3. Configure the filter, clicking Done when finished.

Step 2: Move the filter into a container

Next, you’ll move the filter into a dashboard container. This is required to access the filter’s single selection options.

1. At the top of the dashboard, click Catalog, then the filter. This will open the filter’s properties panel on the right side of the page.

2. In the filter properties panel, click Move.

3. In the dropdown, select the container you want to move the filter to:

   

Step 3: Configure single selection options

1. If the filter properties panel is no longer open, click the filter to open it. 2. Configure the following fields:

   • Filter type - Set to Single selection
   • Filter control - Set to Button toggle
   • Filter display - Select Inline or Popover
   • Values - Define the options you want to include in the filter display:
     • All values - Default. Up to the first 50 values for the filter column will display.
     • Select exact values - Choose specific values to include. After selecting this option, a value picker will appear where you can check the values you want.

Displaying multiple selection options as dropdowns

Note

This section only applies to string filters.

String filters can be configured to allow multiple value selection using a dropdown interface. This allows users to select several options at once, making it easy to filter data across multiple categories simultaneously.

Multiple selection dropdowns always display inline with the dashboard content and provide a clear view of all selected values.

To configure a string filter for multiple selection:

Step 1: Add and configure the filter

1. Open a dashboard and enter draft mode by clicking Edit. 2. Click Add > Filter to add a new filter. 3. Configure the filter, clicking Done when finished.

Step 2: Configure multiple selection options

1. If the filter properties panel is no longer open, click the filter to open it. 2. Configure the following fields:

   • Filter type - Set to Multiple selection
   • Filter control - Set to Dropdown. This is currently the only supported control type for multiple selection.
   • The filter will automatically display inline with your dashboard content.

Date filter display options

When working with date filters, you can choose how the filter interface appears to users:

• Default - The standard date filter interface with range selection and preset options:

  

• Single day - A simplified calendar interface that allows users to select a specific day. This is useful when you want to focus dashboard viewers on analyzing data for one date at a time, such as daily reports or date-specific snapshots.

  

After you create the filter, use the Filter type setting to choose a display option.

Timeframe filter control

Note

This section only applies to date filters.

The timeframe filter control provides a user-friendly way to filter data by common time periods. Instead of selecting exact dates, users can choose from preset options like “Last 7 days” or “Last 30 days”, and optionally define custom date ranges when needed.

This control is useful when your dashboard viewers need to quickly switch between common time windows without navigating a full date picker interface.

Configuring timeframe filters

To configure a date filter to use the timeframe control:

Step 1: Add and configure the filter

1. Open a dashboard and enter draft mode by clicking Edit. 2. Click Add > Filter to add a new filter. 3. Configure the filter with a date field, clicking Done when finished.

Step 2: Set the filter control type

1. If the filter properties panel is no longer open, click the filter to open it. 2. Set Filter control to Timeframe.

Step 3: Select preset options

Choose which timeframe options to make available to users. You can select from JustAsk’s preset options or create custom timeframes. The selected options will appear as choices in the filter control.

Step 4: Enable custom timeframe (optional)

Toggle Allow custom timeframe to let users define their own date range when the preset options don’t meet their needs.

When enabled, a custom option appears in the filter. Selecting it will open a custom date range picker.

Limitations

Advanced layout is in open beta and has the following limitations:

• Scheduled deliveries and downloads only render the first page during the beta period. If the dashboard has multiple pages, we will render the first one. Multi-page exports are in development and will be available soon.
• Maximum 15 pages per dashboard.
• Upgrading is permanent. Once a dashboard is upgraded to advanced layout, it cannot be reverted to the classic layout.