Is there a way i can change the visual of the NPS question? | XM Community
Skip to main content
I would like to trial the scale showing from 10-0 not 0-10. I'm not changing the promotor/passive/detractor numbers.
There isn't a built-in option to do this. You could write JavaScript to reverse the order of the answer options.
No need to write JavaScript, in my opinion.



As you cannot use the NPS question type in your questionnaire, you need to build a NPS-like question on your own (Multiple-choice question with 11 scale points (= number of choices), horizontal position, giving values in reverse order etc.).

!



You need to remember to recode the values so that 0 represents 10, 1 represents 9 etc. in your survey.

!



Before recoding it looks like the following:

!



On the (Vocalize) dashboard you can build the reporting normally by using NPS-metric type for the plain NPS number and other widget types for showing percentages of categories or number of responses per scale point etc .



BTW, in this case it would also be possible to include an option of "Don't want to answer/Don't know" etc. if you typically use that in your surveys as an response option. At least I have faced some problems with some surveys when there isn't any option to visibly opt out. Naturally you don't need to force a Respondent to answer to the NPS question, but then you don't know whether he just forgot to answer or didn't want to answer. In that case you might also run into problem if you e.g. embed this question in your invitation email and the rspondent doesn't want to answer to this specific question, because then he cannot acess the rest of the questionnaire.
Two issues with not using the JavaScript approach:

1. You lose the automatic promotor/passive/detractor categorizations

2. You lose the NPS question formatting (i.e., the scale won't be horizontal on a mobile device).



If you manually adjust/swap the scale labels, then it is just three lines of JS code:

```

Qualtrics.SurveyEngine.addOnload(function() {

var labels = jQuery("#"+this.questionId+" tr td.LabelContainer");

var tr = labels.eq(0).closest("tr");

labels.each(function(i) { if(i > 0) tr.prepend(jQuery(this)); });

});

```
Hello @Megan_Boosey1,



Use the below code



var ul = jQuery('#'+this.questionId+' .ChoiceStructure tr:eq(2)');

ul.children().each(function(i,td){ul.prepend(td)})
Thanks for the accepted answer! I have 2 questions about how to use the java script provided:

1. Where do I place that code? In the html of the actual NPS item within the survey, or in the CSS code of the survey's look and feel?

2. Do I need to revise any of the code to be specific to my NPS question or does it work as is?
> @CX_Research said:

> Thanks for the accepted answer! I have 2 questions about how to use the java script provided:

> 1. Where do I place that code? In the html of the actual NPS item within the survey, or in the CSS code of the survey's look and feel?

From your NPS questions, click the cog to the left, Add JavaScript, and replace what's there with the code above.

> 2. Do I need to revise any of the code to be specific to my NPS question or does it work as is?

Works as-is.
Worked perfectly, thanks!
Hi @TomG

My client doesn't want 0 for their NPS question. The requirement is to have it from 1 to 10. Do you have any JS code available to hide number 0 from the NPS question?
> @gauravbhagat said:

> Hi @TomG

> My client doesn't want 0 for their NPS question. The requirement is to have it from 1 to 10. Do you have any JS code available to hide number 0 from the NPS question?



https://gist.github.com/marketinview/c941fc59b7ddaef8ba3b
@TomG Thanks a Million
@gauravbhagat @TomG Great discussion here, but I would be very careful tweaking the NPS question and related analysis. As an analyst, we can (and should) develop new measures that we see fit, but it's important to note that NPS is a widely-used measure of customer loyalty and well-understood as a measure with a zero to 10 scale. If you use a different scale (1 to 10), it creates issues with benchmarking against other companies or brands that use the "true" zero to ten measure, and potential confusion with audiences who understand NPS as a zero to ten scale.
@AdamK12 Completely agree with you. The objective is not to present an NPS question as a different scale rather achieve a technical requirement of forcing a horizontal view of a single choice question on mobile device for which we are using the NPS Question in Qualtrics with some JS manipulation to change the scale.
Thanks @gauravbhagat - got it!

Hi TomG - your JS works great to revers the numbers in the NPS question, but the labels are not reversed. My question now says that 10 is "Not at all likely" and 0 is "Extremely likely". Is there a way to reverse these labels too?
Also, do you know if the reversed order will display when the NPS question is embedded in an email distribution?
Thanks!


https://community.qualtrics.com/XMcommunity/discussion/comment/43626#Comment_43626As I said in my original message:

If you manually adjust/swap the scale labels,...


https://community.qualtrics.com/XMcommunity/discussion/comment/43628#Comment_43628Ah, missed that part. Thanks for the quick response!


Leave a Reply