# UI template image via msg.payload

**URL:** https://discourse.nodered.org/t/ui-template-image-via-msg-payload/4395
**Category:** Dashboard
**Created:** [29 October 2018 19:33 UTC](https://discourse.nodered.org/t/ui-template-image-via-msg-payload/4395 "2018-10-29T19:33:57Z")
**Posts on this page:** 1
**Showing post:** 10

<div class="post-metadata">

### Author: ![SuperNinja](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/superninja/32/5761_2.png) [@SuperNinja](https://discourse.nodered.org/u/SuperNinja)
#### Post date: [27 October 2019 19:12 UTC](https://discourse.nodered.org/t/ui-template-image-via-msg-payload/4395/10 "2019-10-27T19:12:26Z")

</div>

@trihook @munuluka  
after put a picture in your raspberry in the folder `/home/pi/Pictures` ( `off.png` picture in this example) :  
try this flow :

```auto
[{"id":"43f3ac9.5214a54","type":"inject","z":"1dec9bbc.37a314","name":"","topic":"","payload":"","payloadType":"date","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":90,"y":2130,"wires":[["7fe75716.574148"]]},{"id":"49b00b00.d657b4","type":"ui_template","z":"1dec9bbc.37a314","group":"b930fe7e.897db","name":"","order":1,"width":"6","height":"6","format":"\n \n <img width=\"100%\" height=\"100%\" alt=\"Image not found\" src=\"data:image/png;base64,{{msg.payload}}\" />\n","storeOutMessages":true,"fwdInMessages":true,"templateScope":"local","x":610,"y":2130,"wires":[[]]},{"id":"4a8daeb2.4a1a7","type":"base64","z":"1dec9bbc.37a314","name":"","action":"str","property":"payload","x":470,"y":2130,"wires":[["49b00b00.d657b4"]]},{"id":"7fe75716.574148","type":"file in","z":"1dec9bbc.37a314","name":"","filename":"/home/pi/Pictures/off.png","format":"","chunk":false,"sendError":false,"encoding":"none","x":280,"y":2130,"wires":[["4a8daeb2.4a1a7"]]},{"id":"b930fe7e.897db","type":"ui_group","z":"","name":"picture","tab":"250de740.57ee78","order":9,"disp":true,"width":"6","collapse":false},{"id":"250de740.57ee78","type":"ui_tab","z":"","name":"Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

this look like this :  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/61b14cb90cb776f2b2e164e5245d26d3fdd521f4.png)

and the result in Dashboard:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b7bc44e8057b7d2a0717a55046fb806373c3b0ee.png)

---

_[View the full topic](https://discourse.nodered.org/t/ui-template-image-via-msg-payload/4395)._