Dashboards & Visualizations
Highlighted

How to add an image/logo in the background on my dashboard ?

Explorer

I want to add a image/logo in the XML dashboard. The image in the GitHub repository. Please find the image link. Please let me know how can I achieve it.

https://raw.githubusercontent.com/rajapatra/Test/master/bg.jpg

Thanks in Advance.

Labels (1)
Tags (1)
0 Karma
Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Legend

Hi @patra966,
the only way is to modify your CSS.
Ciao.
Giuseppe

0 Karma
Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Ultra Champion

sample:

<form>
  <label>text input with camma</label>
  <row>
    <panel>
      <input type="text" token="clientTransactionId" searchWhenChanged="true" id="webOrder">
        <label>Transaction Id (for multiple use csv's):</label>
        <change>
          <eval token="clientTransactionId_formatted">if(match($clientTransactionId$, ","),replace($clientTransactionId$,","," OR "),$clientTransactionId$)</eval>
        </change>
      </input>
    </panel>
  </row>
  <row>
    <panel>
      <html id="back">
         <style>
           .splunk-textinput
           {
               width: 300px !important;
           }
           label
           {
               width: 300px !important;
           }
           #back
           {
               background-image: url('https://raw.githubusercontent.com/rajapatra/Test/master/bg.jpg')
           }
           </style>
         <p>
          <h2>$clientTransactionId_formatted$</h2>
        </p>
      </html>
    </panel>
  </row>
</form>

https://www.w3schools.com/css/css_background.asp

View solution in original post

Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Explorer

Hi @to4kawa ,

Thanks for information. It is ok if anyone want so the token value with background.
If I have some panels in dashboard with single value and statistics table visualizations, how can implement the image as my background of dashboard.

.dashboard-body{
background-image: url('https://raw.githubusercontent.com/rajapatra/Test/master/bg.jpg');
}
With this query i am getting the part of image in between the small gap.

How can I get it as background of panels also ?

Thanks in Advance.

0 Karma
Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Ultra Champion

use .svg-container class with id

0 Karma
Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Motivator

Hi @to4kawa,

you have 7777 points right now!!

0 Karma
Highlighted

Re: How to add an image/logo in the background on my dashboard ?

Ultra Champion

thank you @PaveIP

7777 I'm so lucky!

0 Karma
Speak Up for Splunk Careers!

We want to better understand the impact Splunk experience and expertise has has on individuals' careers, and help highlight the growing demand for Splunk skills.