# Help Needed: Modifying Dashboard Title and Adding Logo in Node-RED

**URL:** https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405
**Category:** General
**Tags:** node-red-dashboard, dashboard-2
**Created:** [15 October 2024 11:14 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405 "2024-10-15T11:14:28Z")
**Posts on this page:** 11
**Page:** 1

<div class="post-metadata">

### Author: ![Nandhini-Subramaniya](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nandhini-subramaniya/32/92882_2.png) [@Nandhini-Subramaniya](https://discourse.nodered.org/u/Nandhini-Subramaniya)
#### Post date: [15 October 2024 11:14 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/1 "2024-10-15T11:14:28Z")

</div>

I am currently working on customizing my Node-RED dashboard, and I have a couple of issues I need help with.

1. **Changing the Dashboard Title** :

- I attempted to change the title by modifying the `index.html` file in the Node-RED installation directory. However, the changes are not reflecting when I access the dashboard at `http://localhost:1880/dashboard/`. Is there a specific way to change the dashboard title that I should be using?

1. **Setting a Logo** :

- Additionally, I want to add a logo to the title section of the dashboard. I’ve included an `<img>` tag in my HTML but haven’t been able to get it to display properly. Can someone guide me on how to do this?

1. **method i tried to set a title**  
in setting.js file,modified the editortheme as

but this will edit in the node-red editor but it is not modifying in the node-red dashboard flows.

---

<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: [15 October 2024 12:14 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/2 "2024-10-15T12:14:26Z")

</div>

> [@Nandhini-Subramaniya](#):
>
> I attempted to change the title by modifying the `index.html` file in the Node-RED installation directory. However, the changes are not reflecting when I access the dashboard at `http://localhost:1880/dashboard/`. Is there a specific way to change the dashboard title that I should be using?

When you say "Title", do you mean the name of your application as it appears in the browser tab? This uses the active Page's name.

> [@Nandhini-Subramaniya](#):
>
> **Setting a Logo** :

I think [this](https://dashboard.flowfuse.com/nodes/widgets/ui-template.html#page-name-app-bar-title) documentation may help you here

---

<div class="post-metadata">

### Author: ![Nandhini-Subramaniya](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nandhini-subramaniya/32/92882_2.png) [@Nandhini-Subramaniya](https://discourse.nodered.org/u/Nandhini-Subramaniya)
#### Post date: [15 October 2024 12:36 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/3 "2024-10-15T12:36:09Z")

</div>

yes I'm working with the Node-RED dashboard and I want to modify the title that appears in the browser tab. Specifically, I'm using the **UI page** node with the **Name** field left **empty** (intentionally), so that it doesn't display on the dashboard page itself. However, when the Name is empty, the browser tab defaults to "Node-RED Dashboard."

Even though I want the UI page name to remain blank, I would like to **change the title** that appears in the browser tab. It seems to be getting this default from the `index.html` file, but modifying that file isn't having any effect.

---

<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: [15 October 2024 12:48 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/4 "2024-10-15T12:48:04Z")

</div>

In which case, currently, the only way to control that is by modifying the Page's name. You can do that in the sidebar:

 ![Screenshot 2024-10-15 at 13.47.42](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/1/7/177673eb5442dec4fa0621fb13ecb12f505dc3e6.png)

Click the "Edit" button of the page, and you can change it's name.

---

<div class="post-metadata">

### Author: ![Nandhini-Subramaniya](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nandhini-subramaniya/32/92882_2.png) [@Nandhini-Subramaniya](https://discourse.nodered.org/u/Nandhini-Subramaniya)
#### Post date: [16 October 2024 05:12 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/5 "2024-10-16T05:12:55Z")

</div>

I'm currently working on a Node-RED dashboard and I would like to replace the default page title icon (favicon) with a custom icon for my project. Specifically, I want to set the icon to my company's logo (`*.png`).

I've already tried modifying the `index.html` file to change the title and add the icon, but the changes are not being reflected when I access `http://localhost:1880/dashboard`.

Here are the steps I've taken so far:

- Updated the title and link tag for the favicon in `index.html`.
- Set the page title using the `ui_page` node, but I want the browser tab title to reflect "some title" along with the custom icon.

However, the default "Node-RED Dashboard" title and icon are still showing up. How can I properly replace the page title icon with my custom `*.png` icon in the Node-RED dashboard?

---

<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: [16 October 2024 06:05 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/6 "2024-10-16T06:05:45Z")

</div>

You do not need to modify the `index.html`, we support this in the Editor as of the latest version (you may need to update): [Config: UI Base ui-base | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/nodes/config/ui-base.html#application-icon)

On that same configuration page you can turn off the rendering of the page name (but still keep the underlying names on the relevant pages to show in the broswer tab) by toggling off "Show Page Name"

To get to this configuration, you click "Edit Settings" at the top of the Dashboard 2.0 sidebar in the Node-RED Editor

---

<div class="post-metadata">

### Author: ![Nandhini-Subramaniya](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nandhini-subramaniya/32/92882_2.png) [@Nandhini-Subramaniya](https://discourse.nodered.org/u/Nandhini-Subramaniya)
#### Post date: [16 October 2024 09:10 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/7 "2024-10-16T09:10:52Z")

</div>

i followed the steps

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

yes i tried the way what your suggested, but the title and icon is not modified in the node red dashboard.  
instead i m getting these type of errors.  
:1880/home/nandhini/home-dev/node-red/packages/node\_modules/node-red/home-ui/home-login/public/home.png:1

Failed to load resource: the server responded with a status of 404 (Not Found)

---

<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: [16 October 2024 09:21 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/8 "2024-10-16T09:21:53Z")

</div>

> [@Nandhini-Subramaniya](#):
>
> Failed to load resource: the server responded with a status of 404 (Not Found)

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

You should either serve your icon or use a known working URL

Try using `https://i.sstatic.net/OLca0.png`

![](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/2/82db9aa03fede076e9aecf7fd7d4b0f177a50d6c.png)

---

<div class="post-metadata">

### Author: ![LoganathanSambath](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/loganathansambath/32/92841_2.png) [@LoganathanSambath](https://discourse.nodered.org/u/LoganathanSambath)
#### Post date: [16 October 2024 10:00 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/9 "2024-10-16T10:00:53Z")

</div>

This file changes fixed the Dashboard Title  
node\_modules/@flowfuse/node-red-dashboard/dist/assets/index-TznpjNEy.js (Works)  
createBaseVNode("h1",null,"Node-RED Dashboard 2.0",-1)  
document.title="Node-RED Dashboard 2.0"

---

<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: [16 October 2024 10:08 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/10 "2024-10-16T10:08:30Z")

</div>

Right, but you don't need to, nor should you need to, make source code changes on Dashboard to correct this.

The method I have shared above, by changing the Page Name, will update the Title in the browser.

---

<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: [14 January 2025 10:09 UTC](https://discourse.nodered.org/t/help-needed-modifying-dashboard-title-and-adding-logo-in-node-red/92405/11 "2025-01-14T10:09:29Z")

</div>

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