Adding custom fonts

Learn how to add custom fonts to Analytics Content Hub.

By default, Analytics Content Hub provides a set of common fonts that you can use to modify the appearance of text within your applications. You can also add custom fonts to the already existing options.

Before you begin

You need a CSS file with the custom font definition.

Important: You can add custom fonts only from the operating system with Analytics Content Hub installed. It is not possible to enable a custom font through web interface.

Procedure

  1. On the Analytics Content Hub server, open the File Explorer.
  2. Navigate to the <install_directory>\app\node1\tomcat\webapps\theia\modules\myCustomFonts\fonts directory.
  3. Create a folder that is the root folder for all custom fonts.
  4. Copy the CSS file with the custom font definition and paste it in the root folder.
  5. Go back to the myCustomFonts folder and open the index.js file in a text editor.
  6. Copy the following code snippet and paste it into the main section of the manifest.json file.
    importCSS('fonts/folderName/fileName.css');

    Replace the folderName with the root folder name and fileName with CSS file name.

  7. Copy the following code snippet and paste it at the end of the manifest.json file, right before the closing brace.
    registerTypeface({
    fontId: 'fontId',
    fontName: 'fontName',
    weights: [fontWeights],
    styles: [fontStyles],
    category: 'fontCategory'
    });

    Replace the following values with real values that match the CSS font definition: fontId, fontName, weights, styles, and category.

  8. Save the index.js file.
  9. Go to the <install_directory>\app\node1\tomcat\webapps\theia directory.
  10. Edit the config.json file.
  11. Find the modules entry and register the custom font as in the following code snippet:
    "modules": ["myCustomFonts"],
  12. Save the config.json file and refresh the browser.

    The custom font is now available during Analytics Content Hub installation.