# Locking the widgets and UI

**URL:** <https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656>\
**Category:** Dashboard\
**Created:** [12 November 2025 16:26 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656 "2025-11-12T16:26:26Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![nearbyatom](https://avatars.discourse-cdn.com/v4/letter/n/ec9cab/32.png) [@nearbyatom](https://discourse.nodered.org/u/nearbyatom)\
**Post date:** [12 November 2025 16:26 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/1 "2025-11-12T16:26:26Z")

</div>

Im developing an application on my laptop, and it's resolution 1920x1080. I can line them up and make it all pretty.

Then I would like to export the flows, and place them into a different PC but it's resolution is different (unknown) so the widgets are now shuffled around.

How do i lock the widgets and the UI in place when developing so when I transfer it to the PC the widgets don't move?

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [12 November 2025 16:42 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/2 "2025-11-12T16:42:07Z")

</div>

Which dashboard are you using (the original, now deprecated, node-red-dashboard or the newer @flowfuse/node-red-dashboard)?

---

<div class="post-metadata">

**Author:** ![nearbyatom](https://avatars.discourse-cdn.com/v4/letter/n/ec9cab/32.png) [@nearbyatom](https://discourse.nodered.org/u/nearbyatom)\
**Post date:** [12 November 2025 16:48 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/3 "2025-11-12T16:48:19Z")

</div>

I have no idea which dashboard I'm using.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/7/0787faebdbc070245ce1b8868b7b288f274386b0.png)

Does this have any information on it?

---

<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:** [12 November 2025 16:55 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/4 "2025-11-12T16:55:30Z")

</div>

> [@nearbyatom](#):
>
> Does this have any information on it?

Yes, that is the older, depreciated, unsupported Dashboard.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/d/ddf1f0377589b79ea875ef9d52ddd21267370354.png)

---

<div class="post-metadata">

**Author:** ![nearbyatom](https://avatars.discourse-cdn.com/v4/letter/n/ec9cab/32.png) [@nearbyatom](https://discourse.nodered.org/u/nearbyatom)\
**Post date:** [12 November 2025 17:08 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/5 "2025-11-12T17:08:51Z")

</div>

Silly question here:  
So the my dashboard is 3.6.6 as per the screenshot.  
But I'm finding a lot of information about Dashboard v2.0 like here:  
 ![](https://us1.discourse-cdn.com/flex026/uploads/nodered/optimized/3X/6/f/6f8b1d321f0e7fdeb669a01a607c04d04fab1274_2_690x388.jpeg)https://www.youtube.com/embed/0Hhns_DcyKQ?feature=oembed&wmode=opaque&list=PLk9erb9HGsPiF_rZQjyoviBqtwXtvrIkU

Isn't v3.6.6 newer than v2.0?

If I have v3.6.6 now, how do I update to the latest dashboard? Will the flows developed in my old project still work? TIA

---

<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:** [12 November 2025 17:11 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/6 "2025-11-12T17:11:54Z")

</div>

> [@nearbyatom](#):
>
> Isn't v3.6.6 newer than v2.0?

`node-red-dashboard` is not the same application as `@flowfuse/node-red-dashboard`.  
`node-red-dashboard` has been around a long time and made it to V3.6 before being retired due to aging tech in the stack  
`@flowfuse/node-red-dashboard` is comparatively speaking still a baby and only made it to V1.2

Folk refer to is as "Dashboard 2" as it is a successor.

Yes, it is confusing, yes I wish it were called something else.

Maybe we need to just bump `@flowfuse/node-red-dashboard` up to V4 to remove all doubts!

---

<div class="post-metadata">

**Author:** ![mudwalker](https://avatars.discourse-cdn.com/v4/letter/m/47e85d/32.png) [@mudwalker](https://discourse.nodered.org/u/mudwalker)\
**Post date:** [12 November 2025 17:19 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/7 "2025-11-12T17:19:49Z")

</div>

You will find that the Original Dashboard is 'ahead' of Dashboard 2 in revisions because they are different nodes that integrate well with Node-RED.

'Dashboard' (node-red-dashboard) is deprecated as it uses 'older technology'.

If you look in Manage Palette and input Dashboard, you should see '@flowfuse/node-red-dashboard', this is known as Dashboard 2 amongst us as it is the second development of Dashboard, but developed by FlowFuse.

There is also UIBUILDER which is another alternative that can be used as a Dashboard and uses HTML, Javascript and CSS to display a User Interface.

HTH

Posted at same time as @Steve-Mcl !

---

<div class="post-metadata">

**Author:** ![jbudd](https://avatars.discourse-cdn.com/v4/letter/j/5f8ce5/32.png) [@jbudd](https://discourse.nodered.org/u/jbudd)\
**Post date:** [12 November 2025 17:27 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/8 "2025-11-12T17:27:15Z")

</div>

> [@nearbyatom](#):
>
> If I have v3.6.6 now, how do I update to the latest dashboard? Will the flows developed in my old project still work?

You can have node-red dashboard and dashboard2 installed together and they will both work.  
The original dashboard pages are at :1880/ui and any dashboard 2 pages at :1880/dashboard.

> [@Steve-Mcl](#):
>
> Maybe we need to just bump `@flowfuse/node-red-dashboard` up to V4 to remove all doubts!

Absolutely. And change the colour of widgets in the editor so we can tell at a glance what we are looking at. Maybe a final release for node-red-dashboard to change the colour to blue-grey.

> [@nearbyatom](#):
>
> How do i lock the widgets and the UI in place when developing so when I transfer it to the PC the widgets don't move?

Original dashboard: I don't think you can.  
Dashboard 2: I don't think you can.  
At least, not using the default page layout of "grid" but there are alternatives, described here: [https://dashboard.flowfuse.com/layouts/types/grid.html](https://dashboard.flowfuse.com/layouts/types/grid.html)

---

<div class="post-metadata">

**Author:** ![nearbyatom](https://avatars.discourse-cdn.com/v4/letter/n/ec9cab/32.png) [@nearbyatom](https://discourse.nodered.org/u/nearbyatom)\
**Post date:** [12 November 2025 17:36 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/9 "2025-11-12T17:36:46Z")

</div>

If I go to the command prompt and type in node-red I start the old node-red dashboard.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/2/522d5f13d94d79bc305219e1d0ef84062e5d2a56.png) See picture. This is after I installed the flowfuse/node-red-dashboard.

The node-red editor (localhost:1880) remains the same right?

---

<div class="post-metadata">

**Author:** ![jbudd](https://avatars.discourse-cdn.com/v4/letter/j/5f8ce5/32.png) [@jbudd](https://discourse.nodered.org/u/jbudd)\
**Post date:** [12 November 2025 17:45 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/10 "2025-11-12T17:45:37Z")

</div>

Yes.  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/1/818673c98d96c120745d95816044121cbf0c9377.png)

Once you have a working DB2 dashboard you will also see a notification for that:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/3/f38deef9a0dce5112654628afc4a8f5465296658.png)  
Oops, I forgot to redact my username 😄

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [12 November 2025 21:18 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/11 "2025-11-12T21:18:31Z")

</div>

You have installed the flowfuse dashboard but have not added any widgets that make up that dashboard.

See [Getting Started | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/getting-started.html) for docs and links to video tutorials for Dashboard 2.0 (`@flowfuse/node-red-dashboard`)

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [12 November 2025 22:05 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/12 "2025-11-12T22:05:51Z")

</div>

Note though, that using the flowfuse dashboard will not necessarily help to get to what you want, but you will be using a dashboard that is still being maintained.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [13 November 2025 12:43 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/13 "2025-11-13T12:43:24Z")

</div>

Mudwalker kindly mentioned UIBUILDER. Just to note that you can have UIBUILDER installed along side either/both of the Dashboard packages.

UIBUILDER lets you build any custom web UI's. It allows multiple separate instances (unlike the Dashboards) and supports both Single-Page Apps (like the Dashboards) and multi-page apps as well. It also supports but does not require a front-end framework (Dashboard 1 requires AngularJS v1, Dashboard 2 requires VueJS v3 along with Vuetify).

A comprehensive comparison between UIBUILDER and Dashboard 2 is available in the documentation here:

> **[UIBUILDER Documentation v7](https://totallyinformation.github.io/node-red-contrib-uibuilder/#/using/compare-d2)**
>
> UIBUILDER Documentation v7

Notably, the included CSS styling (which you can of course amend or ignore) provides some sensible break points for desktop vs mobile browsers. There are examples of building layouts similar to D2 available.

---

<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:** [13 December 2025 12:44 UTC](https://discourse.nodered.org/t/locking-the-widgets-and-ui/99656/14 "2025-12-13T12:44:08Z")

</div>

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