# StartBootstrap with Node Red

**URL:** <https://discourse.nodered.org/t/startbootstrap-with-node-red/28219>\
**Category:** Dashboard\
**Created:** [12 June 2020 09:41 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219 "2020-06-12T09:41:03Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![fui86](https://avatars.discourse-cdn.com/v4/letter/f/9fc29f/32.png) [@fui86](https://discourse.nodered.org/u/fui86)\
**Post date:** [12 June 2020 09:41 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219/1 "2020-06-12T09:41:03Z")

</div>

Goodmorning everyone!  
I contact you because I'm new to Node-Red and I'm starting to take my first steps in this fantastic system.

But I need help, as I would like to integrate this Dashboard template on Node Red: [https://startbootstrap.com/themes/sb-admin-2/](https://startbootstrap.com/themes/sb-admin-2/)

Anyone have any idea how it can be done?

Thanks

---

<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:** [12 June 2020 11:44 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219/2 "2020-06-12T11:44:50Z")

</div>

You can create this by using the uibuilder node.

> **[node-red-contrib-uibuilder](https://flows.nodered.org/node/node-red-contrib-uibuilder)**
>
> Easily create web UI's for Node-RED using any (or no) front-end library. VueJS and bootstrap-vue included but change as desired.

---

<div class="post-metadata">

**Author:** ![fui86](https://avatars.discourse-cdn.com/v4/letter/f/9fc29f/32.png) [@fui86](https://discourse.nodered.org/u/fui86)\
**Post date:** [12 June 2020 13:01 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219/3 "2020-06-12T13:01:22Z")

</div>

> [@bakman2](#):
>
> web UI's for Node-RED using any (or no)

How can i import the template i've download from startbootstrap?

---

<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:** [12 June 2020 19:50 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219/4 "2020-06-12T19:50:22Z")

</div>

Add a uibuilder node change the url to suit and deploy it. That creates a new folder on the Node-RED server, in `~/.node-red/uibuilder/<urlname>` (assuming you have a standard installation and are not using projects).

That folder contains `src` and `dist` sub-folders and the src folder will contain the 3 index.{html,js,css) files plus some other things that you may not need. That is the source folder for all of your front-end code so you can put the templates into that folder or a sub-folder of it. Everything in that folder is available in your web pages.

It is quite likely that you will want to replace some of the standard index.html page with some of the template html but you will need to have a play.

---

<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 July 2020 19:59 UTC](https://discourse.nodered.org/t/startbootstrap-with-node-red/28219/5 "2020-07-12T19:59:27Z")

</div>

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