- We can see that ambari has it's image files and web contents present inside the "/usr/lib/ambari-server/web/" directory. This directory contains all the static stuff that are needed by the UI.
.
- Suppose we want to make changes to ambari UI logo. That can be accessed from the URL:
http://localhost:8080/img/logo.png http://localhost:8080/img/logo-white.png
- In this example we will try changing the "logo-white.png". So in order to do that we will need to get our own logo like
http://test.example.com/jboss/wp-content/uploads/2015/09/MM-Banner-logo.png
Now we want to use the above image as ambari "logo-white.png". So in order to do that in need to do the following:
# mkdir /tmp/images # cd /tmp/images # wget http://test.example.com/jboss/wp-content/uploads/2015/09/MM-Banner-logo.png # mv MM-Banner-logo.png logo-white.png # gzip logo-white.png
- We have converted out images in compressed format. We can see the file as following, which we will need to move inside the "/usr/lib/ambari-server/web/img" directory.
# ls -l /tmp/images/logo-white.png.gz -rw-r--r-- 1 root root 41532 Nov 13 05:46 ./logo-white.png.gz # cp /tmp/images/logo-white.png.gz /usr/lib/ambari-server/web/img/ mv: overwrite `/usr/lib/ambari-server/web/img/logo-white.png.gz'? y
.
Now we should be able to open the ambari UI after refreshing the browser.
Refresh the browser (make sure to clear the old cache data from browser) Or open ambari UI in (Google chrome menu "File --> New Incognito Window")
.
Notice: The top left corner of the page that ambari UI where the logo is changed. Same way we can also make changes in the Style sheets (css) as well.
.
.
