Dashboards & Visualizations

How to load Javascript & CSS in Splunk to build a dashboard?

IRHM73
Motivator

Hi,

I wonder whether someone may be able to help me please.

I want to build a TagCLoud dashboard which I know will require the use of Javascript & CSS files for which I have a copy of both from the tutorials.

I just wondered whether someone may be able to provide just a simple step by step guide how to load both the js and css into Splunk and how I can edit these whilst in Splunk.

You can probably tell I'm new to Splunk having only had this a couple of weeks, and the Splunk guidance I've read doesn't really help from a beginners perspective.

Many thanks and kind regards

Chris

Tags (3)
1 Solution

jeffland
SplunkTrust
SplunkTrust

You'll have to create a place in your app for them, appname/appserver/static, and place the files there. Then you edit the Simple XML of your dashboard so that the dashboard tag (or, if your dashboard contains inputs, the form tag) includes a reference to these files, i.e.

<dashboard script="code.js" stylesheet="styles.css">
  ...

As with all newly created files, splunk only picks them up at a start, so you'll have to restart your splunk after you put your files into appserver/static before you can make use of them in XML.

After that, the usual procedure is to add a div in a html tag which you grab in js and do everything after that there. I'd recommend you just do it to learn how it works, you could start with this tutorial and also follow the how-tos on the right on that page, starting with this one.

View solution in original post

jeffland
SplunkTrust
SplunkTrust

You'll have to create a place in your app for them, appname/appserver/static, and place the files there. Then you edit the Simple XML of your dashboard so that the dashboard tag (or, if your dashboard contains inputs, the form tag) includes a reference to these files, i.e.

<dashboard script="code.js" stylesheet="styles.css">
  ...

As with all newly created files, splunk only picks them up at a start, so you'll have to restart your splunk after you put your files into appserver/static before you can make use of them in XML.

After that, the usual procedure is to add a div in a html tag which you grab in js and do everything after that there. I'd recommend you just do it to learn how it works, you could start with this tutorial and also follow the how-tos on the right on that page, starting with this one.

joao_amorim
Communicator

Hi @jeffland do you know if it's possible to create other dirs inside static and place the files there?
Instead of the files being at appname/appserver/static, could they be at appname/appserver/static/xpto/example/file.js.

Thanks in advance,
João Amorim

0 Karma

jeffland
SplunkTrust
SplunkTrust

As far as I know that's not possible with the procedure described in the answer above. But you can certainly place a .js file in that main directory which then loads a number of other files from subfolders with require.

0 Karma

joao_amorim
Communicator

Thank you!

0 Karma

IRHM73
Motivator

Hi @jeffland, many thanks and kind regards

Chris

0 Karma
Got questions? Get answers!

Join the Splunk Community Slack to learn, troubleshoot, and make connections with fellow Splunk practitioners in real time!

Meet up IRL or virtually!

Join Splunk User Groups to connect and learn in-person by region or remotely by topic or industry.

Get Updates on the Splunk Community!

May 2026 Splunk Expert Sessions: Security & Observability

Level Up Your Operations: May 2026 Splunk Expert Sessions Whether you are refining your security posture or ...

Network to App: Observability Unlocked [May & June Series]

In today’s digital landscape, your environment is no longer confined to the data center. It spans complex ...

SPL2 Deep Dives, AppDynamics Integrations, SAML Made Simple and Much More on Splunk ...

Splunk Lantern is Splunk’s customer success center that provides practical guidance from Splunk experts on key ...