I would like to change the header logo in Kibana 8.3.3.
-
Change Header Logo and Text
-
Change loading Text and Logo
-
Change login page logo and text
-
Change Page Title
I have achieved it by editing following files and re-compressed and replace.
Page Title Name, Loaing Text
Edit template.js file
sudo nano /usr/share/kibana/src/core/server/rendering/views/template.js
Loaing Text
Find the following line and replace the text with your message.
}, i18n('core.ui.welcomeMessage', {
defaultMessage: 'Change this'
Page Title Name
Find the following line and replace the text with your message.
/*#__PURE__*/_react.default.createElement("title", null, "
Change this name"),
Login Page "Welcome to Elastic" Message
/usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js
Search for the text Welcome to Elastic
and replace it with your custom message.
Logo Name, Header elastic logo.
Edit the File
/usr/share/kibana/src/core/target/public/core.entry.js
elastic Logo
Search for the text elasticMark
and continuously you can find the svg data paths of elastic logo. Replace the paths/remove unwanted svg data paths line starting with Object(R.jsx)("path",{d:"
Logo Alternate Text
Object(R.jsx)("title",{id:"elasticMark"},"
your-logo-name")
Elastic Logo SVG (Loading and Login)
/usr/share/kibana/src/core/server/rendering/views/logo.js
You can find svg paths for the elastic logo. You can change it to your own. This will effect login page logo.
Header Logo (small icon)
/usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js
Search for the text LogoElastic
and continuously you can find the svg data paths of elastic logo. Replace the paths, remove unwanted svg data paths line starting with
Object(d.jsx)("path",{className:"outline",fillRule:"evenodd",clipRule:"evenodd",d:""
Take a copy of the files into /tmp and edit the lines and create compressed files.
npx gzip-cli /tmp/core.entry.js -e=gz -e=br
npx gzip-cli /tmp/security.chunk.8.js -e=gz -e=br
npx gzip-cli /tmp/kbn-ui-shared-deps-npm.chunk.220.js -e=gz -e=br
Remove original and Copy the customized files to their respective directories
sudo rm /tmp/security.chunk.8.js /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js
sudo rm /tmp/security.chunk.8.js.gz /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js.gz
sudo rm /tmp/security.chunk.8.js.br /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js.br
sudo rm /tmp/core.entry.js /usr/share/kibana/src/core/target/public/core.entry.js
sudo rm /tmp/core.entry.js.gz /usr/share/kibana/src/core/target/public/core.entry.js.gz
sudo rm /tmp/core.entry.js.br /usr/share/kibana/src/core/target/public/core.entry.js.br
sudo rm /tmp/logo.js /usr/share/kibana/src/core/server/rendering/views/logo.js
sudo rm /tmp/kbn-ui-shared-deps-npm.chunk.220.js /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js
sudo rm /tmp/kbn-ui-shared-deps-npm.chunk.220.js.gz /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js.gz
sudo rm /tmp/kbn-ui-shared-deps-npm.chunk.220.js.br /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js.br
sudo cp /tmp/security.chunk.8.js /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js
sudo cp /tmp/security.chunk.8.js.gz /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js.gz
sudo cp /tmp/security.chunk.8.js.br /usr/share/kibana/x-pack/plugins/security/target/public/security.chunk.8.js.br
sudo cp /tmp/core.entry.js /usr/share/kibana/src/core/target/public/core.entry.js
sudo cp /tmp/core.entry.js.gz /usr/share/kibana/src/core/target/public/core.entry.js.gz
sudo cp /tmp/core.entry.js.br /usr/share/kibana/src/core/target/public/core.entry.js.br
sudo cp /tmp/logo.js /usr/share/kibana/src/core/server/rendering/views/logo.js
sudo cp /tmp/kbn-ui-shared-deps-npm.chunk.220.js /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js
sudo cp /tmp/kbn-ui-shared-deps-npm.chunk.220.js.gz /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js.gz
sudo cp /tmp/kbn-ui-shared-deps-npm.chunk.220.js.br /usr/share/kibana/node_modules/@kbn/ui-shared-deps-npm/shared_built_assets/kbn-ui-shared-deps-npm.chunk.220.js.br
Reference: Custom Logo Kibana 7.10.0 (guide)