Dashboards & Visualizations

How to change menu layout

ecoquelin
Explorer

Dear all,

By default (7.2), Splunk displays menu in the app bar.

I wish I could configure this menu. I know many options are already available using XML but I want to go deeper. For example, I would like my menu to appear on a side vertical bar i/o a horizontal bar (as we are all used to). I wish the navigation flow could be different (like this one : https://semantic-ui.com/modules/sidebar.html)

Even if applying some CSS may help, I am looking for a clean solution. I have been through the AppBar.js file provided by Splunk but it looks like it is not recommended to modify it (and there are no clean solution to do so)

If I had any JS function with which I could retreive the list of navigation items, I could generate my own HTML with my own javascript behavior. The only reachable entry point is the REST API to get application navigation configuration but it is XML... http://<host>:<port>/servicesNS/<user>/<app>/data/ui/nav

Can you help ?

0 Karma

paramagurukarth
Builder

Hi Splunk doesn't provide any such options,

If you just want the left nav bar in your dashboards means you can simple add this styles to your dashboard.css file inside /appserver/static of your application

Note: Tried in splunk version 6.4.5. You may have to change the class names in CSS selectors for your versions

/*Selector for top nav bar */
.navbar-splunkbar.shared-splunkbar {
    position: fixed;
    top: 0px;
    width: 100vw;
    z-index: 1;
}
/* Selector for App Nav bar */
.app-bar.shared-appbar {
    position: fixed;
    width: 200px;
    height: 100vh;
    top: 25px;
}
/* Selct for app logo inside nave bar */
h2.app-name.pull-right {
    position: fixed;
    bottom: 10px;
}
/* select individual item in nav */
.app-bar.shared-appbar li.nav-item.shared-appbar-navitem {
    width: 100% !important;
}

/* Main Section boy */
.main-section-body, .dashboard-body{
  margin-left: 200px !important;
  margin-top: 25px !important;
}

dashboard.css will be loaded only to your dashboards..
If you want to apply this style to all your splunk pages like search/dashboards/alerts/etc.. you have to create corresponding custom manager xml (search.xml, reports.xml, alerts.xml...etc) with custom templates

0 Karma

niyaz006
Path Finder

Hey, am having the same issue. Did you happen to do it?

0 Karma
Get Updates on the Splunk Community!

Cloud Platform & Enterprise: Classic Dashboard Export Feature Deprecation

As of Splunk Cloud Platform 9.3.2408 and Splunk Enterprise 9.4, classic dashboard export features are now ...

Explore the Latest Educational Offerings from Splunk (November Releases)

At Splunk Education, we are committed to providing a robust learning experience for all users, regardless of ...

New This Month in Splunk Observability Cloud - Metrics Usage Analytics, Enhanced K8s ...

The latest enhancements across the Splunk Observability portfolio deliver greater flexibility, better data and ...