# How can I customize UI? **URL:** \ **Category:** Rancher 1.x\ **Created:** [January 10, 2016, 7:27pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435 "2016-01-10T19:27:16Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [January 10, 2016, 7:27pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/1 "2016-01-10T19:27:16Z")
Hi, I want to run Rancher as a middleware for an education institution digital platform. I would like to customize UI to hack some features (add external links, customize buttons and appearance of the interface) but as long as I can guess through Rancher infomation assets are remotely hosted in a Rancher owned CDN. So, how could I modify Rancher (or Cattle, I am not really sure what I should execute in my server/machine) in order to have a custom UI?? Sorry for my lack or knoledge about Rancher architecture… ---
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [January 10, 2016, 8:06pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/2 "2016-01-10T20:06:47Z")
I guess is a matter of building UI (as [https://github.com/rancher/ui/releases](https://github.com/rancher/ui/releases)) and point to a custom URL when unpacking UI when creating docker image. For example, I could create a custom Rancher Server image modifying [https://github.com/rancher/rancher/blob/master/server/Dockerfile](https://github.com/rancher/rancher/blob/master/server/Dockerfile). Am I right? ---
**Author:** ![vincent](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/vincent/32/7156_2.png) [@vincent](https://forums.suse.com/u/vincent)\ **Post date:** [January 11, 2016, 5:29pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/3 "2016-01-11T17:29:57Z")
In early releases the UI was loaded off our remote CDN. As of several months ago a copy is packaged into each `rancher/server` release and that copy is loaded by default. Repackaging all of that is an option, but there is still a setting to load it from a remote URL instead. We use that for testing, and our CI builds a copy at [https://relases.rancher.com/ui/latest](https://relases.rancher.com/ui/latest) on every commit to master. So you can: - Make your changes - Build the UI with `./scripts/build-static -l -c 'yourserver.com'` (the flag is for a “latest” build, which sets up URLs so that it’s expecting to be served remotely instead of local), - Upload `dist/static/latest` to a web server (you can rename the “latest” part with `-v`) - Change the [http://your-rancher:8080/v1/settings/api.ui.index](http://your-rancher:8080/v1/settings/api.ui.index) from “local” to `//yourserver.com/latest` (if your Rancher is behind a SSL proxy the UI will need to be served SSL too) I would suggest writing all your changes as an [ember-cli addon](http://ember-cli.com/extending/#developing-addons-and-blueprints) and then just adding the one line to package.json to load it, rather than forking the UI and fighting to keep it up to date. If there are generally useful changes to `rancher/ui` that would make customizing the bits you want easier we would likely be amenable to merging PRs for that. ---
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [January 11, 2016, 8:41pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/4 "2016-01-11T20:41:58Z")
Absolutly. Thanks a lot for the info. I think changes could also be interesting (at least those not related to a strictly learning environment) to the rest of the community. ---
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [April 11, 2016, 6:02pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/5 "2016-04-11T18:02:39Z")
I am trying to install the addon, but I get an error: `Registry returned 404 for GET on https://registry.npmjs.org/ui-example-addon-machine` How can I install the example addon in the original UI? UPDATE: I tried [http://benlimmer.com/2015/04/22/installing-an-ember-addon-from-github/](http://benlimmer.com/2015/04/22/installing-an-ember-addon-from-github/) but still get error: ``` BroccoliMergeTrees: Expected Broccoli node, got undefined for inputNodes[0] ``` ---
**Author:** ![vincent](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/vincent/32/7156_2.png) [@vincent](https://forums.suse.com/u/vincent)\ **Post date:** [April 11, 2016, 6:42pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/6 "2016-04-11T18:42:24Z")
I don’t think I ever actually published it to npm, you can clone it locally and then `npm link` it. We are currently changing this up a bit though so you can write a machine driver UI and we’ll load it dynamically from the Machine Drivers settings screen (without rebuilding & hosting the whole UI yourself), so this will become outdated. Will update when that’s available. ---
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [April 11, 2016, 6:58pm UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/7 "2016-04-11T18:58:34Z")
I just was trying to understand how ember-cli addons work. I discovered that installing the addon from github did not add dependencies to package.json, so I added them manually, but… Now I get: `The broccoli plugin was instantiated at: undefined` and still cannot test the addon… ---
**Author:** ![dalareo](https://sea2.discourse-cdn.com/flex022/user_avatar/forums.suse.com/dalareo/32/708_2.png) [@dalareo](https://forums.suse.com/u/dalareo)\ **Post date:** [June 10, 2016, 9:34am UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/8 "2016-06-10T09:34:24Z")
I follow the steps to point my index.html to [http://fricolab.com/latest/index.html](http://fricolab.com/latest/index.html) changing [http://your-rancher:8080/v1/settings/api.ui.index](http://your-rancher:8080/v1/settings/api.ui.index) from “local” to [//fricolab.com/latest](https://fricolab.com/latest) but… I get: HTTP ERROR 404 when trying to access any static asset. Any clue? @vincent If I edit index.html inside Rancher container (/usr/share/cattle/war/index.html) and set assets URL to [//fricolab.com/latest/assets](https://fricolab.com/latest/assets)… I can get my assets to load but I get: _%failWhalePage.header% **%failWhalePage.reloadButton%** %failWhalePage.logoutButton%_ and my-rancher:8080/fail URL in my browser ---
**Author:** ![hiscal](https://avatars.discourse-cdn.com/v4/letter/h/9de0a6/32.png) [@hiscal](https://forums.suse.com/u/hiscal)\ **Post date:** [December 29, 2017, 2:38am UTC](https://forums.suse.com/t/how-can-i-customize-ui/1435/9 "2017-12-29T02:38:07Z")
Hi, all Based on your discussion, If I want to add some links to navigation bar (drop down menu), how can I do it? These links are used to open external urls. Thanks.