Dashboards & Visualizations

Adding a picture to a dashboard in XML Source Code

cdson
Explorer

Hello! So I  just have a dashboard for practicing different searches and XML Code, etc (MacOS). and I was trying to include a random static jpg picture in the source code in the beginning of my dashboard. This is what I have in source code based on similar questions here on Splunk Answers:

 

<html>

/*this is where all my styling is for font, size, colors, alignment, etc. for a title and I wanted to include a jpg right after*/

<img src="static/app/search/images/picture.jpg/">

</html>

 

I'm not sure what exact file path to place my jpg or code I would need to get this to work. There are two different answers I found here on Splunk Answers:

 

splunk/etc/apps/search/appserver/static/images/picture.jpg

splunk/apps/search/static/images/picture.jpg

I tried both ways to no avail. (I created the folder 'images')

Labels (2)
0 Karma
1 Solution

gcusello
SplunkTrust
SplunkTrust

Hi @cdson,

you have to put your images in $SPLUNK_HOME/etc/apps/<your_app>appserver/static and then this is the code to add to in a panel of a a Classic Dashboard:

  <row>
    <panel>
      <html>
          <div style="width:100%;height:100%;text-align:center;">
              <img style="height:97px;border;0;" src="/static/app/<app_name>/<image_filename>.png"/>
            </a>
          </div>
        </html>
    </panel>
  </row>

Here you can find information about to do this: https://docs.splunk.com/Documentation/DashApp/0.9.0/DashApp/chartsImage  

Ciao.

Giuseppe

View solution in original post

gcusello
SplunkTrust
SplunkTrust

Hi @cdson,

you have to put your images in $SPLUNK_HOME/etc/apps/<your_app>appserver/static and then this is the code to add to in a panel of a a Classic Dashboard:

  <row>
    <panel>
      <html>
          <div style="width:100%;height:100%;text-align:center;">
              <img style="height:97px;border;0;" src="/static/app/<app_name>/<image_filename>.png"/>
            </a>
          </div>
        </html>
    </panel>
  </row>

Here you can find information about to do this: https://docs.splunk.com/Documentation/DashApp/0.9.0/DashApp/chartsImage  

Ciao.

Giuseppe

Get Updates on the Splunk Community!

Earn a $35 Gift Card for Answering our Splunk Admins & App Developer Survey

Survey for Splunk Admins and App Developers is open now! | Earn a $35 gift card!      Hello there,  Splunk ...

Continuing Innovation & New Integrations Unlock Full Stack Observability For Your ...

You’ve probably heard the latest about AppDynamics joining the Splunk Observability portfolio, deepening our ...

Monitoring Amazon Elastic Kubernetes Service (EKS)

As we’ve seen, integrating Kubernetes environments with Splunk Observability Cloud is a quick and easy way to ...