Theming for Published Applications and Data Views – BRYTER | Help Center

What is Theming for Published Applications and Data Views?

Theming for Published Applications and Data Views enables you to apply customer-specific branding beyond Modules to Applications and Data Views, increasing extensibility and creating cohesive and seamless solutions.

The custom themes are built via the Themes Editor in the Admin Console and applied by enabling the respective custom theme in the Environment settings within the Admin Console.

Module embedded in a themed Published Application

Data View embedded in a themed Published Application

Stand-alone Data Views (not embedded in Application) also use configured theme:

Note that theming for Published Applications and Data Views also affects 1) non-themed Modules, 2) logo positioning, and the 3) BRYTER watermark:

Default behavior for non-themed Modules

In the past, if no theme was configured for a particular Module, the default BRYTER black theme would be applied. To ensure a consistent look within Applications of one Environment, the Module Wizard now uses the theme that is configured as the default theme for the Environment.

Note that if you do not use a custom theme, the Application will use the default BRYTER theme.

Module embedded in a Published Application

Data View embedded in a Published Application

The published Module theme selection priority is as follows: 1) specific theme configured for the published Module, 2) Environment default theme and 3) BRYTER default theme.

Logos move from Wizard header to Application header

When a Module Wizard is embedded in an Application it will no longer display a header with a custom logo. Instead, the logo is displayed in the Application header.

However, when the Module Wizard is used stand-alone or embedded in a third-party website, the header with the logo remains visible.

When a themed Module is used within an Application a few components are hidden

The stand-alone Module displays a header, test ribbon, and BRYTER watermark

Display of BRYTER watermark

Each Published Application displays a Built with BRYTER watermark. When a Module Wizard is embedded in an Application it will not display an additional Built with BRYTER watermark.

However, when the Module Wizard is used stand-alone or embedded in a third-party website, you may decide in the theme settings whether to show the BRYTER watermark or not.

Why would you use Theming for published Applications and Data Views?

Corporate identity and branding play a significant role when offering Applications you have built with BRYTER as customers and clients are drawn to a strong brand presence.

While the existing theming mechanism allows you to apply customer-specific branding to Module Wizards already, the new theming mechanism enables you to apply the same themes to Applications and Data Views to create a consistent user experience.

How to use Theming for published Applications and Data Views

As an admin, to set a theme for Published Applications and Data Views, you will need to create a custom theme first. If you have not already, create one by using the Theme Editor in the Themes Library. Note that there are limitations as to which settings can be applied to Applications and Data Views.

Follow the steps below to select a custom theme to be used for all Applications and Data Views within a specific Environment:

Open the Admin Console by selecting your name
Then, open the tab Environments
Select the Environment for which you want to define the theme and select Configure
Enable the option Use a custom theme in the section Environment publishing
Finally, select your theme

Configure in Environments Tab of Admin Console

Custom theme in Environment publishing

The theme is automatically applied to all existing Applications and Data Views in the selected Environment.

⚠️ Note that the theme is also applied to all Module Wizards that have not configured a theme in their respective publish settings.

In the past, if no theme was configured for a particular Module it would use the default BRYTER black theme. To ensure a consistent look within Applications of one Environment the Module Wizard now uses the theme that is configured as the default theme for the Environment.

Known Limitations

Per Environment, you can only set one custom theme for all Applications and Data Views.
While overriding themes can be done with Modules, it is not currently possible for Applications or Data Views.
Because the custom themes and the Theme Editor are primarily designed to customize the look and feel of Module Wizards, the Theme Editor has not been extended to preview Applications and Data Views.
Only a subset of the theme settings applies to Applications and Data Views, other settings are ignored. Below we have listed more details:

Application settings

Application header
- Logo, logo link, and logo alt text
  - Logo size and position are fixed in the Application header and, therefore, ignored
  - Custom logos are scaled to a height of 36 px
- Header background color and box-shadow
- Test ribbon does not reuse any of the theme styles
Navigation sidebar
- Small heading font, size, and color apply to the Application name in the left upper corner
- Text font, size, and color apply to the menu items
  - Additionally, the menu items are rendered in bold
- The primary color is used as a background to highlight selected items
- Text font, size, and color apply to the messaging displayed when there are no menu items available
Text font, size, and color apply to the messaging displayed in the main content area when there are no Modules available to display in the Application.
Layout and other settings are ignored

Data View settings

Background
- The background color used is white rather than a light grey
Title
- Large heading font, size, and color apply to the title
Context menu
- Text font, size, and color apply to the menu items
- The primary color is used as a background to highlight hovered / tabbed item
Reset all filters
- Text font, size, and color apply to the button
Column header
- Text font, size, and color apply to the column header
- Additionally, it is rendered in bold
Cell content
- Text font, size, and color apply to cell content
- Link font, size, and color apply to links in the action column
No records to display
- Medium heading font, size, and color apply to the title
- Text font, size, and color apply to the messaging
Logo, header styles, layout, and other settings are ignored

Custom CSS and custom footers are ignored in both, Applications and Data Views.

FAQ: Frequently Asked Questions

What happens if you select an Environment default theme?

Once you select a default theme for an Environment, the theme will immediately be applied to all Published Applications and Data Views in that Environment. Furthermore, all published Modules in that Environment that do not have a set theme via the Module publishing settings will use the Environment default theme as well.

All other Environments are not affected by that setting.

What happens if you chose a specific theme for your published Module but the defined default Module theme is different?

The specific setting for your published Module has precedence. The theme that you selected for your published Module will be displayed. The Environment theme is merely a fallback.

Published Module theme selection priority:

Specific theme configured for the published Module
Environment default theme
BRYTER default theme

What happens in the cases of law firms, where they want to publish different tools with different client themes?

In this first iteration, this use case is not fully supported for published Applications. Multi-client publishing (which will be available at a later point) might help in that scenario, as you would have one Environment per client. For published Modules, as long as they select the respective customer theme in the published Module settings, it should work as before.

If they select a default theme for LIVE that would then be used for all published modules without a specific theme setting automatically.

What if I do not want any theme to apply to my Module or Data View? E.g. in case, I have it in a Published Application that has an overall theme.

If you do not want your Modules or Data Views to use a theme, you are not required to select a default theme for the Environment. Then, the Published Application will not use a theme either.

In general, the Published Application will use the default theme for the respective Environment. Data Views will use the same theme. For published Modules, it will be the fallback if no Module-specific theme is selected.

Can I use custom CSS or a custom footer?

You may use custom CSS and a custom footer for published Modules. However, Published Applications and Data Views do not support custom CSS or custom footers at this time.