Dashboard Pages allows you to create, organise, and navigate through multiple pages within a single dashboard
Dashboard Pages supports multiple pages in a single dashboard. This feature is highly flexible, allowing users to:
- Add, remove, duplicate, or reorder pages.
- Toggle pages in both edit and view modes.
- Customise navigation components such as page controls, navigation styles, and page arrangements.
Adding, Removing, and Managing Pages
Adding and Removing Pages
- Use the dropdown menu to add, remove, or duplicate pages.
Reordering Pages
- Reorder pages using the dropdown menu, where you can push pages forward or backward within the order.
Navigating Between Pages
In view mode, the dashboard offers multiple ways to navigate:
- Forward/Back buttons: Allows users to cycle through pages one by one.
- Dropdown list: Displays a list of all pages, enabling quick access to any page.
- Your custom navigation: Use your custom navigation items to move through your dashboard.
In edit mode, you can navigate by using:
- Forward/Back Buttons: Allows users to cycle through pages one by one.
- Edit different page: If you have a large number of pages, it may be easier to navigate these via a drop down.
Customising Dashboard Navigation
Navigation Configuration Modal
- In order to enable custom navigation, access the Dashboard pages navigation modal from the edit dropdown.
-
In the Settings tab, toggle Customise navigation ON to enable navigation customisation. You can then decide if Default Page Controls will be visible for viewers.
- When Default Page Controls are enabled, these will be shown at all times as well as your custom navigation bar.
Changing Page Titles
You can modify the titles of the dashboard pages that appear in navigation and choose whether to show or hide each page.
- To change the name of a page, access the Pages tab in the Dashboard pages navigation modal.
-
Enter the new titles for the pages and use the toggle to show or hide them in the navigation.
Custom Navigation Positioning
Users can choose to enable a customisable navigation bar. This navigation can be positioned by selecting an option in the Settings tab from:
- Top: Positioned at the top of the dashboard.
- Sticky: Remains at the top and scrolls with the content.
- Custom HTML: Placed in a specific location on your dashboard by copying an HTML block to each page.
- Click Copy HTML to obtain the basic HTML structure shown below. Paste the code into a HTML block on each page. Remember, the code block must be included on every page of your dashboard to maintain consistent access to custom navigation across all pages. Do not change the contents of the code block.
-
<div id="seer-dash-nav-custom-position"></div>
Navigation Customisations
In the Customisations tab, you can set options for layout, alignment, padding, font settings, and image options for each of your navigation items.
Image-Based Links
Navigation links can be customised with images for both default and hover/active states. Uploaded images will replace the current settings, and if the images are removed, the original customisations will be reinstated.
Image sizing
- Setting a default width and height will override the native image sizing and ensure all navigation images are sized consistently
- Setting a percentage (%) width will limit the size of the image relative to the size of the screen
- Setting a maximum pixel (px) width prevents oversized images when using % width
