# Displaying the value above the node

**URL:** <https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088>\
**Category:** General\
**Created:** [13 April 2021 09:04 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088 "2021-04-13T09:04:08Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![jake123](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jake123](https://discourse.nodered.org/u/jake123)\
**Post date:** [13 April 2021 09:04 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/1 "2021-04-13T09:04:08Z")

</div>

Is there a way to display the value of the node above the node itself.  
Lets say u have inject node set to boolean(true). Is there a way or a node that will display the msg.payload above the node.

 ![fsafasfa](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/c/ac1bb2c4d6f1eea221cb9ce8822b66f0563942c4.png)  
Something like this  
Like websocket node has text connected or disconnected underneath it

---

<div class="post-metadata">

**Author:** ![droberts](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/droberts/32/40295_2.png) [@droberts](https://discourse.nodered.org/u/droberts)\
**Post date:** [13 April 2021 09:15 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/2 "2021-04-13T09:15:14Z")

</div>

Sounds like you want something along the lines of the below in your function node, which looks like the image. Documentation here: [Adding Status](https://nodered.org/docs/user-guide/writing-functions#adding-status)

```auto
if(msg.payload === true) {
    node.status({fill:"green", shape:"dot", text:msg.payload});
}
else {
    node.status({fill:"red", shape:"ring", text:msg.payload});
}

```

---

<div class="post-metadata">

**Author:** ![jake123](https://avatars.discourse-cdn.com/v4/letter/j/ac8455/32.png) [@jake123](https://discourse.nodered.org/u/jake123)\
**Post date:** [13 April 2021 09:20 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/3 "2021-04-13T09:20:16Z")

</div>

Exactly that! Can i somehow make the font size bigger tho?  
And can i get the status above the subflow node?

---

<div class="post-metadata">

**Author:** ![droberts](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/droberts/32/40295_2.png) [@droberts](https://discourse.nodered.org/u/droberts)\
**Post date:** [13 April 2021 10:03 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/4 "2021-04-13T10:03:19Z")

</div>

With a bit of difficulty!

You'll need to edit your settings.js to use a custom theme file (code block 1), then add code block 2 to said css file. The path is platform dependent, but for this a file that is simply called themes.css in your NR directory will suffice. Ignore my dark theme, you'll just get the transformed label. Feel free to play with it in terms of size, colour and position. This does affect ALL statuses on ALL nodes, which may or may not be what you want.

```auto
    editorTheme: {
		page: {
			css: [
				"C:/Users/jake123/.node-red/theme.css"
			]
		},
        projects: {
            // To enable the Projects feature, set this value to true
            enabled: false
        }
    }

```

```auto
.red-ui-flow-node-status-group {
	transform: translateY(-15px);
}
.red-ui-flow-node-status-label {
	font-size: x-large;
}

```

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

I worked this out using inspect element in chrome, get a bit familiar with that and you can work out how to theme the entire editor!

---

<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 April 2021 11:18 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/5 "2021-04-13T11:18:47Z")

</div>

Just don't get carried away 🙂 The Editor is not designed as a dashboard.

Also, don't forget that the debug node also has status on it so you don't need a function node for that.

---

<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:** [27 April 2021 11:19 UTC](https://discourse.nodered.org/t/displaying-the-value-above-the-node/44088/6 "2021-04-27T11:19:44Z")

</div>

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