# How to correctly set href path for CSS files in node-red(inside html file)?

**URL:** https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114
**Category:** General
**Created:** [5 November 2022 06:49 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114 "2022-11-05T06:49:47Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![RavinderSingh13](https://avatars.discourse-cdn.com/v4/letter/r/b38774/32.png) [@RavinderSingh13](https://discourse.nodered.org/u/RavinderSingh13)
#### Post date: [5 November 2022 06:49 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/1 "2022-11-05T06:49:47Z")

</div>

Hello Node-red experts,

Greetings!!

I have directory named `/root/chatBot/static/css` where my css files are residing. After researching from forum I got to know I need to change `settings.js` file in node-red server with entry named `httpStatic` with following:

```auto
    httpStatic: [
          {path: '/root/chatBot/static/', root: "/chatbot/"},
    ],

```

and made href entry as `<link rel="stylesheet" href="/css/frontendBot.css">` but this is not picking up the css. Will be grateful if you could guide on this issue.

**NOTE:** I am hitting link `http://localhost:1880/chatbot` here.

Thanks,  
Ravinder Singh

---

<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: [5 November 2022 07:39 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/2 "2022-11-05T07:39:25Z")

</div>

Firstly I'll not mention the whole "why on earth are you running node-red as root!?!?" and move straight to the questions...

If you watch the network tab in the browsers devtools do you see the failed request for the CSS? What is the full path the browser tried to GET?

Have your tried accessing the CSS directly by entering the URL to the CSS directly in the browser?

---

<div class="post-metadata">

### Author: ![RavinderSingh13](https://avatars.discourse-cdn.com/v4/letter/r/b38774/32.png) [@RavinderSingh13](https://discourse.nodered.org/u/RavinderSingh13)
#### Post date: [5 November 2022 10:02 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/3 "2022-11-05T10:02:14Z")

</div>

Thank you for your reply @Steve-Mcl here. (For root user, thanks for letting know I will change it to some other user but in our environment we have lot of restrictions and process of installing things so I went with it in sandbox, but I will fix it later on for sure).

Coming on to your question yes I checked it dev tools of browser and seeing following error.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/8/983018e0d42fda131bd8dff7624d74cad36b2ae5.png)

Thanks,  
Ravinder Singh

---

<div class="post-metadata">

### Author: ![RavinderSingh13](https://avatars.discourse-cdn.com/v4/letter/r/b38774/32.png) [@RavinderSingh13](https://discourse.nodered.org/u/RavinderSingh13)
#### Post date: [6 November 2022 08:50 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/4 "2022-11-06T08:50:22Z")

</div>

I have made `httpStatic` value commented(as it was before) and placed my `static` folder into `/root/.node-red/` and then mentioned `static/css/filename.css` but its still not working. Any guidance will be helpful here, thank you.

---

<div class="post-metadata">

### Author: ![RavinderSingh13](https://avatars.discourse-cdn.com/v4/letter/r/b38774/32.png) [@RavinderSingh13](https://discourse.nodered.org/u/RavinderSingh13)
#### Post date: [6 November 2022 09:43 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/5 "2022-11-06T09:43:50Z")

</div>

I have found out the solution, following are the steps.

_ **1st:** _ Enter a line `httpStatic: '/root/singh/static/',` basically path of your folder where your `css` and `html`, `js` folders are residing and update them in `settings.js` file of node-red.

**2nd:** Try accessing a sample css file from browser itself to make sure its coming up fine eg: `http://localhost:1880/css/frontendBot.css` if its accessible then we are Good here.

Thanks,  
Ravinder Singh

---

<div class="post-metadata">

### Author: ![zenofmud](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/zenofmud/32/316_2.png) [@zenofmud](https://discourse.nodered.org/u/zenofmud)
#### Post date: [6 November 2022 09:47 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/6 "2022-11-06T09:47:51Z")

</div>

> [@RavinderSingh13](#):
>
> update them in `settings.js` file of node-red.

**3rd:** Stop and restart Node-RED and flush your browser's cache.

---

<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: [20 November 2022 09:48 UTC](https://discourse.nodered.org/t/how-to-correctly-set-href-path-for-css-files-in-node-red-inside-html-file/70114/7 "2022-11-20T09:48:03Z")

</div>

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