1. Help Center
  2. Study Configuration and Form Building

Theme/Appearance Customization Overview

Customize Your Studies from the Top Down

TrialKit was created to be an internal solution for its users. As such, it can be customized from  several areas for your studies. This helps provide custom content to your users and differentiate the study you have created. As an example, content customization allows you to provide instructions, notifications, or contact information to users that is specific to a particular study.

The site appearance (theme) can be customized for the Host account as a whole and the theme for each study can be customized. This is why a similar Theme Manager option is seen in the following two locations:

Web Browser:

Website Host > Host Theme Manager:


b132281d-b54d-4965-aca4-40db1507ffc6

 

Study > Study Logo and Theme:


3fe4029f-3145-4266-ba64-580b29ed8d60

 

To elaborate, if there are multiple studies running on your account, the appearance can be set to dynamically change when you switch between those studies. If the theme is not customized at the study level, it will default to the account (host) theme. If the account theme has not been customized, it will default to the standard TrialKit theme as shown above. Here's an example of a site that has been customized:

2022-10-10_15-03-55

Below are the various elements which can be edited. See each number and the matching area where it applies on the screen below.

2022-10-10_15-06-29

  1. Foreground Color - Menu bar - TrialKit Theme color is 208FBF.

  2. Alternating Line Color - Rows of tables anywhere throughout the system. The enrollment table above is an example. The trialKit Theme is D4EDF8.

  3. Logo Image - Shown at the left of the header area at the top.

  4. Header background - Shown in the header area at the top.

  5. Box Header - Shown in the header of the boxes on the right side of the page.

  6. Title Bar - The column header on tables throughout the system. The enrollment table shown above displays an example.

Additionally, the Home page and Contact Us page content can be tailored for both the host and study levels.

When updating the logo or theme appearance, in order to see the changes right away after saving, it is often necessary to perform a hard refresh on the browser. In Chrome, this in Cntrl+F5 on a PC, or Cmd+shift+R on a Mac/Linux.