Change Kibana Logo in Kibana5.4 version

[Leela_Kodali]

Hello Experts,
I need some help, i am trying to change kibana logo, i have png image i want to replace png image with Kibana logo, i tried few things but no luck

1. kibana\src\ui\views\chrome.jade i change the code to background-image: url(" WM-Logistics-Logo.png");
   and place the png file in kibana\src\ui\public\images

2. convert png to svg and replace kinaba.svg in kibana\src\ui\public\images without any changes in chrome.jade (replace with original code)

3. convert png image to byte 64 and change code in chrome.jade background-image: url(" BYte64 info");

tried all these 3 options but no luck can you please suggest how to change logo? I am using Kibana 5.4.

Thanks,
veni

[Leela_Kodali]

No Worries, i followed below suggestion, it is working now.

Like as the solution from Tat Dat Pham,

you can also modify [kibana directory]/src/ui/views/ ui_app.jade

At the line 96: | Loading MY fancy statistics
for edditing you own loading dashboard text

At line 107: include your own style file bundleFile('MY.style.css');

it would look like this:
var files = [
bundleFile('commons.style.css'),
bundleFile('MY.style.css'),
bundleFile('#{app.id}.style.css'),
bundleFile('commons.bundle.js'),
bundleFile('#{app.id}.bundle.js')
];

and in the path Daya mentioned

"/usr/share/kibana/optimize/bundles/"
include your MY.style.css file.

In your own CSS file you can override every Style you want like

.global-nav .logo-small.kibana,
.global-nav .logo.kibana
{
background-color:#333333; /* override the pink background /
background-image: url(MY_Logo.svg); / replace kibana Logo */
}

So there is no need to remove any kibana's original files, for your content.

When you modified the .jade files you need to restart elastic search.

After that you can edit your MY.style.css file and simply reload your browser window for styling changes.