How to add an image into a dashboard viewlet
Accepted answer
I know this is a very old question, andI am sure the asnwer above is correct, but it didn't help me if the picture isn't accessible by a url. I want to embed a jpeg picture of our practice workflow into the dashboard, and the picture is created from a powerpoint flowchart, so it doesn't have a URL. As I haven't seen any other answer here is a solution I just discovered - works in firefox, at least - using an embedded base64 image. Don't worry if you don't know what that means, just follow the instructions :-)
- Get your image saved to e.g. a png file on your computer
-
Go HERE, upload your image, and select/copy all the generated base64 content - it should start with <img
- On your Jazz dashboard, add an html widget
- Switch to view html source (top left toolbar button)
-
Delete the existing text and paste in all the text you copied from abluestar
-
Click OK
UPDATE: now let's say you want to have hyperlinks from your picture, what you need is an html image map. What I did was:
- Start up a text editor and paste all the <img...> from abluestar into it.
- Go to http://imagemap-generator.dariodomi.de/ and upload your jpg, and create some hotspots, then copy the html generated - there are two elements, an <img...> and a <map...>. Copy just the <map..> to the end.
- Paste it into your text editor AFTER the abluestar text
- Delete the [...] from the map
- Now in the base64 encoded image text from abluestar before the closing /> insert: usemap="#Map"
- In the <map...> for each hotspot there is a href='#'. You will have to replace each # with the hyperlink target. (tip: If you're not sure which hotspot is which in the map, put something unique in each '#' in the HTML and you'll see that link when you save the widget and hover the mouse over the picture)
- In your dashboard, create or edit contents of the html widget and switch to HTML view, paste all this text in, and click OK.
- Ta da!
4 other answers
Another way is to server your image using the same application server that is hosting Jazz. For Liberty, you will have to enable dropins, and add a dummy 'app' - see the instructions for how to do this in Liberty for hosting DNG extensions here (you don't need to actually put a DNG extension in the folder, it can server other files). Then put the jpg in the extensions folder and it can be accessed by URL, so you can use the URL in a widget.