# Dashboard-2 visual layout tool

**URL:** https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934
**Category:** Dashboard
**Tags:** dashboard-2
**Created:** [6 November 2024 06:44 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934 "2024-11-06T06:44:00Z")
**Posts on this page:** 13
**Page:** 1

<div class="post-metadata">

### Author: ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)
#### Post date: [6 November 2024 06:44 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/1 "2024-11-06T06:44:00Z")

</div>

Hello, bear with me, just started looking into the new Dashboard-2, browsed the documentation and right away, first thing, I was trying to find the similar visual layout editor tool that we are so familiar with from the Dashboard-1. I think such a tool is fundamental, especially when we talk so much about visual and low code programming

And then I found this, how is this progressing? From the time stamps in the discussion it is actually hard to know if they are from this year (but I hope):

> [@First (working) prototype of a WYSIWYG editor for Dashboard 2.0](https://discourse.nodered.org/t/first-working-prototype-of-a-wysiwyg-editor-for-dashboard-2-0/91128):
>
> This is very much a W.I.P (just in case it's not already clear from the shoddy UI you're about to watch), but this is the first step in our vision for what we're hoping to achieve with Dashboard 2.0 and a supporting layout editor, i.e. editing the layout live in the Dashboard itself. [ScreenRecording2024-09-19at21.34.33-ezgif.com-video-to-gif-converter] This video shows a significant breakthrough for us as it demonstrates groups being re-ordered (i.e. the nodes being modified) from within the …

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [6 November 2024 07:38 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/2 "2024-11-06T07:38:50Z")

</div>

First iteration of this was shipped yesterday in `1.19.0`.

The editor is different to Dashboard 1.0, as the positioning methods in D1.0 do not scale well to mobile/responsive layouts.

We have big plans here and will be introducing a lot more improvements over the coming months.

The speed of the delivery will be heavily dependent on how quickly we can hire for this position:

[https://job-boards.greenhouse.io/flowfuse/jobs/5185319004](https://job-boards.greenhouse.io/flowfuse/jobs/5185319004)

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [6 November 2024 07:39 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/3 "2024-11-06T07:39:56Z")

</div>

I plan on writing a blog (and small tutorial) today too and will share here once its published

---

<div class="post-metadata">

### Author: ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)
#### Post date: [6 November 2024 08:32 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/4 "2024-11-06T08:32:35Z")

</div>

Wonderful thank you!!

(How to install 1.19, I did only see 1.18 that I have installed?)

---

<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: [6 November 2024 08:57 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/5 "2024-11-06T08:57:10Z")

</div>

Hey @krambriw to be clear, it is currently released into the main branch of the repository. The release to npm and flows library will be happening very shortly (today). Hold tight mate. But if you really want to get ahead of the curve, there are instructions in the docs on how to run from development.

---

<div class="post-metadata">

### Author: ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)
#### Post date: [6 November 2024 09:01 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/6 "2024-11-06T09:01:48Z")

</div>

Sorry, no rush really, the thing is just when the things get's going, it's going...

😉

---

<div class="post-metadata">

### Author: ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)
#### Post date: [6 November 2024 09:02 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/7 "2024-11-06T09:02:39Z")

</div>

> [@krambriw](#):
>
> (How to install 1.19, I did only see 1.18 that I have installed?)

Yeah, that's my failt 🤦‍♂️ - thought I'd published it yesterday, I hadn't clicked all the correct buttons - working on it now. Shoud be live in the Palette in the next 30 minutes.

---

<div class="post-metadata">

### Author: ![krambriw](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/krambriw/32/5429_2.png) [@krambriw](https://discourse.nodered.org/u/krambriw)
#### Post date: [6 November 2024 14:45 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/8 "2024-11-06T14:45:33Z")

</div>

Stumbling steps, movin on, great layout tool 🤩

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/7/77e02c54c9b0fe75cdd58908e5894c2b5450d0fc.jpeg)

---

<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: [6 November 2024 15:06 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/9 "2024-11-06T15:06:44Z")

</div>

Is it only possible to move groups about at the moment? I can't immediately see how to move a widget.

---

<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: [6 November 2024 15:49 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/10 "2024-11-06T15:49:30Z")

</div>

Not yet. 1 thing at a time 😉

---

<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: [6 November 2024 16:12 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/11 "2024-11-06T16:12:42Z")

</div>

OK, just checking I was not missing something.

---

<div class="post-metadata">

### Author: ![omrid](https://avatars.discourse-cdn.com/v4/letter/o/77aa72/32.png) [@omrid](https://discourse.nodered.org/u/omrid)
#### Post date: [6 November 2024 16:51 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/12 "2024-11-06T16:51:39Z")

</div>

I like the concept. Moving the actual dashboard elements, WYSIWYG. Not just placeholders as in DB-1.

---

<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: [6 December 2024 16:51 UTC](https://discourse.nodered.org/t/dashboard-2-visual-layout-tool/92934/13 "2024-12-06T16:51:55Z")

</div>

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