CODEWITHSUNDEEP
elasticsearchkibana-4
Sandeep Kumar
Sandeep Kumar

Reputation: 1202

How to change UI of kibana

I am using kibana 4.5.1 . I am visualizing my data in kibana. Its very nice . Now we want to customize kibana UI like replace kibana logo with our company logo and disable some features of kibana and many more…. and want to add some more buttons also...

Upvotes: 4

Views: 12469

Answers (2)

Magesh04
Magesh04

Reputation: 41

Your company logo should be width:252px heigh:45px.

please copy the image into the following folder

/opt/kibana/optimize/bundles/src/ui/public/images/logo.png

Change kibana.svg to logo.png in following files.

/opt/kibana/optimize/bundles/kibana.bundle.js module.exports = webpack_require.p + "src/ui/public/images/kibana.svg"

To

module.exports = webpack_require.p + "src/ui/public/images/logo.png"

/opt/kibana/optimize/bundles/webpack.records: "node_modules/file-loader/index.js?name=[path][name].[ext]!src/ui/public/images/kibana.svg":

To

"node_modules/file-loader/index.js?name=[path][name].[ext]!src/ui/public/images/logo.png":

/opt/kibana/src/plugins/kibana/public/kibana.js:14:const kibanaLogoUrl = require('ui/images/kibana.svg');

To

/opt/kibana/src/plugins/kibana/public/kibana.js:14:const kibanaLogoUrl = require('ui/images/logo.png');

Upvotes: 1

secumind
secumind

Reputation: 1141

This link discusses how to do it. It's important to remember that after you replace the logo file that you need to get kibana to "rebundle" with the new logo which requires something major like a restart of the service or installation of a plugin like: 

/kibana plugin --install elastic/sense

Upvotes: 3

Related Questions