Customize your CAWI surveys look

Overview

In this guide we will describe how to upgrade your CAWI to the Enhanced CAWI Themes as well as how to setup and manage the new CAWI Themes. 

This guide includes the following topics:

• Upgrade a survey using old CAWI to Enhanced CAWI 
• Setup & Use the Enhanced CAWI 
• Creating Project & Organization Themes

Please note:

1. If you are not able to see the option to upgrade contact our support (support@dooblo.com)
2. Surveys in Production need to be changed to Test/Draft before the upgrade and then once tested deploy back to Production, a message will be prompt as below 
   
3. Once you upgrade to the new Themes you will be able to revert back but that will mean that all settings set will be removed. 
4. Surveys that were upgraded to the new Themes will not be able to be opened by older Studio versions. (?)
5. Built-in Themes can't be edited you can only Duplicate or Save As in order to create a customized theme as long as the user has the proper permissions (Org or Project).

Steps

Upgrade a survey using old CAWI to the Enhanced CAWI

1. Navigate to the 'CAWI' tab under the survey 
2. Click on 'Apply Upgrade'
   
3. A warning message will prompt click 'Proceed' to continue
   

Setup & Manage the Enhanced CAWI

Once upgraded the CAWI tab will be embedded in the screen and will include the following tabs

• Display - Will include all the survey interface configuration 
  
  • Header - Setup The Logo and page Title along with their alignment
    
  • Footer - Setup the way the footer will be displayed, add help link.
    
  • Progress Bar - setup the progress bar display 
    
    • Type - Choose the type of progress bar to display Percent, X/Y, No Count indication. 
      
    • Position - Control the position of the progress report on top on the bottom.
    • Alignment - Control whether the progress will be aligned Left/Right/Center.
  • Interface options - Set the number of questions shown per page, surveyor instructions, Show/Hide the back button, Show/Hide Home/End buttons and whether or not to show the option to clear answer.
    
• Style - Will allow you to use one of the built-in themes and create new ones, in the list you will find both the Organization & Project Themes (Scroll down further to read more)
  
  • Themes - Choose to use one of the built in themes or Create your own.
    
    • Select a Theme to use - We have 4 built in themes: Baseline, Calm Sea, Dark Ice & Orange Blossom.
      
    • Filter Themes - Use this filter to find the theme that you would like to use.
      
    • Edit Theme - choose the theme that you would like to edit and click on the pencil on the top right corner (Will open the Theme Editor described more below)
      
    • Create New Custom Theme - Select on of the themes and click on 'Save As Custom Theme' on the top right corner to create your own theme (Will open the Theme Editor described more below and will be saved to the Project Themes) 
      
      • Give the Theme a Name and Description and click 'Save'
        
      • Use the Editor to change the Primary/Secondary/Background Colors and set the Fonts and default Font and click 'Save Changes'
        
      • When the below screen prompts click 'OK' to confirm
        
        Please Note: this option will open the Project Theme Editor that was described above.
  • Survey Color Scheme - To override some of the Color Scheme settings for a specific survey you can change these settings
    
  • Survey Fonts - To override the default & other fonts for a specific survey you can change these settings
    
• Custom CSS - Use a Custom CSS file 
  Enable the 'Apply Custom CSS/JS' option to use a custom CSS file
  • Upload CSS File - Click to upload your CSS file.
    • Download Current CSS - Click to download the current CSS file used in the survey. 
    • Download Default CSS - Click to download the default CSS file for editing and re-usage.
  • Upload JS File - Click to upload you JS file.
    • Download Current JS - Click to download the current JS file used in the survey.
      
• End Pages - Setup the End Pages redirects, you can choose between using our Default page and your customized.
  Click on 'Preview' to get a preview of the pages
   
  • Default SurveyToGo End Pages
     
    • Contact Information - Add up to 2 different contact information to be displayed at the end pages.
      
    • Page Configuration - When using the SurveyToGo End pages the layout and page will remain constant but you can Add your own text by clicking on 'Edit HTML'
      
      Add & Customize the text you would like to display and click 'OK'
      
  • Custom Pages - Add your own URL according to the different end pages available, remember you can use parameters from the link and answers from variables within the survey, read more how here.
    
• Configuration -
  • Administrative - Enable the Package Authoring & hiding the navigation bar on test link
    
  • Quotas - Enable & choose to use the Quotas and which quotas type to use
    
  • Location - Enable the option to capture Geo Location during the interview
    
  • Progress - Setup the options related to the interview progress 
    
    
    • Do Not allow to stop & Continue
    • Block Auto Advance
    • Max time to restart 
  • Revert Style - Revering back to old themes style can be done by clicking on ‘Revert’, please note this will remove all the new themes and setup if you have used CSS or JS they will be removed as well and you will need to start from the basics. 
    
    Click 'OK' to confirm the process
    
    
    
• Distribution - Setup how you will distribute the survey 
  
  • Create Respondent Links - Please click here to learn more
  • Notify By Email - Please click here to learn more
  • Create Popup Invitation - Please click here to learn more
  • Create Test Link - Click here to create a test link and test the survey
  • Web Client URL - Click here if you would like to use your own domain as the survey link, click here to learn more.
  • Email Connectors - Please click here to learn more

Creating & Managing Organization/Project Themes

According to your Role and Permission you will be able to Create/Edit/Delete themes for your organization and/or projects. 

Under the security - Security Roles node there is a new Section for both Organization & Project roles which provides the access to create/manage the themes.

• Organization Themes -  Can be created and added by Organization Administrators only that are assigned with the permission called 'CAWI Themes Editor' and can be done by double clicking on the option 'CAWI Theme Editor' in the main organization Node
  
• Project Themes - Can be created by a users that are assigned with the permission called 'CAWI Themes Editor' for the project and can be done by double clicking on the option 'CAWI Theme Editor' under the CAWI Node for the project
  
• CAWI Theme Editor - The CAWI Theme editor will be opened whenever you will try to create/update a theme either for the Organization/Project. 
  • How to determine which Editor is currently open
    • Organization Editor - will only state 'Theme Editor' 
    • Project Editor - Will show 'Theme Editor with the Project Name'
       
  • Theme Editor Layout and options
    
    
    1. Editor Tab - Helps to determine if you are working on Organization Themes or Project Themes
    2. List of Project Themes available - will be displayed only when in Project View (In Organization view it will Show the 'Organization Themes')
       
    3. Dooblo Themes - List of Dooblo Default themes which can not be edited but can be copied and used as the base of a new theme.
    4. Color Scheme - Edit and update the color schemes for your themes.
    5. Fonts - Edit and update the fonts for your themes and set the default font.
    6. Save As Custom Theme - Click to create a new Theme. 
  • Dooblo Theme Options - Click on the Arrow on the right corner of the theme - You can either view the details or Duplicate the theme and customize. 
    
  • Organization/Project Themes Options - When using the project themes you have additional options 
    • Duplicate Theme - allows you to duplicate the theme and then edit it
    • Edit Details - Allows to edit the current theme
    • Delete Theme - will delete the theme from the list and will not be available for use, Please note: It will prompt with surveys using this theme and they will continue to work until you enter the designer and be asked to change it.
    • Turn To Organization Theme - click to convert the theme to organization theme (you will need organization permissions to do so).
    • Surveys Using Theme - Click to get the list of surveys that are currently using the theme.