How to change the stars in a slider question | XM Community
Skip to main content

Hey hey - I need CSS code (or an alternative means) of changing the stars in the slider question.  I want to change the colour (#018067), position (centralised with NO caption to the left) and size of the stars.

Don’t know where to start with code and ChatGPT has so far not helped! 

Thanks

 

 

@Cat Jones Check you this post.


Hi there - thanks for your reply!  Unfortunately I don’t understand how to apply the instructions - where do I put the URL and what is parens? Sorry to say I have very little tech knowledge!  Are you able to describe how to perform these actions please?  If not I might be able to find someone at Qualtrics to help me 🙂 Thanks 


And… I found the code below, and now realise maybe my original description didn’t 100% describe what I want to achieve.  I want to change the colour the stars change too when hovered over/selected.  They currently turn yellow and I want to change it to a brand green.  Also looking to change placement and size of stars

 

.Skin .STAR .StarsContainer,.Skin .STAR .StarsContainer .Filled,.Skin .STAR .StarsEventWatcher{height:26px;background:transparent url(https://jfe-cdn.qualtrics.com/themes/base-templates/qualtrics/base/version-1561388512231-d0e045/files/stars.png) 0 0}


@Cat Jones The stars in the slider question are embedded images, so you won’t be able to change or modify their size or color using any custom code. The link to the post that I shared above explains that you'll need to create an exact replica of the stars already present, with the same size and PNG file size. Then, you can use that image link in the custom code to display it in your slider question.

I haven’t tried this approach myself yet, so I can’t provide many details.


Leave a Reply