Dashboards & Visualizations

Displaying the links in a tabular format on a main dashboard

mrkhan48
Path Finder

Hi I have created a main dashboard which has hyperlinks to external links and they are currently displayed as-

(bullet point) link1

(bullet point) link2

and so on.

I was them to displayed without a bullet point and in below format-

 

XYZ View:

link1             link2                   link3                              link4

link5            link6                   link7                              link8

Also, I want a background color for XYZ View title.

How do I achieve this? Could you please provide me a link to appropriate reference material which I can go through to sort this out? Or if you could help me achieve this please.

 

Many Thanks

Labels (1)
0 Karma
1 Solution

ITWhisperer
SplunkTrust
SplunkTrust

It seems this is just HTML? Try something like this:

  <row>
    <panel>
      <html>
        <style>
          .container {
display: flex;
flex-direction: row ;
margin-left: 0!important;
margin-right: 0!important;
background-color: lightgrey;
text-align: center;
}

.field {
padding: 20px;
border: 1px solid #ccc;
}
        </style>
        <div class="container">
          <div class="field">
<li>
<a href="https://abc.xyz.com/" style="color:#008080;">ABC </a>
</li> </div>
<div class="field">
<li>
<a href="https://xxx.yyy.zzz" style="color:#008080;">XYZ</a>
</li>
</div>
        </div>
      </html>
    </panel>
  </row>

Which renders like this

ITWhisperer_0-1756212924240.png

 

View solution in original post

0 Karma

livehybrid
SplunkTrust
SplunkTrust

Hi @mrkhan48 

Are these links coming from events? How are they currently generated? Is this a classic or dashboard studio dashboard?

🌟 Did this answer help you? If so, please consider:

  • Adding karma to show it was useful
  • Marking it as the solution if it resolved your issue
  • Commenting if you need any clarification

Your feedback encourages the volunteers in this community to continue contributing

0 Karma

mrkhan48
Path Finder

 @livehybrid  @ITWhisperer  Thank you both for taking a look at my post. Sorry I should have been more clear.

I am trying to place external hyperlinks on main dashboard. For example, I have a various web based applications which my team use frequently and I want to create a one view using the splunk dashboard for all the external links. They are not generated through events.

I tried using containers as below-

.container {
display: flex;
flex-direction: row ;
margin-left: 0!important;
margin-right: 0!important;
background-color: lightgrey;
text-align: center;
}

.field {
padding: 20px;
border: 1px solid #ccc;
}

 <div class="field">
<li>
<a href="https://abc.xyz.com/" style="color:#008080;">ABC </a>
</li> </div>
<div class="field">
<li>
<a href="https://xxx.yyy.zzz" style="color:#008080;">XYZ</a>
</li>
</div>

 

Using this external links are displayed as below-

ABC              XYZ                                   --> (In one row, space separated)

  I am struggling to left align them so I thought of posting here to see if there is a better/simpler way of doing it.

I am not HTML/Splunk expert, just a beginner.

 

Thanks again for your time and advice.

 

Regards

0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

It seems this is just HTML? Try something like this:

  <row>
    <panel>
      <html>
        <style>
          .container {
display: flex;
flex-direction: row ;
margin-left: 0!important;
margin-right: 0!important;
background-color: lightgrey;
text-align: center;
}

.field {
padding: 20px;
border: 1px solid #ccc;
}
        </style>
        <div class="container">
          <div class="field">
<li>
<a href="https://abc.xyz.com/" style="color:#008080;">ABC </a>
</li> </div>
<div class="field">
<li>
<a href="https://xxx.yyy.zzz" style="color:#008080;">XYZ</a>
</li>
</div>
        </div>
      </html>
    </panel>
  </row>

Which renders like this

ITWhisperer_0-1756212924240.png

 

0 Karma

mrkhan48
Path Finder

Thank  you, that's exactly what I had. Have a nice day!

0 Karma

mrkhan48
Path Finder

typo in above *I want them to be displayed as below-

XYZ View:

link1             link2                   link3                              link4

link5            link6                   link7                              link8

Also, I want a background color for XYZ View title.

0 Karma

ITWhisperer
SplunkTrust
SplunkTrust

It is not clear what you are dealing with. Do you have just 8 events with a single field that you want in 2 rows of 4 values?

Please share some sample event (anonymised of course), and the search that you currently are using. Please also share your current dashboard source.

0 Karma
Get Updates on the Splunk Community!

.conf25 Community Recap

Hello Splunkers, And just like that, .conf25 is in the books! What an incredible few days — full of learning, ...

Splunk App Developers | .conf25 Recap & What’s Next

If you stopped by the Builder Bar at .conf25 this year, thank you! The retro tech beer garden vibes were ...

Congratulations to the 2025-2026 SplunkTrust!

Hello, Splunk Community! We are beyond thrilled to announce our newest group of SplunkTrust members!  The ...