HOW WE CAN HELP?

< All Topics

XLSForms- Appearance attributes & Styling prompts

Print

1. Appearance attributes

In XLSForms, the appearance of questions can be altered according to your liking. To achieve this, an appearance column is created. These appearance attributes are:

Multiline

It is used with the text question type. It is best used with web clients, and makes the text box multiple lines long. To achieve this, create an appearance column in the survey worksheet, and input multiline.

Preview of the question on the survey form:

Minimal

Used in select_one or select_multiple question types. The answer choices appear in a pull-down menu. To achieve this, create an appearance column in the survey worksheet, and input minimal.

Preview of the question on the survey form:

Horizontal

Used in select_one and select_multiple question types. This displays the answer choices horizontally, but in columns. Mainly used for web clients only like Enketo. To achieve this, create an appearance column in the survey worksheet, and input horizontal.

Preview of the question on the survey form:

Horizontal-compact

Used for select_one and select_multiple. It is purposed for web clients only, and displays the answer choices horizontally. To achieve this, create an appearance column in the survey worksheet, and input horizontal-compact.

Preview of the question on the survey form:

Likert

Used for select_one question type. Best used with web clients, makes the answer choices appear as a likert scale. To achieve this, create an appearance column in the survey worksheet, and input likert.

Preview of the question on the survey form:

Compact

Used for select_one or select_multiple question types. It displays answer choices side by side with minimal padding and without radio buttons or checkboxes. It is particularly useful with image choices. To achieve this, create an appearance column in the survey worksheet, and input compact.

Preview of the question on the survey form:

Quickcompact

Used with the select_one question type. Same as compact, but auto-advances to the next question (in mobile clients only). To achieve this, create an appearance column in the survey worksheet, and input quickcompact.

Preview of the question on the survey form:

Label & List-nolabel

They are both used together in select_one and select_multiple question types. Label displays answer choice labels (and not inputs). On the other hand, list-nolabel displays the answer inputs without the labels.To achieve this, create an appearance column in the survey worksheet, and input label, and list-nolabel as per the corresponding questions.

*Note: Ensure that you put label and list-nolabel fields inside a group with field-list attribute if using mobile client like ODK Collect or Kobo Collect.

Preview of the question on the survey form:

Signature

Used in the image question type. It allows you to trace your signature into your form (mobile clients only). To achieve this, create an appearance column in the survey worksheet, and input signature.

*Note: To use the signature attribute, it is imperative that you create another column called parameters, and input the pixels you would like the image to appear with. 

Preview of the question on the survey form:

No-Calendar

Used in the date question type. Its purpose is to suppress the calendar, and is applicable to mobile clients only. To achieve this, create an appearance column in the survey worksheet and input no-calendar.

Preview of the question on the survey form:

Year

Used with the date question type. It only allows the selection of a date. To achieve this, create an appearance column in the survey worksheet and input year.

Preview of the question on the survey form:

Month-year

Used in conjunction with the date question type. It allows only the selection of a month and year as opposed to the whole date. To achieve this, create an appearance column in the survey worksheet and input month-year.

Preview of the question on the survey form:

Quick

Used in conjunction with select_one question type. It is relevant for mobile clients only, this attribute auto-advances the form to the next question after an answer is selected. To achieve this, create an appearance column in the survey worksheet and input quick.

Preview of the question on the survey form:

Field-list

Used in conjunction with groups. The entire group of questions appear on one screen (for mobile clients only). To achieve this, create an appearance column in the survey worksheet and input field-list.

Preview of question on the survey form:

2. Styling prompts

Bolding words

This is done by adding ** or_ to words to bold them. It is aimed at emphasis

The note will appear on the survey as:

Italicizing words

Words can be italicized by wrapping them in * or _

The note would appear on the survey as:

Adding various sized headers

This is done by adding # to header text. For instance, # Heading 1 is the largest header text while #### Heading 4 is the smallest header text

The note would appear on the survey as:

Styling using color and font

This can be done using span tags. For instance, if you want to put style the text “QUESTIONNAIRE” with the color purple, you can use the span tag, <span style=”color:purple”> QUESTIONNAIRE</span>
In the case you may want to include other fonts like cursive in addition to altering text color, you may use the span tag, <span style=”color:green; font-family:cursive”>Questions</span>

This can be illustrated in the screenshot below:

The note would appear on the survey as:

Adding superscripts

This can be achieved by using the <sup> tag. For instance, 100km<sup>2</sup> turns into 100 km2

The note would appear on the survey as:

Adding subscripts

This can be achieved by using the <sub> tag. For instance, H<sub>2</sub>O turns into H2O

The question would appear on the survey as:

Adding emoji

Your favorite emojis can be added, you simply need to copy and paste your emojis of choice in the label column

The note would appear on the survey as:

Prevent special styling effects

Special styling effects can be prevented from being triggered. This can be done using the \ character before #, *, _, and \

The note would appear on the survey as:

Adding links

Links can be added to a survey using [name of link](url)

The note would appear on the survey as:

 

 

 

 

 

 

 

 

 

 

 

 

 

Was this article helpful?
4.2 out Of 5 Stars

26 ratings

5 Stars 27%
4 Stars 50%
3 Stars 8%
2 Stars 12%
1 Stars 4%
5
How can we improve this article?
Please submit the reason for your vote so that we can improve the article.
Table of Contents