# Is there a way to create tabs inside the editor?

**URL:** <https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863>\
**Category:** Developing Nodes\
**Created:** [29 December 2022 06:25 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863 "2022-12-29T06:25:20Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![syedhannan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/syedhannan/32/72932_2.png) [@syedhannan](https://discourse.nodered.org/u/syedhannan)\
**Post date:** [29 December 2022 06:25 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/1 "2022-12-29T06:25:20Z")

</div>

I have a list of text fields which I want to keep under separate tabs depending on the category.

I wanted to know if it is possible to create tabs inside the editor so that I can place the text fields in appropriate categories.

![tabs](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/3/130fbd33546e12b6a9d81f9e774c4a592460ba9e.jpeg)

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [29 December 2022 06:27 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/2 "2022-12-29T06:27:52Z")

</div>

This also doesn't seem to be **creating new nodes** but more a question about how to use Node-red.  
That is the `general` area.

---

<div class="post-metadata">

**Author:** ![bakman2](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bakman2/32/6207_2.png) [@bakman2](https://discourse.nodered.org/u/bakman2)\
**Post date:** [29 December 2022 08:43 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/3 "2022-12-29T08:43:00Z")

</div>

I think this is his own node ?

---

<div class="post-metadata">

**Author:** ![Trying\_to\_learn](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/trying_to_learn/32/28400_2.png) [@Trying\_to\_learn](https://discourse.nodered.org/u/Trying_to_learn)\
**Post date:** [29 December 2022 08:45 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/4 "2022-12-29T08:45:03Z")

</div>

(ok, maybe.)

Sorry if I am wrong. But given the topic about people incorrectly using that selection.

---

<div class="post-metadata">

**Author:** ![ralphwetzel](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ralphwetzel/32/53713_2.png) [@ralphwetzel](https://discourse.nodered.org/u/ralphwetzel)\
**Post date:** [29 December 2022 09:48 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/5 "2022-12-29T09:48:11Z")

</div>

There are core nodes that do this - and of course contributed ones as well.  
I propose you check their source to see how it's done.

---

<div class="post-metadata">

**Author:** ![syedhannan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/syedhannan/32/72932_2.png) [@syedhannan](https://discourse.nodered.org/u/syedhannan)\
**Post date:** [29 December 2022 09:49 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/6 "2022-12-29T09:49:09Z")

</div>

Please can you name a few since I was not able to find them

---

<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:** [29 December 2022 09:49 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/7 "2022-12-29T09:49:44Z")

</div>

Have you never used the function node?

---

<div class="post-metadata">

**Author:** ![syedhannan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/syedhannan/32/72932_2.png) [@syedhannan](https://discourse.nodered.org/u/syedhannan)\
**Post date:** [29 December 2022 10:01 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/8 "2022-12-29T10:01:00Z")

</div>

I have used function node

---

<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:** [29 December 2022 10:35 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/9 "2022-12-29T10:35:06Z")

</div>

There seems to be some confusion about what you are doing.  
Is this for the properties of a node that you are creating?  
Like this?  
 ![Untitled 1](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/2/32adc5a44a8abc2a6231d82819dbb6e98fcb7fab.jpeg)

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [29 December 2022 10:39 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/10 "2022-12-29T10:39:34Z")

</div>

@syedhannan if you want to add tabs within the properties tab of your nodes edit dialog, then have a look at the Function node, or the MQTT Broker config nodes. They both contain tabbed sections and will show how it is done.

Ps, have moved to #creating-nodes because it is a question about your own node.

---

<div class="post-metadata">

**Author:** ![syedhannan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/syedhannan/32/72932_2.png) [@syedhannan](https://discourse.nodered.org/u/syedhannan)\
**Post date:** [29 December 2022 10:48 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/11 "2022-12-29T10:48:05Z")

</div>

Yes it is what I was trying to achieve

---

<div class="post-metadata">

**Author:** ![syedhannan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/syedhannan/32/72932_2.png) [@syedhannan](https://discourse.nodered.org/u/syedhannan)\
**Post date:** [29 December 2022 11:02 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/12 "2022-12-29T11:02:30Z")

</div>

Sorry I am new to node red.  
You mean I should use the developer tools right or is there any other way to look at the code.

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [29 December 2022 11:08 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/13 "2022-12-29T11:08:39Z")

</div>

The source of the MQTT Broker config node is here:

> <https://github.com/node-red/node-red/blob/b3ce0c007907b93aeb52e13631597ff258719254/packages/node_modules/%40node-red/nodes/core/network/10-mqtt.html#L545>

We don't have good docs on the `RED.tabs` API, but that's what you'll want to use here.

---

<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:** [29 December 2022 15:36 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/14 "2022-12-29T15:36:17Z")

</div>

> [@syedhannan](#):
>
> Sorry I am new to node red.

In that case, are you sure that it is a good idea to leap in at the deep end, creating new custom node types (if that is really what you are doing), before getting some good experience working with node-red?

---

<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:** [12 January 2023 15:37 UTC](https://discourse.nodered.org/t/is-there-a-way-to-create-tabs-inside-the-editor/72863/15 "2023-01-12T15:37:10Z")

</div>

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