Dashboards & Visualizations

CSS File Upload Help

alan20854
Path Finder

I am trying to upload a CSS file to style a dashboard in Search and Reporting. I looked at the documentation, and it says to use this directory path: $SPLUNK_HOME/etc/apps/search/appserver/static

Where do I navigate to to do this/how do I use that directory path?

Tags (3)
0 Karma
1 Solution

Raghav2384
Motivator

Hello @alan20854

Docs are referring to the OS path where splunk is installed. Here's a common directory structure

On Linux: /opt/splunk is typically you SPlunk Home Path or popularly called as $SPLUNK-HOME

On Windows: C:\Program Files\Splunk is you Splunk Home unless installed in a different directory.

Now, As you know, everything you see on SPlunk GUI is an app. (Example: search app, launcher app etc). If you want to use the cosmetics of css for a particular app, log on to the box where splunk is installed, navigate to the Splunk path. I will pick linux

cd /opt/splunk/etc/apps/search/appserver/static/ and drop all your fancy images or css files here. Please note, you should have os access to add this css file.Also, a restart of splunkd is required for the changes to take effect (For the first time i beleive).

OR, If css is not huge and simple, you can use inline by editing the simple xml, adding like this

<panel>
      <html>
        <style type="text/css">

          .single-value .single-result {
     font-size: 30px !important;
 }
         .single-value:before {
    font-family: "Splunk Icons";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    font-size: 30px;

}
        </style>
</html>
</panel>

Hope this helps

Thanks,
Raghav

View solution in original post

Raghav2384
Motivator

Hello @alan20854

Docs are referring to the OS path where splunk is installed. Here's a common directory structure

On Linux: /opt/splunk is typically you SPlunk Home Path or popularly called as $SPLUNK-HOME

On Windows: C:\Program Files\Splunk is you Splunk Home unless installed in a different directory.

Now, As you know, everything you see on SPlunk GUI is an app. (Example: search app, launcher app etc). If you want to use the cosmetics of css for a particular app, log on to the box where splunk is installed, navigate to the Splunk path. I will pick linux

cd /opt/splunk/etc/apps/search/appserver/static/ and drop all your fancy images or css files here. Please note, you should have os access to add this css file.Also, a restart of splunkd is required for the changes to take effect (For the first time i beleive).

OR, If css is not huge and simple, you can use inline by editing the simple xml, adding like this

<panel>
      <html>
        <style type="text/css">

          .single-value .single-result {
     font-size: 30px !important;
 }
         .single-value:before {
    font-family: "Splunk Icons";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    font-size: 30px;

}
        </style>
</html>
</panel>

Hope this helps

Thanks,
Raghav

Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

March 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...