# Node Red: A widget based dashboard working with Homey trough MQTT

**URL:** <https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798>\
**Category:** Apps\
**Created:** [October 3, 2019, 10:05am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798 "2019-10-03T10:05:10Z")\
**Posts on this page:** 20\
**Page:** 22

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [June 20, 2020, 9:13am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/432 "2020-06-20T09:13:49Z")

</div>

I think everything is possible. But I haven’t dived in different templates myself. I just use default template.  
I recently stumbled upon the node-red dashboard from user @DeepBlueNine. I believe he made some custom CSS to make it look more like the Homey-Dash design.

 ![afbeelding](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/2/8/2823a0f660b477959748aa92955e85cba1510670.jpeg)

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 20, 2020, 2:04pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/433 "2020-06-20T14:04:47Z")

</div>

You can change a lot of things by modifying the Node-Red CSS. For example, by changing the background from my custom css, and with a dark background for the groups, instead of the white, you have this :

 ![Node-Red Custom CSS](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/2/2/22a68de59f6612c9b972a1d393abf109c055d71e.jpeg)

By changing just 2 CCS lines, you have a new Dashboard 🙂  
With some work on the CSS, you can make a Dashboard that’s look like this Home Assitant theme.

---

<div class="post-metadata">

**Author:** ![Keverjeroen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/keverjeroen/32/369_2.png) [@Keverjeroen](https://community.homey.app/u/Keverjeroen)\
**Post date:** [June 21, 2020, 5:50pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/434 "2020-06-21T17:50:06Z")

</div>

Do you use the UI template node for this?

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 21, 2020, 6:20pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/435 "2020-06-21T18:20:53Z")

</div>

Yes, an UI Template, in the `<head>` section.

---

<div class="post-metadata">

