Text editor (WYSIWYG)

The text editor allows you to make your text more interesting by changing the font, color, size, adding emoticons and variables to personalize questions. It also allows you adjust your content with HTML. What you adjust in the survey tool is what you will see in the survey itself.


Use the text editor icons to liven up your questions, email invites, and outcome content. Here's the range of icons you'll see:

Text editor (WYSIWYG)- text editor

This guide will teach you:

  1. Text decoration
  2. Text alignment
  3. Media and variables
  4. Extra options

1. Text decoration

Text editor (WYSIWYG)- bold italic underline, font color, font size

  1. These three buttons are the standard buttons to make the content you've selected (highlighted) bold or italic and to underline that part of the text.
  2. The first button lets you choose the font color and the background color (the color behind your content). The second button indicates the font size. Click to access the menu of font sizes, from extra small to extra large.

2. Text Alignment

Text editor (WYSIWYG)- text alignment

  1. Click the alignment icon to choose how your content should be aligned (left, right, centered, or justified).
  2. These two icons allow you to create an ordered or unordered list. Click on the first icon to number each new line. To replace the numbers with alpha, Greek or Roman characters, just click on the arrow for all of the options. The second icon will place a bullet point at the beginning of each line. Click on the arrow that appears next to the icon to change to a different shape.

3. Media and Variables

Text editor (WYSIWYG)- add links, variables, emojis

  1. Use the first button to add a link to the selected (highlighted) word(s). The second button allows you to upload an image. The third button allows you to insert a YouTube or Vimeo video. Note that the Videos will not work in offline mode. 
  2. Variables - (piping variables) When you click this button, you'll see a drop-down list of variables that you can choose to include, such as previous answers, respondent data, content from other questions, or scores. Use variables to personalize the question for respondents to make your questionnaire more engaging. For example, you could add the respondent's first name - you'll find this field towards the bottom of the drop-down list. 
  3. The smiley button gives you a range of emoticons you can choose to add.

4. Extra options

Text editor (WYSIWYG)- clear formatting, code view

  1. Use the first button to clear the formatting of the text. You might want to use this when you have copied your text from another document. 
  2. Click the <> for the code view. Now you can view the HTML code, and edit it as you wish. (Enterprise plan & ReportR plan only!)
  3. The arrow icon will make the text editor full screen and larger.

Use variables in an email invitation or email template to personalize your email without having to set up different emails for each respondent, as the system will do this automatically.

What's next?

  • Add a Custom Button with HTML: Create a Custom Button with HTML and add it into an outcome or the final page of your questionnaire, in order to embed a hidden hyperlink and redirect your respondents to the webpage of your choice. 
  • CSS (Cascading Style Sheets) is a computer language used to adjust the presentation of a HTML or XML document. Adding Custom CSS allows you to change many elements of your design (e.g., make answers larger, make buttons out of links, etc.) that are not included in the Design tab.
  • PDF design settings using CSS: CSS allows you to change other elements of your design (e.g., make answers larger, make buttons out of links, etc.) that are not included in the Design tab. You can make use of the HTML view to preview your changes. 
Support is the author of this solution article.

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.