Net Promoter | XM Community
Skip to main content
Using the Net Promoter survey to accomplish look/feel that I couldn't seem to in Slider or Multiple Choice.

Questions:
1) Can gray boxes (0-10) have a light to dark/gradation feel to them?
2) Can gray boxes be made wider or closer together to fill void (keep a slight space as in sample)?
3) Font for Qualtrics sample appears different than default?

Please refer to samples.
!
!

Many thanks!!!
Hello @Gail ,

Below code is to achieve point 2. Paste the code in the js(onReady) of the NPS question
`jQuery("#"+this.questionId+" .ChoiceStructure").css("border-spacing","1px");`
Great - thank you. Any thoughts on gradation for blocks?
> @Gail said:
> Great - thank you. Any thoughts on gradation for blocks?
>

Paste the below code in js(onReady) of the NPS question:

var c=["#f9f9f9","#ececec","#ececec","#dfdfdf","#dfdfdf","#d3d3d3","#d3d3d3","#c6c6c6","#c6c6c6","#b9b9b9","#acacac"];
for(var i=0;i<=11;i++){
jQuery("#"+this.questionId+" label.SingleAnswer:eq("+i+")").css("background",c[i]);
}

Output:
!
Thank you once again - you're good!!

Is there a way for text to change back to default - currently when clicked white text is lost. !
> @Gail said:
> Thank you once again - you're good!!
>
> Is there a way for text to change back to default - currently when clicked white text is lost.
>
Paste the below CSS in the Add custom Css

.NPS .Skin label.MultipleAnswer.q-checked, .Skin label.SingleAnswer.q-checked {
color:white!important;
background:#007ac0!important
}
Once again...thank you!!
This worked great. Thank you for this thread! One question - Is there a way to allow this coloring to show with a black background? My survey's background is black and this color changes do not show. Is there a way to make them 'Come to Front'?
And one other question - How can you imbed this custom look into the survey email? I don't see an option when adding a 'Inline Email Question' to use this custom view. Thank youQ

Leave a Reply


Terms & Conditions