Adding custom CSS for all questions/answer options | XM Community
Solved

Adding custom CSS for all questions/answer options


Userlevel 2
Badge +10
Hi everyone,

We need to use a specific font for branding and I'd love to find a way to apply this to all questions and question answers (multiple choice, etc), but am having a hard time figuring out the right CSS to use. I tried to inspect the code in the survey to see what the question elements were called and I can't seem to figure it out...I'm sure I'm missing something stupidly obvious.

Has anyone used the custom css to dictate question font/sizes etc? If so, what were the element name(s) you used to do this? This is a version of something I tried, though in all honesty my CSS coding skills are very rusty ;)

/* Place your CSS here */
< whatever the element name is > {
font-family:'Roboto-Light',sans-serif;
font-size:16px;
color:#333333;
letter-spacing:0.5;
line-height:24px;
}

Thanks!

Kristy
icon

Best answer by LaurenK 20 June 2018, 20:47

View original

11 replies

Userlevel 4
Badge +10
You can get a theme created by the Qualtrics themes team (themes@qualtrics.com) and then the theme is set as the default for all your surveys. You can supply custom CSS, font files, etc.
This will ensure brand consistency across all surveys.
Userlevel 7
Badge +13
Hey @KristyP! If you are interested updating the custom theme you have in your brand to have a new font, you'll want to fill out the "Update Your Theme" survey found on this page!
Userlevel 2
Badge +10
Thanks @dekennedy7 and @LaurenK - sounds like this is the cleanest route to go with (not sure how I missed that one!)...appreciate your help!!
Userlevel 6
Badge +8

LaurenK Hi Lauren, what if I don't want to change the entire theme? i only have one dept (or user) that wants a different font? Can I get a template made that won't be the new default? Or would it be better to use CSS?

Userlevel 4
Badge +10

mklubeck you can now create new dynamic themes where you can modify the font and apply just that theme to your survey. Go to Admin -> Themes and then click the plus button in the upper left to add a new dynamic theme.

Userlevel 6
Badge +8

dkennedy I'll check it out! Thanks, hope it does the trick.

Userlevel 6
Badge +8

dkennedy I see where that is. Just a couple of questions: 1. How do I use an existing theme as the start (vs. whatever the default seems to be). We have branding done, and if I want to change the font on a branded theme, I don't see how to do that. 2. Can only admin do this? And will the theme be available to anyone in my brand?

Userlevel 4
Badge +10

As far as I can tell there is no way to copy an existing dynamic theme in order to start a new one, so you would need to just copy all the settings and add them to the new dynamic theme. If you have a branded theme it could be a "static" theme. Those themes were created before the current functionality for dynamic themes was built and also offer more customization options. Unfortunately, they must be created/modified by Qualtrics Support. If it is a dynamic theme and you can't modify it, and you aren't the Brand Admin, then you need to reach out to the Brand Admin for your license to get the new theme done most likely. There is an admin setting called "Customize Theme" which can be enabled/disabled and can be set at a user or role level. If it is disabled for you then you won't be able to make any changes to the themes. Hope that helps.

Userlevel 6
Badge +8

dkennedy I'm the brand admin so, GREAT! If I heard you correctly, I can enable this for the user who wants it. And yes, our themes are static ones...so to change the font for one of those using CSS...I'd be back to the beginning, right?
Hopefully the user will be happy with the non-branded dynamic theme.

Userlevel 6
Badge +8

dkennedy hmm. And looking at the custom theme option, I don't see where I could add a custom font...except in the Customer CSS box. So I still need the proper code necessary to add a font, right? And I'm guessing I need the font file in the File Library?

Userlevel 4
Badge +10

We use a custom font with our static themes. I had to send the font files to the Themes Team at Qualtrics and they took care of the implementation. That is the only way I'm aware of to get it done. But I'm not a coder so maybe there is a way to add CSS that references a font file on a server hosted by your company instead of Qualtrics. Not sure about that. I don't know how to reference files uploaded to the Library in code either, but technically that could be possible as well. Best of luck!

Leave a Reply