Overriding default logos and application name literals in navigation bars

IBM® Sterling Store Engagement provides options to override the default branding elements such as the IBM logo and application name literal. Override these elements with custom images using font icons, enabling complete customization to align with your organization’s branding and visual identity.

Procedure

  1. Generate a font icon for the desired image. For more information, see Customizing the application style.
  2. Navigate to the extension-config.json.
    /extensions/override-static-assets/root-config/custom/extension-config.json.
  3. Update the extension-config.json to override the value of brandIconClass with the custom font icon class generated in step 1.
    • To override the application name IBM Store literal with a custom image in the top navigation bar, use the following JSON.
      "topnavbar": {
      "brandIconClass": "custom font icon class"
      }
    • To override the IBM logo with a custom image in the side navigation bar, use the following JSON.
      "sidenavbar": {
      "brandIconClass": "custom font icon class"
      }
  4. Run yarn start-app to apply the changes.