Network Management

Add a image to the node details page with variables

How to add an image on the node details page using the will load the image for each individual device based on a variable.

First published date

10/23/2018 7:58 PM

Last published date

10/23/2018 7:58 PM

Overview

How to add an image to the node details page using the Custom HTML widget.

Product section

Network Performance Monitor

Resolution

Web URL method:
This method is for linking a web based URL. 
  1. Log on to the Orion Web Console and go to the page or view.
  2. Click Customize Page on the upper right side.
  3. Click Expand (+) in the target column to add a resource.
  4. Enter Custom HTML in the Search field, select and submit.
  5. Back to the Customize Page, click Submit to save the changes.
  6. Go to the Custom HTML resource and click Edit.
  7. Enter your custom HTML.
1 <html>
2  <body>
3   <img src="Web URL goes here"  width="440px" height="440px">
4  </body>
5 </html>


Working example from webURL:

<html>
<body>
 <img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAkGBxIQEBUQEhIVFRUQFQ8VEBUVFQ8PFQ8PFRUWFhUVFRUYHSggGBolGxUVITKh6kSxEIo//Z"  width="440px" height="440px">
</body>
</html>

Note: This is a standard HTML web link no different than if you were coding your own website. Web link in working example was shortened to make it easier to read. 


Local volume method:
This method is for linking an image directly on the users server.

This method is the same except for the way the image is linked.
Starting with Orion 2022.x versions, the default directory for the Orion website changed from inetpub to C:\Program Files\SolarWinds\Orion\Web\Orion\images\
Images will need to be stored in this directory in order for the script below to work. You can also create another subfolder in this directory for custom images if desired. 

Here is an example of how to link an image from the new web folder in newer versions of Orion:

<html>
<body>
<img src="http://ORIONWEBSITE/Orion/images/cat.jpg"  width="440px" height="440px">
</body>
</html>