How Can I add a new tab on the navigation bar in cockpit?


How can I add a new tab on the navigation bar in cockpit and then by clicking on it will route me the new page so that I can see that on a different page.

I already saw the documentation but it didn’t help me.

Could you please help with some suggestions?

Hello @GauravSinha ,

please use this documentation: Cockpit Plugins |

Hope this helps

Hi @jonathan.lukas ,

I already used this document I am able to add a new tab in the navigation bar but my requirement is like how should I use cockpit. navigation and cockpit.route together so that when I click on the tab which I created should redirect me to a new page?

Could you please help me with it ?

Hi @GauravSinha ,

please refer to this example: GitHub - jonathanlukas/camunda-platform-cockpit-plugin: Navigation to external page Plugin Example for Camunda Platform Cockpit Application

I hope this helps.


Hi @jonathan.lukas ,

Thank you :slight_smile: .It works to some extent.

Now I am facing another problem how should I add a HTML file in the path tag from the workspace so that when clicking on the tab it will refer to that html page and opens up.
I have kept my html file in app folder.
I have tried to use bleow path but it is not working.
properties: {
path: “plugin://plugin/plugin-webapp/cockpit-navigation-plugin/app/abc.html”
render: container => {
container.innerHTML = ‘My link

Hello @GauravSinha ,

thanks to the help of @martin.stamm I have extended my example. Now the provided link will redirect you to a custom page.

Hope this helps