Create and Activate a Theme

This applies to: Visual Data Discovery

You can create and activate your own themes to use in the Symphony UI.

To create and activate a theme:

  1. Set up the JSON file that describes your theme. Download and use the JSON files provided with the supplied modern and dark themes to get started or create your own.

    • To use the JSON files for either the modern or dark theme as a template for your own, retrieve the theme JSON file using the /api/customization/themes/name/<name> API endpoint in a GET request. The following request obtains the JSON for the modern theme.

      curl -X GET "http://<ip-address>:<port>/composer/api/customization/themes/name/modern" -H "accept: application/vnd.composer.v3+json"

      where <ip-address> is the IP address or host name of your Symphony instance and <port> is its port.

      The JSON is provided in the response from the request. You can download the JSON and review and alter it as needed.

    • You can create a JSON file that describes your theme. A sample is provided in Sample Themes JSON File.

  2. Use the /api/customization/themes/ API endpoint in a POST request to create the theme. Use the text of your JSON file as the body ("content": "<string>") of the request. Be sure to remove the "system": true and "id": "<string>" properties from the JSON file before you use it to create a theme. Symphony automatically generates an ID for the theme and sets the value of the "system" property when the API request to create the theme is processed.

    If you want to specify a master theme, provide the theme name in the masterThemeID property. Master themes are optional, but allow you to identify the Symphony-supplied theme from which properties should be inherited by a custom theme, if the properties are not specified in the custom theme JSON. Master themes can only be Symphony- supplied themes. See Supplied Themes.

    The following shows a sample request to create a theme based on the supplied modern theme, but using the supplied composer theme as its master theme.

    At this time, you can only tailor theme colors. Other tailoring properties (such as fonts or font sizes) should not be changed.

    curl -X POST "<ip-address>:<port>/composer/api/customization/themes" -H "accept: application/vnd.composer.v3+json" -H "Content-Type: application/json" -d "{ \"masterThemeId\": \"composer\", \"name\": \"<theme-name>\", \"content\": { <JSONcontent> } }

    where <ip-address> is the IP address or host name of your Symphony instance, <port> is its port, <theme-name> is the name of your new theme, and <JSONcontent> is the JSON content for your theme.

  3. List the available themes using the /api/customization/themes API endpoint in a GET request. For example:

    curl -X GET "http://<ip-address>:<port>/composer/api/customization/themes" -H "accept: application/vnd.composer.v3+json"

    where <ip-address> is the IP address or host name of your Symphony instance and <port> is its port.

    A list of the themes defined to your environment is provided in the body of the response output with their theme IDs and names.

  4. Locate your theme in the list of themes and note its theme ID and name.

  5. Activate the new theme using the /api/customization/themes/activate API endpoint in a POST request to activate the theme. The following request activates the supplied dark theme.

    curl -X POST "http://<ip-address>:<port>/composer/api/customization/themes/activate" -H "accept: application/vnd.composer.v3+json" -H "Content-Type: application/json" -d "{ \"<theme-id>\": \"<theme-name>\"}"

    where <ip-address> is the IP address or host name of your Symphony instance and <port> is its port.

    The theme is set as the active theme for the UI. You must refresh your UI screen to see it.