**Author:** ![Keverjeroen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/keverjeroen/32/369_2.png) [@Keverjeroen](https://community.homey.app/u/Keverjeroen)\
**Post date:** [June 22, 2020, 9:25am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/436 "2020-06-22T09:25:15Z")

</div>

Would be cool if you want to share your template with us. 🙂 I’ve played around with the CSS is the template, and I can get some things done, like a gradient background and some (alsmost) transparant / milky parts, but it is far from what you’ve created.

---

<div class="post-metadata">

**Author:** ![pvdhelm1974](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/pvdhelm1974/32/9424_2.png) [@pvdhelm1974](https://community.homey.app/u/pvdhelm1974)\
**Post date:** [June 22, 2020, 3:35pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/437 "2020-06-22T15:35:54Z")

</div>

how do you program the Execute MQTT Lightscene? i cant get it to work the buttons don’t change from color

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 22, 2020, 3:42pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/438 "2020-06-22T15:42:52Z")

</div>

I still have one Node-Red tutorial for the French section to make, but after, I’ll post my custom CSS with some explanations here.

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [June 22, 2020, 5:21pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/439 "2020-06-22T17:21:35Z")

</div>

> [@pvdhelm1974](#):
>
> how do you program the Execute MQTT Lightscene? i cant get it to work the buttons don’t change from color

It activates virtual buttons. When these buttons are “pressed”, or activated trough MQTT:  
`homie/homey-topic/sfeerlicht/button/set` (true)  
they activate a flow:

 ![afbeelding](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/5/3/536cb818510aced64b1f6314ec0ba3ec1637130b.png)

---

<div class="post-metadata">

**Author:** ![pvdhelm1974](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/pvdhelm1974/32/9424_2.png) [@pvdhelm1974](https://community.homey.app/u/pvdhelm1974)\
**Post date:** [June 23, 2020, 5:25pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/440 "2020-06-23T17:25:29Z")

</div>

can you please send me the code i can’t get it to work

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [June 24, 2020, 6:37am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/441 "2020-06-24T06:37:49Z")

</div>

But have you added this in the flow:

 ![afbeelding](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/0/e/0e6193072887b7bf867bfb66ba32aae60938ed1d.png)  
This will send a message to Node-red and act on it (make the button change color for example).  
Have you looked at the node red MQTT debug window and watch if there’s an incoming message?

---

<div class="post-metadata">

**Author:** ![pvdhelm1974](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/pvdhelm1974/32/9424_2.png) [@pvdhelm1974](https://community.homey.app/u/pvdhelm1974)\
**Post date:** [June 24, 2020, 6:50am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/442 "2020-06-24T06:50:54Z")

</div>

Yes in node red debug the message comes in but the output don’t work and the button is not changing color. Tonight i post my flow and node red pictures so you can take a look

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 26, 2020, 7:12am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/443 "2020-06-26T07:12:08Z")

</div>

Here it is, my custom CSS for my Node-Red DashBoard.  
Whitout the CSS, it’s look like this.

 ![01 - Dashboard Base](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/c/3/c3ec003184d8c02b77e1aff9fa3593f0324e04fc.png)

Just copy and import it in Node-Red and you get this.

 ![02 - DashBoard Node-Red modifications](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/3/4/346597e847e31a8727dcf6ef57618d9c4f0f5d6f.jpeg)

**The CSS code.**

```
[{"id":"d81aa8bc.35b81","type":"ui_template","z":"d6fa9f2d.3d501","group":"339d0edc.4ffe02","name":"Node-Red Dashboard Custom CSS","order":1,"width":0,"height":0,"format":"<style>\nroot, a, button, p, div {\n -webkit-user-select: none !important;\n}\n\nbody {\n background: -webkit-linear-gradient(\n 55deg,\n #009785 0%,\n #245aa5 50%,\n #b800e9 100%\n );\n -webkit-touch-callout: none !important;\n}\n\nbody.nr-dashboard-theme md-toolbar,\nbody.nr-dashboard-theme md-content md-card {\n background-color: transparent !important;\n color: #FFFFFF;\n}\n\nui-card-panel {\n background-color: rgba(255,255,255,0.1) !important;\n border-radius: 10px !important;\n}\n \n#Homey_Dashboard_Navigation {\n background-color: transparent !important;\n border-radius: 10px !important;\n}\n\n.md-card.md-default-theme, md-card {\n border-radius: 10px;\n}\n\n.nr-dashboard-switch.ng-scope {\n background-color: rgba(255,255,255,.2) !important;\n}\n\n.nr-dashboard-switch.ng-scope:hover {\n background-color: rgba(255,255,255,.5) !important;\n}\n\n.nr-dashboard-theme .nr-dashboard-button .md-button {\n background-color: rgba(255,255,255,.2);\n}\n\n.md-button {\n border-radius: 10px;\n}\n\n.nr-dashboard-cardpanel layout-column {\n background-color: rgba(255,255,255,0.2) !important;\n background-color: transparent !important;\n border-radius: 10px !important;\n}\n\n.nr-dashboard-theme ui-card-panel {\n border: none;\n}\n\n.nr-dashboard-template {\n overflow-y: visible;\n}\n.nr-dashboard-theme md-content md-card {\n background-color: transparent !important;\n}\n\n.nr-dashboard-theme ui-card-panel p.nr-dashboard-cardtitle {\n color: rgba(255, 255, 255, 0.5);\n}\n</style>\n\n<script>\ndocument.ontouchmove = function (e) {\n e.preventDefault();\n}\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"global","x":420,"y":160,"wires":[[]]},{"id":"339d0edc.4ffe02","type":"ui_group","z":"","name":"Heure","tab":"a2490d0e.a872b","order":1,"disp":false,"width":"6","collapse":false},{"id":"a2490d0e.a872b","type":"ui_tab","z":"","name":"Homey Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

**With some modifications, you have the final Dashboard.**

 ![03 - Dashboard Custom CSS](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/c/1/c17d132f495c3346fdd0f315ca1fe74614a96fb2.png)

---

<div class="post-metadata">

**Author:** ![Satoer](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/satoer/32/38113_2.png) [@Satoer](https://community.homey.app/u/Satoer)\
**Post date:** [June 26, 2020, 7:59am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/444 "2020-06-26T07:59:57Z")

</div>

Nice, I’ve added it to the first page.

---

<div class="post-metadata">

**Author:** ![MFM\_Bart](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/mfm_bart/32/9492_2.png) [@MFM\_Bart](https://community.homey.app/u/MFM_Bart)\
**Post date:** [June 26, 2020, 5:59pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/445 "2020-06-26T17:59:43Z")

</div>

Is there someone who has the ikea node up and running?

It won’t find my ikea gateway

---

<div class="post-metadata">

**Author:** ![pvdhelm1974](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/pvdhelm1974/32/9424_2.png) [@pvdhelm1974](https://community.homey.app/u/pvdhelm1974)\
**Post date:** [June 26, 2020, 8:29pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/446 "2020-06-26T20:29:23Z")

</div>

this is what i have in the code and it doesn’t work for me

 ![nodeRED](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/c/6/c6721c0ad4caab5f451ee701c4590873286ad9fe.jpeg)

 ![flow nr](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/b/4/b43306a78993e8df25295839abd0ffcd7443bf7c.jpeg)

[{“id”:“32211b1e.661164”,“type”:“mqtt in”,“z”:“3710c95a.3a55f6”,“name”:“set Lightscene”,“topic”:“homie/homey-bunderstraat/setlightscene”,“qos”:“2”,“datatype”:“auto”,“broker”:“6a86d592.e1abcc”,“x”:430,“y”:360,“wires”:[[“4dc1057a.fdb4cc”,“aa74077f.56aa68”]]},{“id”:“4dc1057a.fdb4cc”,“type”:“function”,“z”:“3710c95a.3a55f6”,“name”:“Activate Button”,“func”:“var color;\n\nif(msg.payload === “Avond”){\n// state is true (lets make button green)\n color = “#53c653”;\n}\nelse{\n // state is false (lets make button blue)\n color = “#0094ce”;\n}\n\nmsg = {background:color};\nreturn msg;”,“outputs”:1,“noerr”:0,“x”:660,“y”:340,“wires”:[[“4df08771.8b0278”]]},{“id”:“4df08771.8b0278”,“type”:“ui\_button”,“z”:“3710c95a.3a55f6”,“name”:“sfeerlicht”,“group”:“ceb9ab36.573ae8”,“order”:2,“width”:3,“height”:1,“passthru”:true,“label”:“Sfeerlicht”,“tooltip”:"",“color”:"",“bgcolor”:"{{msg.background}}",“icon”:"",“payload”:“Avond”,“payloadType”:“str”,“topic”:“homie/homey-bunderstraat/sfeerlicht/button/set”,“x”:870,“y”:340,“wires”:[[“606a32bc.a8311c”]]},{“id”:“606a32bc.a8311c”,“type”:“mqtt out”,“z”:“3710c95a.3a55f6”,“name”:"",“topic”:"",“qos”:"",“retain”:“true”,“broker”:“6a86d592.e1abcc”,“x”:1090,“y”:360,“wires”:},{“id”:“aa74077f.56aa68”,“type”:“function”,“z”:“3710c95a.3a55f6”,“name”:“Activate Button”,“func”:“var color;\n\nif(msg.payload === “allesuit”){\n// state is true (lets make button green)\n color = “#53c653”;\n}\nelse{\n // state is false (lets make button blue)\n color = “#0094ce”;\n}\n\nmsg = {background:color};\nreturn msg;”,“outputs”:1,“noerr”:0,“x”:660,“y”:380,“wires”:[[“2ac5009f.977a2”]]},{“id”:“2ac5009f.977a2”,“type”:“ui\_button”,“z”:“3710c95a.3a55f6”,“name”:“Alles uit”,“group”:“ceb9ab36.573ae8”,“order”:2,“width”:3,“height”:1,“passthru”:true,“label”:“Alles UIT”,“tooltip”:"",“color”:"",“bgcolor”:"{{msg.background}}",“icon”:"",“payload”:“allesuit”,“payloadType”:“str”,“topic”:“homie/homey-bunderstraat/alles-uit-scene/button/set”,“x”:870,“y”:380,“wires”:[[“606a32bc.a8311c”]]},{“id”:“6a86d592.e1abcc”,“type”:“mqtt-broker”,“z”:"",“name”:“MQTT Server Bunderstraat”,“broker”:“192.168.1.109”,“port”:“1883”,“clientid”:"",“usetls”:false,“compatmode”:false,“keepalive”:“60”,“cleansession”:true,“birthTopic”:"",“birthQos”:“0”,“birthPayload”:"",“closeTopic”:"",“closeQos”:“0”,“closePayload”:"",“willTopic”:"",“willQos”:“0”,“willPayload”:""},{“id”:“ceb9ab36.573ae8”,“type”:“ui\_group”,“z”:"",“name”:“Scenes”,“tab”:“5064ff32.6db5c”,“order”:5,“disp”:false,“width”:6,“collapse”:false},{“id”:“5064ff32.6db5c”,“type”:“ui\_tab”,“z”:"",“name”:“Dashboard Home”,“icon”:“fa-home”,“order”:1,“disabled”:false,“hidden”:false}]

---

<div class="post-metadata">

**Author:** ![Keverjeroen](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/keverjeroen/32/369_2.png) [@Keverjeroen](https://community.homey.app/u/Keverjeroen)\
**Post date:** [June 27, 2020, 1:17pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/447 "2020-06-27T13:17:08Z")

</div>

> [@DeepBlueNine](#):
>
> ```auto
> [{"id":"d81aa8bc.35b81","type":"ui_template","z":"d6fa9f2d.3d501","group":"339d0edc.4ffe02","name":"Node-Red Dashboard Custom CSS","order":1,"width":0,"height":0,"format":"<style>\nroot, a, button, p, div {\n -webkit-user-select: none !important;\n}\n\nbody {\n background: -webkit-linear-gradient(\n 55deg,\n #009785 0%,\n #245aa5 50%,\n #b800e9 100%\n );\n -webkit-touch-callout: none !important;\n}\n\nbody.nr-dashboard-theme md-toolbar,\nbody.nr-dashboard-theme md-content md-card {\n background-color: transparent !important;\n color: #FFFFFF;\n}\n\nui-card-panel {\n background-color: rgba(255,255,255,0.1) !important;\n border-radius: 10px !important;\n}\n \n#Homey_Dashboard_Navigation {\n background-color: transparent !important;\n border-radius: 10px !important;\n}\n\n.md-card.md-default-theme, md-card {\n border-radius: 10px;\n}\n\n.nr-dashboard-switch.ng-scope {\n background-color: rgba(255,255,255,.2) !important;\n}\n\n.nr-dashboard-switch.ng-scope:hover {\n background-color: rgba(255,255,255,.5) !important;\n}\n\n.nr-dashboard-theme .nr-dashboard-button .md-button {\n background-color: rgba(255,255,255,.2);\n}\n\n.md-button {\n border-radius: 10px;\n}\n\n.nr-dashboard-cardpanel layout-column {\n background-color: rgba(255,255,255,0.2) !important;\n background-color: transparent !important;\n border-radius: 10px !important;\n}\n\n.nr-dashboard-theme ui-card-panel {\n border: none;\n}\n\n.nr-dashboard-template {\n overflow-y: visible;\n}\n.nr-dashboard-theme md-content md-card {\n background-color: transparent !important;\n}\n\n.nr-dashboard-theme ui-card-panel p.nr-dashboard-cardtitle {\n color: rgba(255, 255, 255, 0.5);\n}\n</style>\n\n<script>\ndocument.ontouchmove = function (e) {\n e.preventDefault();\n}\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"global","x":420,"y":160,"wires":[[]]},{"id":"339d0edc.4ffe02","type":"ui_group","z":"","name":"Heure","tab":"a2490d0e.a872b","order":1,"disp":false,"width":"6","collapse":false},{"id":"a2490d0e.a872b","type":"ui_tab","z":"","name":"Homey Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]
> 
> ```

Wow! Thank you! I did just a copy / paste of the code and my dashboard already looks great! Now I have a great base to edit my dashboard. Thanks.

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 28, 2020, 8:11am UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/448 "2020-06-28T08:11:32Z")

</div>

Hi @rkokkelk

> Could you share your flows on setting the buttons and how you manage to change colors, etc. Thanks!

I’m using only a button template, just because you can change only the icon color with the switch template, with the button you have access to the background color. The trick for keeping the state of of your object is using a boolean variable and store it.

 ![Button Flow](https://us1.discourse-cdn.com/flex025/uploads/athom/original/3X/f/5/f50a89b18893c425b69b55e5f458814b8c4e28b2.png)

My flow for the button template 🙂

```
[{"id":"bf6f5dba.1e48f8","type":"ui_button","z":"d6fa9f2d.3d501","name":"ON/OFF Lampe Bureau","group":"a9bd2e1d.1bde3","order":8,"width":3,"height":1,"passthru":false,"label":"{{msg.topic}}","tooltip":"","color":"","bgcolor":"{{msg.background}}","icon":"fa-power-off fa-2x","payload":"lightstate_bureau","payloadType":"global","topic":"homie/homey-topic/lampebureau/onoff/set","x":810,"y":1360,"wires":[["864c9074.1dfa4"]]},{"id":"864c9074.1dfa4","type":"function","z":"d6fa9f2d.3d501","name":"Toggle On / Off","func":"var lightstate_bureau = flow.get(\"lightstate_bureau\") || false;\nmsg.payload = !lightstate_bureau;\nreturn msg;","outputs":1,"noerr":0,"x":1040,"y":1360,"wires":[["b4126e1c.ec2c3"]],"inputLabels":["input"],"outputLabels":["to button"]},{"id":"7788fc72.df1b3c","type":"mqtt in","z":"d6fa9f2d.3d501","name":"MQTT Lampe Bureau","topic":"homie/homey-topic/lampebureau/onoff","qos":"0","datatype":"auto","broker":"eda480cd.72d73","x":380,"y":1360,"wires":[["6561ae0e.a2bac"]]},{"id":"6561ae0e.a2bac","type":"function","z":"d6fa9f2d.3d501","name":"Object State","func":"var lightstate_bureau = flow.get(\"lightstate_bureau\") || undefined;\nvar label;\nvar color;\n\nif(msg.payload === \"true\"){\n label = 'LAMPE BUREAU';\n color = \"#FFC815\";\n lightstate_bureau = true;\n}\nelse{\n label = 'LAMPE BUREAU';\n color = \"\";\n lightstate_bureau = false;\n}\n\nflow.set(\"lightstate_bureau\",lightstate_bureau);\nmsg = {topic:label, background:color};\n\nreturn msg;","outputs":1,"noerr":0,"x":590,"y":1360,"wires":[["bf6f5dba.1e48f8"]]},{"id":"b4126e1c.ec2c3","type":"mqtt out","z":"d6fa9f2d.3d501","name":"MQTT Lampe Bureau","topic":"homie/homey-topic/lampebureau/onoff/set","qos":"","retain":"","broker":"eda480cd.72d73","x":1260,"y":1360,"wires":[]},{"id":"a9bd2e1d.1bde3","type":"ui_group","z":"","name":"Eclairage","tab":"a2490d0e.a872b","order":9,"disp":true,"width":"6","collapse":true},{"id":"eda480cd.72d73","type":"mqtt-broker","z":"","name":"Homey MQTT Riko","broker":"192.168.0.34","port":"1883","clientid":"","usetls":false,"compatmode":true,"keepalive":"60","cleansession":true,"birthTopic":"homey-topic/hub/status","birthQos":"2","birthRetain":"false","birthPayload":"msg.payload","closeTopic":"","closeQos":"2","closeRetain":"false","closePayload":"","willTopic":"","willQos":"2","willRetain":"false","willPayload":""},{"id":"a2490d0e.a872b","type":"ui_tab","z":"","name":"Homey Dashboard","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![lirand](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/lirand/32/8479_2.png) [@lirand](https://community.homey.app/u/lirand)\
**Post date:** [June 28, 2020, 2:55pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/449 "2020-06-28T14:55:46Z")

</div>

Hello @DeepBlueNine , I have taken over your process and adapted it to my lamp. The status of the lamp is displayed correctly. The lamp can be switched off but not switched on. Do you know what that could be? Thank you very much!

---

<div class="post-metadata">

**Author:** ![DeepBlueNine](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/deepbluenine/32/18637_2.png) [@DeepBlueNine](https://community.homey.app/u/DeepBlueNine)\
**Post date:** [June 28, 2020, 3:18pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/450 "2020-06-28T15:18:46Z")

</div>

Hi @lirand  
Try to put a “Debug” node after the “Toggle ON/OFF” and check if the button works fine.

---

<div class="post-metadata">

**Author:** ![lirand](https://sea1.discourse-cdn.com/flex025/user_avatar/community.homey.app/lirand/32/8479_2.png) [@lirand](https://community.homey.app/u/lirand)\
**Post date:** [June 28, 2020, 4:35pm UTC](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798/451 "2020-06-28T16:35:15Z")

</div>

I get the following message:  
homie/homey-topic/stehleuchtewz/onoff/set : msg.payload : boolean  
false

[Previous page](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798.md?page=21)

[Next page](https://community.homey.app/t/node-red-a-widget-based-dashboard-working-with-homey-trough-mqtt/18798.md?page=23)