Use HTML code in your Forms and email templates to customize the look of your Study
You can use HTML code to change the look of question texts, validation rule texts, help texts, information texts, introduction texts, and email body (in Subject Events). You can for example change the color, size, or force a line break, and insert hyperlinks.
This article describes examples of HTML codes commonly used in Greenlight Guru Clinical. It also describes how to insert the HTML codes in different text fields. For more information and examples of common HTML code styles, you can also visit the following website: https://www.w3schools.com/html/html_formatting.asp
Examples of HTML Codes commonly used in Greenlight Guru Clinical
Bold, Italic, and Underlined Text
You can surround text with <b></b> (bold), <i></i> (italic) or <u></u> (underlined).
<b>Greenlight Guru Clinical</b> Greenlight Guru Clinical
<i>Greenlight Guru Clinical</i> Greenlight Guru Clinical
<u>Greenlight Guru Clinical</u> Greenlight Guru Clinical
Text Size
The text size can be changed by adding <h> in front of the text and </h> after the text. "h" stands for heading and a number should be added in order to specify the type/size of the heading.
3 examples of text sizes:
You can also specify the text size using the following HTML code: <p style="font-size: px">insert text</p>.
3 examples of text sizes (20px, 30px, and 40px):
Text Color
You can change the color of a text using the following HTML code: <p style="color: ">insert text</p>.
4 examples of text colors:
<p style="color: red;">Greenlight Guru Clinical</p>
<p style="color: blue;">Greenlight Guru Clinical</p> 
<p style="color: green;">Greenlight Guru Clinical</p> 
<p style="color: orange;">Greenlight Guru Clinical</p> 
Combine HTML Codes to Increase Size and Change Color
It is also possible to change both the colour and size at the same time using the following HTML code: <h style="color: insert color;">insert text</h>
Examples:
Force Line breaks
You can use the following HTML code to force a line break of a text: <br>insert text</br>
The text in between <br> and </br> will be forced down to the next line.
If the text should be forced down multiple lines, you can add a <br> to the HTML code.
Examples:
Two lines down: <br><br>insert text</br>
Three lines down: <br><br><br>insert text</br>
Insert Hyperlinks
You can insert a hyperlink using the following HTML code: <a href="url">link text</a>
Example:
<a href="https://www.smart-trial.com/">Greenlight Guru Clinical Website</a>
If the hyperlink automatically needs to be opened in a new browser tab, use the following HTML code: <a href="url" target="_blank">link text</a>
Example:
<a href="https://www.smart-trial.com/" target="_blank">Greenlight Guru Clinical Website</a>
Left/Right Align Text
You can left or right align texts using the following HTML code:
<p style="text-align:left/right;">insert text</p>
Examples:
<p style="text-align:left;">Greenlight Guru Clinical</p>
<p style="text-align:right;">Greenlight Guru Clinical</p>
Make Unordered (Bullet) List
You can insert an unordered list using the following HTML code:
<ul><li>Option 1</li><li>Option 2</li><li>Option 3</li></ul>
The <ul></ul> defines that this should be an unordered list and the <il></il> defines each group of the list.
Example:
<ul><li>Treatment A</li><li>Treatment B</li><li>Treatment C</li></ul>
Make Ordered (Numbered) List
You can insert an ordered list using the following HTML code: <ol><li>Option 1</li><li>Option 2</li><li>Option 3</li></ol>
The <ol></ol> defines that this should be an ordered list and the <il></il> defines each group of the list.
Example:
<ol><li>Treatment A</li><li>Treatment B</li><li>Treatment C</li></ol>
How to Insert HTML Codes in Greenlight Guru Clinical
Introduction Texts and Information Texts
HTML codes are inserted in the same way for introduction texts and information texts:
1. Click on the "<>" button:
This will open the console where you can insert the HTML code:
In this example, the <h3></h3> code is combined with the <p style="color: green;"></p> code to make the text bigger, bold, and green.
Other Text Fields
Other text fields are for example: question texts, help texts, validation rule texts, and email texts. For such text fields, the HTML code has to be inserted directly in the text field. The HTML code will only activate once the form is "in use" i.e. when it is previewed or answered in a study in test mode or data collection mode.
Example 1: Question Text
Here the <u></u> and <b></b> codes are used to make sections underlined and bold, respectively:
Example 2: Validation Rule Text
Here the <p style="color: red;></p> code is used to make the validation rule text red:
