HOW WE CAN HELP?
XLSForms- Appearance attributes & Styling prompts
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: