What is Theme Builder?

Theme Builder is a tool that allows you to control the colors and styles used in the Smart Onboarding system.  Through Theme Builder, System Administrators and Process Administrators can change the color of web page elements in order to match their company branding. Themes for users can be dependent on their Company, Department, Location, or Business Unit. 

Who can access Theme Builder?

System Administrators and Process Administrators are the two roles that can access Theme Builder.

Role Type	Access to Theme Builder
System Administrator
Process Administrator

How do you access Theme Builder?

You can access Theme Builder from the Menu Icon. Click Theme Builder under Organization Management.

How do you create a Theme?

The first step to Theme Builder is to create a new theme. You cannot modify the delivered theme, but you can create as many themes as you wish.

To create a new theme, click on Add a New Value.

Click Add.

The Description field is required for all themes.  This description is what appears when you select a theme from a search bar.

Under Configure Styles, click on the different elements' names or arrows and customize the colors of your theme.

On the right-hand side, there is a preview. When you change any of the elements, it will change the preview, allowing you to see what it will look like, as well as guiding you through the customization process. You can hover over icons in order to see how the colors will change when a user hovers over icons. 

How does Theme Driver work?

The Theme Driver allows Administrative Users to choose the criteria with which the new theme will be displayed.  Themes for users can be driven by their Company, Department, Location, or Business Unit.  It may make sense for an organization to have a different theme for users depending on their Location attribute, in which case you can have custom themes for each Location.

To change the Theme Driver, navigate to Organization Management through the Menu icon. 

From the Organization Management page, Administrative Users are able to choose the 'Driver' for the theme.  The driver is an attribute that will be used to apply different themes to certain users based on their driver attribute.  If you wish to provide different themes depending on the Department of the user, you would select Department as your theme driver.

After choosing the attribute you wish to drive the theme for the users, create an Attribute Revision in order to attach your newly created themes to the appropriate attributes.  In this example, we are adding our new theme to a particular department.

Under the attribute for which you wish to apply a theme, select the Manage Attributes icon to the right of the attribute.

Under Revision Attributes, at the bottom of the page there are three fields.  Default Theme, Default Logo, and Mobile Logo.  The Default Theme lets you choose from your custom themes and apply that theme to the specific attribute.  Default Logo and Mobile Logo drive which logo that specific attribute is seen on the homepage, and in the top left corner of the navigation bar.  If these fields are left empty, the default theme defined in Organization Management is used.  Note:  An attribute that has multiple 'parent' nodes can inherit their themes as well.  In the screenshot above, the Quality Assurance attribute can see the theme that was applied to Software Development and the ROOT node. 

Save the changes to the attribute and apply the Attribute Revision in order to apply the theme changes.

How do you apply a Theme?

To apply the theme, navigate to Organization Management through the Menu icon. 

From the Organization Management Page, under Default Theme, select the theme you wish to apply. Click on the Default Theme lookup icon.

Select the theme you want to use from the list.

Click Save.

Note: If this is the first time saving in Organization Management, you must fill out the fields that have asterisks before them (also indicated by blue boxes below). To know more about these fields, see the Organization Management page.

Configure Styles

Header

Below is an example of what you can do with the Header Styles:

Onboarding Navigation

Theme changes to the Onboarding Navigation affect what users see when they are completing the onboarding process. 

Below is an example of what you can do with onboarding navigation styles:

Form Controls

Theme changes to Form Controls are seen throughout the onboarding process.

Below is an example of what you can do with Form Control styles:

Footer

Theme changes to Footer are seen throughout the onboarding process.

Below is an example of what you can do with Footer styles:

Miscellaneous

Theme changes to Miscellaneous are seen on the Login Screen.

Can users have multiple themes?

Using the Theme Builder, System Administrators and process Administartors can create different themes for users and configure them specific to their Company, Department, Location or Business Unit attribute. The Administrative Users can choose any one of these attributes as the Theme Driver, so that the users can have customized themes based on that attribute. For instance, if Company attribute is chosen as the 'Driver' for the theme, then the users will have different themes based on their Company.

How to create Switch Themes?

Users who have multiple themes applied to their account are able to switch between themes. Below example shows two different themes with different color and configuration styles. To differentiate, different descriptions are entered for each theme.

In the Organization Management, specify Company as the Theme Driver and click Save.

Create a Process Revision to attach your newly created themes to the Company attribute. Select a value under Company attribute and click on Manage Attributes icon.

Under Revision Attributes, click on the lookup icon of the Default Theme and choose one of your custom themes. Click Save.

Similarly, select another value under Company attribute and click on Manage Attributes icon.

Under Revision Attributes, click on the lookup icon of the Default Theme and choose your second custom theme. Click Save.

On the Process Revision page, click Return to Manage Revision and apply the Process Revision.

To notice the changes, you need to logout and login again into your Smart Onboarding.

How to switch between themes after you have logged in?

After you log in, click on your user name on the top right corner of the navigation bar. You will notice Switch Theme option added to the drop-down list. Select Switch Theme from the list.

This will display the list of themes that you have created including the default that is currently in use. The default theme is displayed as My Organization [ Current ].

Choose a theme from the list to switch to that theme.

You will notice the selected theme changes are applied to your Home Page. These changes are visible to all users that belong to that Company.

Similarly, switch to the other theme in the list.

You will notice the second theme changes are applied to your Home Page.

If you wish to switch back to your default theme, click on the My Organization link in the list.