What is a Design Theme
What is a Design Theme
Design themes are used to control the style of your dashboard and contextual tile collections. By controlling themes independent of collections it allows for more consistent design application across collections. The theme is applied to a collection and some options from the theme are made available at the tile/chart level. To see the theme properties and their collection application see the Theme Properties and Theme Tile Application.
Default Design Themes
Environment Default Theme: A default theme is provided when a new Verb tenant is created. This theme can be customized or a new theme may be created and set as the default theme. Each environment in a tenant will have a default theme that is used as the default option when creating a new collection.
Collection Default Theme: Each collection has a default theme but different themes can be applied when embedding the collection via SDK or iFrame Key. To change the default theme, select the option from the collection ellipse menu in the header.
Editing Design Themes
When editing a design theme, it is possible to view the changes in the context of an existing collection or with contextual previews (Auto), where the preview canvas will update to show various components based on the property panel with the current settings.
Design themes edits are auto-saved but must be published in order to view the current theme version in the collection editor, collection preview, and embedded collections.
Publishing Design Themes
When theme updates are complete they must be published in order to be seen in the collection editor and embedded collections. When a theme is published the new properties are immediately available on embedded collections, the collection itself does not need to be published to receive the published theme because they are separate entities in Verb.
It is possible to have an unpublished version of a theme and a different, published version of a theme. When there are unpublished changes the design theme list will show an indeterminate icon on the last publish date column.
Not Seeing Theme Updates?
Updated the properties on the theme but don't see in the collection editor?
Please ensure that the design theme was published after the latest updates. To see if there are unpublished changes check the Theme List in the respective environment. The Published Date will be different than the Last Modified Date.
Applied different configurations (colors) to a tile/collection from the editor but the updates are not seen in the embedded collection.
The collection must be republished to apply the new theme applications.
Theme Application (Embedded Collections)
Sometimes Verb admins may want to embed a collection with the same tiles and filters but different colors and styles to fit the viewing end-user’s preferences. A different theme may be applied via SDK or on an iFrame key.
SDK Theme Override
To override the default design theme pass the Theme ID into the themeID property in the SDK.
To get the Theme ID, open the desired theme in the theme editor and pull the GUID from the URL. Then add this to the SDK code provided on the collection embed code.
iFrame Key
To apply a theme to an iFrame Key open the Key Parameters where there is an option to select the theme. By default, the iFrame Key will apply the environment default theme.
Applying Different Themes and Overrides
When creating a collection the admin will select options from the default theme. For example, on a bar chart, the admin may select a color from the default theme’s discrete color palette to apply to the bars. When this selection is made, the position of the color in the palette is saved and will be used to apply colors from other themes when applied to an embedded collection.
Last updated
Was this helpful?