Put app version in navigator menu

What product/components do you use and which version/fix level are you on?

Cumulocity IoT (backend 1014.0.172 frontend 1011.0.4)

Is your question related to the free trial, or to a production (customer) instance?

Customer license

Hi it’s Luca from DAC System.
I’m developing a custom application based on Cumulocity Cockpit. We would like add the version of our app in the position shown in the figure below

Is it possible?

Best regards

Hi Luca,

I don’t know how to display the app version at this particular position, which you are highlighting. You could also place the app version in the user menu:


This quite easy to achieve. Simply create a new module, which consists of one component. This component is added to the user menu:

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { CoreModule, DynamicFormsModule, UserMenuService } from '@c8y/ngx-components';
import { AppVersionComponent } from './components/app-version.component';

  imports: [CoreModule, DynamicFormsModule, CommonModule],
  declarations: [AppVersionComponent],
  entryComponents: [AppVersionComponent],
  providers: [AppVersionComponent],
export class AppVersionModule {
  constructor(private userMenu: UserMenuService) {
      template: AppVersionComponent,
      priority: -1,
      click: undefined,


import { Component } from '@angular/core';
import versionJson from '../../../../version.json';

  selector: 'app-components',
  templateUrl: './app-version.component.html',
export class AppVersionComponent {
  public appVersion = '';
  public appBuild = '';

  constructor() {
    this.appVersion = versionJson.version;
    this.appBuild = versionJson.buildNumber;


<li class="dropdown-header bg-gray-white text-pre-normal" style="margin-top: -1px">
  <div class="d-flex d-col j-c-start">
    <span class="text-muted text-truncate"> {{ 'My app name' | translate }}</span>

    <span class="text-primary"
      >Version: <strong>{{ appVersion }}</strong>

    <span class="text-primary"
      >Build: <strong> {{ appBuild }}</strong>

Best regards

1 Like

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.