How to Brand your Surveys

You can brand your surveys using your organization's style and logos to fully own and identify it.

This article contains information on how to design surveys (e.g., fonts, colors, spacing) using CSS. 

1. Create Custom CSS Rules
2. Apply your Custom CSS Rules

Create Custom CSS Rules

1. Create a survey.
2. In the main Surveys window under Visitor Engagement, select the survey and click Preview. 
3. Use the browser console to inspect the HTML and CSS elements and edit the style of the survey.
   
    
   Surveys
    

4. Create custom rules for the desired survey elements. 
   
   For example - change the color of list items to red by creating the following CSS rule:

    #cas li {color:red;}

   
   
   Survey Preview
   
   Note - create CSS rules that will apply for surveys only by specifying the element ID (for example - the survey div ID is #cas).

Apply your Custom CSS Rules

1. Add the custom CSS rules to [CardioLog Installation Folder]\CardioLog\Styles\customSurvey.css. When custom rules are added to this file, changes will only apply to the surveys' preview in the CardioLog user interface, so you can test your changes.
   [CardioLog Installation Folder] - by default, CardioLog is installed on "C:\Program Files\Intlock\CardioLog\".
   
   
   
   
2. Add the custom CSS rules to [Installation Directory]\CardioLogAgent\custom.css. When custom rules are added to this file, changes will apply to the surveys that appear in SharePoint.
   [Installation directory] - by default, the CardioLogAgent folder is located in the CardioLog Installation folder. If the CardioLog Analytics SharePoint feature is installed, the CardioLogAgent folder is located on all SharePoint WFEs (Web Front Ends) under the SharePoint website "_layouts" folder.