The question format Best-Worst or MaxDiff (Maximum Difference Scaling) is about deciding from different statements which is “most important” and which is “least important” for a participant. So it is about a maximum difference between two items.
In the example below the participant should decide which properties are important for a decision an which are not.
When creating a MaxDiff question, two selection questions become one combined question.
First, in the example, a rubric called “MaxDiff” is created with the identifier “MD” and consequently a selection question with the identifier “MD01” (for MaxDiff) (s. part_1creating_questions. Within the question, the Question title is entered as well as the 4 characteristics (“good taste”, …) as answer options.
A description is required as a heading above the items (“least important”). The text is entered in the Selection Options tab in the Text on top of the options field and the Above input fields display option is selected. Under Position of input fields in the Alignment of Inputs the position left-hand is selected.
Now the question is saved and then dublicated (). It now looks like this in the preview:
The duplicated question automatically gets the new identifier MD02 and is initially identical to MD01. In the new question, the Text on top of the options and the Alignment of Inputs are now changed. “Least important” becomes “most important” and the Position of input fields is changed to right-hand. The dublicated question is displayed like following after saving.
At “Compose Questionnaire” a php code is placed on the page where the question should be displayed (Introduction to PHP). The following PHP code is entered as content.
question('MD01', 'combine=MD02', 'gap=none');
In this way, the two questions are combined into one question and the result looks like this:
In order to display the question in the correct orientation, i.e. that the selection options are centered between the selection fields, CSS code must be added to the page using pageCSS
:
question('MD01', 'combine=MD02', 'gap=none'); pageCSS(' td.s2col2 { text-align: center; } ');
This CSS code tells the browser to center-align the second column (s2col2
) – in this case, that's the properties column. Note that this may also affect other questions that may still have been placed on the page. In this case, the question identifier can still be placed in front of the CSS code: #MD01_qst td.s2col2 {…
.
After editing the code, the question with the selection options will appear in the center: