- Splunk Answers
- :
- Using Splunk
- :
- Dashboards & Visualizations
- :
- adding css to dashboard crashed dashboard
- Subscribe to RSS Feed
- Mark Topic as New
- Mark Topic as Read
- Float this Topic for Current User
- Bookmark Topic
- Subscribe to Topic
- Mute Topic
- Printer Friendly Page
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Hi,
I added a bit of css to my dashboard in simple xml
<html>
<head>
<style type="text/css">
.my-list ul {
list-style-position: inside;
}
</style>
</head>
</html>
everytime I save the dashboard and refresh, it cannot load again, remains on the Loading ... grey screen.
any idea why?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I use something like this to change the size of my panels. This only works at a panel level but I had no issue having my dashboard reload when I used it. Maybe it will help get you closer?
<panel depends="$alwaysHideCSS$">
<html>
<style>
.my-list ul {
list-style-position: inside;
}
</style>
stuff down here for the html in the panel
</html>
</panel>
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I use something like this to change the size of my panels. This only works at a panel level but I had no issue having my dashboard reload when I used it. Maybe it will help get you closer?
<panel depends="$alwaysHideCSS$">
<html>
<style>
.my-list ul {
list-style-position: inside;
}
</style>
stuff down here for the html in the panel
</html>
</panel>
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I'm constantly seeing depends="$alwaysHideCSS" and depends="$hiddenForCSS$" .
Can someone please explain this and provide some splunk / css documentation on it?
Plus when you use .my-list ul {}, does that not require you to define the token / identifier using class keyword.
As per CSS documentation when using CSS, if using # as selector, we need to define the id field correct?
and the . as selector needs class keyword to be defined ?
Can someone explain ?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Put the CSS into a separate file and reference it from the simple xml (example taken from Wallboard dashboard in "Scalable Vector Graphics - Custom Visualization" app)
<dashboard stylesheet="svg:white_background.css" hideChrome="true" hideTitle="true">
<label>Wallboard</label>
<description>Dashboard designed to be displayed on large TVs</description>
...
...
https://docs.splunk.com/Documentation/Splunk/7.0.3/AdvancedDev/UseCSS covers the specifics
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I actually cant add custom css files. my organization is very big and I dont have the privileges to add files.
thanks!
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I think you can't add this to the simple XML as it is not supported.
You would have to convert your dashboard to a HTML view first.
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
I dont want to convert it. is there any other way to add css?
- Mark as New
- Bookmark Message
- Subscribe to Message
- Mute Message
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Check answers below, I would put CSS in a separate file. @msivill has linked the relevant docs.
Introducing the 2024 SplunkTrust!
Introducing the 2024 Splunk MVPs!
Splunk Custom Visualizations App End of Life
