# Detach block from other

**URL:** <https://discourse.nodered.org/t/detach-block-from-other/39392>\
**Category:** Dashboard\
**Created:** [19 January 2021 14:56 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392 "2021-01-19T14:56:17Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![mariulin](https://avatars.discourse-cdn.com/v4/letter/m/a9adbd/32.png) [@mariulin](https://discourse.nodered.org/u/mariulin)\
**Post date:** [19 January 2021 14:56 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/1 "2021-01-19T14:56:17Z")

</div>

Hi. I have this question.  
My "utility page" is formed in this way.

 ![immagine](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/6/86ed88bc8de675c8a8f3a6be3819b1c6a3132411.png)

Is possible to have the Copyright block detached from other block like in this image?

 ![immagine](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/0/f007876294fa3e87f5deca0cd2349ff0a4f0f2f1.png)

I've tryed to work on spacer, but the result is not ok.

Thanks

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [20 January 2021 10:33 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/2 "2021-01-20T10:33:11Z")

</div>

providing your flow would help[

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [20 January 2021 12:30 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/3 "2021-01-20T12:30:59Z")

</div>

As it happens 🙂 - there is a hidden div on the page called nr-dashboard-footer which you can just add what you want to and style if needed... eg

```auto
[{"id":"a2a66986.349358","type":"ui_template","z":"9138b11f.f64d5","group":"d16ec6fc.4da508","name":"","order":2,"width":0,"height":0,"format":"<script>\n$(\"#nr-dashboard-footer\").html(\"Copyright 2021 - Dave C-J\");\n</script>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"global","x":280,"y":380,"wires":[[]]},{"id":"d16ec6fc.4da508","type":"ui_group","name":"Group 2","tab":"20934cee.3e6c14","order":2,"disp":true,"width":6,"collapse":false},{"id":"20934cee.3e6c14","type":"ui_tab","name":"Tab 1","icon":"dashboard","order":1,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![mariulin](https://avatars.discourse-cdn.com/v4/letter/m/a9adbd/32.png) [@mariulin](https://discourse.nodered.org/u/mariulin)\
**Post date:** [20 January 2021 20:46 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/4 "2021-01-20T20:46:22Z")

</div>

Here is my flow.  
Thank you

```auto
[{"id":"e113e00b.b59d4","type":"tab","label":"Utility","disabled":false,"info":""},{"id":"f1b954c.9241aa8","type":"comment","z":"e113e00b.b59d4","name":"Utility Server","info":"","x":110,"y":40,"wires":[]},{"id":"39a50607.77c42a","type":"ui_button","z":"e113e00b.b59d4","name":"","group":"4d6ce0e6.8b237","order":1,"width":6,"height":1,"passthru":false,"label":"Copyright","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"","payload":"Copyright © 2020 by Mariulin","payloadType":"str","topic":"","x":100,"y":820,"wires":[["73f360b6.2b7db"]]},{"id":"73f360b6.2b7db","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":false,"outputs":1,"ok":"OK","cancel":"","raw":false,"topic":"","name":"Messaggio a video","x":720,"y":820,"wires":[[]]},{"id":"768c6da.46e3394","type":"ui_button","z":"e113e00b.b59d4","name":"Riavvia Raspberry","group":"f3e67e3.7708b","order":2,"width":6,"height":1,"passthru":false,"label":"Riavvia Raspberry","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-refresh","payload":"sudo reboot","payloadType":"str","topic":"","x":130,"y":80,"wires":[["dc0e3c2b.6e3998","d4a22fa3.6d8d9"]]},{"id":"c2ba6eb1.39c93","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":570,"y":140,"wires":[[],[],[]]},{"id":"7644ffd7.dc38f","type":"ui_button","z":"e113e00b.b59d4","name":"Spegni Raspberry","group":"f3e67e3.7708b","order":1,"width":6,"height":1,"passthru":false,"label":"Spegni Raspberry","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-power-off","payload":"sudo shutdown","payloadType":"str","topic":"","x":130,"y":180,"wires":[["b0d477ae.faf9c8","948e2dc2.1c7128"]]},{"id":"c6611b92.9e5ef8","type":"ui_button","z":"e113e00b.b59d4","name":"Riavvia Nodered","group":"f3e67e3.7708b","order":4,"width":6,"height":1,"passthru":false,"label":"Riavvia Nodered","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-refresh","payload":"sudo systemctl restart nodered","payloadType":"str","topic":"","x":130,"y":280,"wires":[["cad93eb.9ce0dc","de6ebea0.080bf8"]]},{"id":"36b73974.334a06","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":true,"outputs":1,"ok":"OK","cancel":"","raw":false,"topic":"","name":"Messaggio a video","x":570,"y":280,"wires":[[]]},{"id":"cad93eb.9ce0dc","type":"change","z":"e113e00b.b59d4","name":"Cambia Messaggio","rules":[{"t":"change","p":"payload","pt":"msg","from":"sudo systemctl restart nodered","fromt":"str","to":"Riavvio NodeRed in corso...","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":280,"wires":[["36b73974.334a06"]]},{"id":"de6ebea0.080bf8","type":"delay","z":"e113e00b.b59d4","name":"Ritarda 2 secondi","pauseType":"delay","timeout":"2","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":350,"y":240,"wires":[["aca8ae29.2a84e"]]},{"id":"558dae92.4b0b8","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":true,"outputs":1,"ok":"OK","cancel":"","raw":false,"topic":"","name":"Messaggio a video","x":570,"y":180,"wires":[[]]},{"id":"b0d477ae.faf9c8","type":"change","z":"e113e00b.b59d4","name":"Cambia Messaggio","rules":[{"t":"change","p":"payload","pt":"msg","from":"sudo shutdown","fromt":"str","to":"Spegnimento Raspberry in corso","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":180,"wires":[["558dae92.4b0b8"]]},{"id":"948e2dc2.1c7128","type":"delay","z":"e113e00b.b59d4","name":"Ritarda 2 secondi","pauseType":"delay","timeout":"2","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":350,"y":140,"wires":[["c2ba6eb1.39c93"]]},{"id":"aca8ae29.2a84e","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":570,"y":240,"wires":[[],[],[]]},{"id":"39ef8047.8b5b9","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":570,"y":40,"wires":[[],[],[]]},{"id":"eab5e589.70587","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":true,"outputs":1,"ok":"OK","cancel":"","raw":false,"topic":"","name":"Messaggio a video","x":570,"y":80,"wires":[[]]},{"id":"dc0e3c2b.6e3998","type":"change","z":"e113e00b.b59d4","name":"Cambia Messaggio","rules":[{"t":"change","p":"payload","pt":"msg","from":"sudo reboot","fromt":"str","to":"Riavvio Raspberry in corso...","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":80,"wires":[["eab5e589.70587"]]},{"id":"d4a22fa3.6d8d9","type":"delay","z":"e113e00b.b59d4","name":"Ritarda 2 secondi","pauseType":"delay","timeout":"2","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":350,"y":40,"wires":[["39ef8047.8b5b9"]]},{"id":"a288bac3.e4d778","type":"ui_button","z":"e113e00b.b59d4","name":"Riavvia Motion","group":"5b1e052d.73dcfc","order":1,"width":6,"height":1,"passthru":false,"label":"Riavvia Motion (REMOTO)","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-refresh","payload":"sudo /root/riavvia_motion_remoto","payloadType":"str","topic":"","x":120,"y":430,"wires":[["81686cfc.2ec69","537da919.06ad88"]]},{"id":"5e38bff6.28235","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":true,"outputs":1,"ok":"OK","cancel":"","raw":false,"topic":"","name":"Messaggio a video","x":570,"y":430,"wires":[[]]},{"id":"81686cfc.2ec69","type":"change","z":"e113e00b.b59d4","name":"Cambia Messaggio","rules":[{"t":"change","p":"payload","pt":"msg","from":"sudo /root/riavvia_motion_remoto","fromt":"str","to":"Riavvio Motion in corso...","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":350,"y":430,"wires":[["5e38bff6.28235"]]},{"id":"537da919.06ad88","type":"delay","z":"e113e00b.b59d4","name":"Ritarda 2 secondi","pauseType":"delay","timeout":"2","timeoutUnits":"seconds","rate":"1","nbRateUnits":"1","rateUnits":"second","randomFirst":"1","randomLast":"5","randomUnits":"seconds","drop":false,"x":350,"y":390,"wires":[["8f36e4ba.b75998"]]},{"id":"8f36e4ba.b75998","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":570,"y":390,"wires":[[],[],[]]},{"id":"d464d395.df034","type":"comment","z":"e113e00b.b59d4","name":"Utility Motion","info":"","x":110,"y":390,"wires":[]},{"id":"8d55333.80544d","type":"ui_button","z":"e113e00b.b59d4","name":"Netstat","group":"aba84c21.b3a3b","order":1,"width":6,"height":1,"passthru":false,"label":"Netstat","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-sitemap","payload":"sudo /bin/netstat -aW|grep LISTEN","payloadType":"str","topic":"","x":100,"y":530,"wires":[["109e3640.2db96a"]]},{"id":"109e3640.2db96a","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":290,"y":530,"wires":[["45f12719.132c08"],[],[]]},{"id":"4e4092cf.c0d67c","type":"comment","z":"e113e00b.b59d4","name":"Utility Varie","info":"","x":100,"y":490,"wires":[]},{"id":"28615896.0ad098","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":false,"outputs":1,"ok":"OK","cancel":"","raw":true,"topic":"","name":"Messaggio a video","x":720,"y":520,"wires":[[]]},{"id":"b57de0fa.bfca1","type":"ui_button","z":"e113e00b.b59d4","name":"Speedtest","group":"aba84c21.b3a3b","order":2,"width":6,"height":1,"passthru":false,"label":"Speedtest","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-tachometer ","payload":"sudo /usr/bin/speedtest","payloadType":"str","topic":"","x":100,"y":660,"wires":[["89ebe274.9d87","511100a5.f3639"]]},{"id":"89ebe274.9d87","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":290,"y":660,"wires":[["7fefce30.469bf8"],[],[]]},{"id":"47929931.28ffc8","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":false,"outputs":1,"ok":"OK","cancel":"Cancel","raw":true,"topic":"","name":"Messaggio a video","x":720,"y":650,"wires":[[]]},{"id":"d964c797.c2bc48","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":false,"outputs":1,"ok":"OK","cancel":"Cancel","raw":false,"topic":"","name":"Messaggio a video","x":720,"y":710,"wires":[[]]},{"id":"511100a5.f3639","type":"change","z":"e113e00b.b59d4","name":"Cambia Messaggio","rules":[{"t":"change","p":"payload","pt":"msg","from":"sudo /usr/bin/speedtest","fromt":"str","to":"Speed Test avviato. Attendere prego...","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":290,"y":710,"wires":[["d964c797.c2bc48"]]},{"id":"45f12719.132c08","type":"template","z":"e113e00b.b59d4","name":"Formatta testo","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<pre>{{payload}}</pre>","output":"str","x":510,"y":520,"wires":[["28615896.0ad098"]]},{"id":"b9810e25.929a6","type":"comment","z":"e113e00b.b59d4","name":"Copyright","info":"","x":95.56083679199219,"y":784.1510009765625,"wires":[]},{"id":"7fefce30.469bf8","type":"template","z":"e113e00b.b59d4","name":"Formatta testo","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<pre>{{payload}}</pre>","output":"str","x":510,"y":650,"wires":[["47929931.28ffc8"]]},{"id":"8c61ad81.ecee8","type":"ui_button","z":"e113e00b.b59d4","name":"Who","group":"aba84c21.b3a3b","order":1,"width":6,"height":1,"passthru":false,"label":"Who","tooltip":"","color":"","bgcolor":"#A6A6A6","icon":"fa-users","payload":"sudo /usr/bin/who","payloadType":"str","topic":"","x":90,"y":590,"wires":[["f4b63610.d564f"]]},{"id":"f4b63610.d564f","type":"exec","z":"e113e00b.b59d4","command":"","addpay":true,"append":"","useSpawn":"false","timer":"0","oldrc":false,"name":"Esegui Comando","x":290,"y":590,"wires":[["bca5d5a2.945068"],[],[]]},{"id":"a5c57fa7.8686d8","type":"ui_toast","z":"e113e00b.b59d4","position":"dialog","displayTime":"3","highlight":"","sendall":false,"outputs":1,"ok":"OK","cancel":"","raw":true,"topic":"","name":"Messaggio a video","x":720,"y":580,"wires":[[]]},{"id":"bca5d5a2.945068","type":"template","z":"e113e00b.b59d4","name":"Formatta testo","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<pre>{{payload}}</pre>","output":"str","x":510,"y":580,"wires":[["a5c57fa7.8686d8"]]},{"id":"4d6ce0e6.8b237","type":"ui_group","z":"","name":"Copyright","tab":"e609dd70.205148","order":4,"disp":true,"width":6,"collapse":false},{"id":"f3e67e3.7708b","type":"ui_group","z":"","name":"Utility Server","tab":"e609dd70.205148","order":1,"disp":true,"width":"6","collapse":false},{"id":"5b1e052d.73dcfc","type":"ui_group","z":"","name":"Utility Motion","tab":"e609dd70.205148","order":2,"disp":true,"width":"6","collapse":false},{"id":"aba84c21.b3a3b","type":"ui_group","z":"","name":"Utility Varie","tab":"e609dd70.205148","order":3,"disp":true,"width":6,"collapse":false},{"id":"e609dd70.205148","type":"ui_tab","z":"","name":"Utility","icon":"fa-cogs","order":11,"disabled":false,"hidden":false}]

```

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [20 January 2021 20:49 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/5 "2021-01-20T20:49:05Z")

</div>

Hi, in order to make code more readable and importable it is important to surround your code with three backticks  
`````  
`like this`  
`````

You can edit and correct your post by clicking the pencil icon.

See this post for more details - [How to share code or flow json](https://discourse.nodered.org/t/how-to-share-code-or-flow-json/506)

---

<div class="post-metadata">

**Author:** ![mariulin](https://avatars.discourse-cdn.com/v4/letter/m/a9adbd/32.png) [@mariulin](https://discourse.nodered.org/u/mariulin)\
**Post date:** [20 January 2021 21:08 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/6 "2021-01-20T21:08:44Z")

</div>

> [@Steve-Mcl](#):
>
> You can edit and correct your post by clicking the pencil icon.

Ok. Done. Thank you

---

<div class="post-metadata">

**Author:** ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)\
**Post date:** [21 January 2021 10:42 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/7 "2021-01-21T10:42:04Z")

</div>

Remembering that the dashboard is a 'responsive' design, What doyou want the copyright block to doif the page is resized? Stick to the bottom all the time? or something else?

---

<div class="post-metadata">

**Author:** ![mariulin](https://avatars.discourse-cdn.com/v4/letter/m/a9adbd/32.png) [@mariulin](https://discourse.nodered.org/u/mariulin)\
**Post date:** [21 January 2021 18:00 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/8 "2021-01-21T18:00:02Z")

</div>

Ye[quote="zenofmud, post:7, topic:39392"]  
Stick to the bottom all the time?  
[/quote]

Yes. In this case yes.

But my question would be more in general... Is posssible to put the block in the page in a position non in sequence with another block? For example one block on top left and another in bottom right?

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [21 January 2021 18:19 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/9 "2021-01-21T18:19:36Z")

</div>

Quick one to try with `ui_template`

```auto
<div id="test">TEST DIV</div>
<script>
    $("#nr-dashboard-footer").empty();
    $("#test").detach().appendTo("#nr-dashboard-footer");
</script>

<style>
    #test{
        position:absolute;
        background:#CAFFEE;
        text-align:center;
        left:50%;
        bottom:0;
        width:200px;
        height:200px;
        z-index:100;
        transform:translate(-50%,0%);
        border:1px solid red;
    }
</style>

```

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [21 January 2021 18:39 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/10 "2021-01-21T18:39:40Z")

</div>

If at bottom all the time then the code I posted above is the way to do it.

Otherwise the default is for a responsive display that changes to try to accommodate different screen sizes. So while you could create one large group and then use the layout tool to place widgets within it, you can’t easily place groups .

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [20 February 2021 18:39 UTC](https://discourse.nodered.org/t/detach-block-from-other/39392/11 "2021-02-20T18:39:41Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.