How do I customize the font in my survey? | XM Community
Solved

How do I customize the font in my survey?

  • 18 November 2019
  • 10 replies
  • 1231 views

Badge
My organization brand uses a specific font - "Aaux Next". Is there a Custom CSS code that I can input into my survey look and feel so that this appears in my survey?
icon

Best answer by Zhen 18 November 2019, 05:28

View original

10 replies

Hi @chrissien

You can insert following css into Custom CSS, just update the selector to meet your biz requirements
```css
h1, h2, h3, h4, h5, h6, p, div, span, a {
font: 16px "Aaux Next", sans-serif;
}
```
Make sure actual font files is imported in HTML page. For example font file is hosted in Google, and we can link the font file like this:
```html
<link href="https://fonts.googleapis.com/css?family=AauxNext" rel="stylesheet">
```
Hope it helps

Cheers,
Zhen
Badge
Hi @Zhen

Thanks for your reply. This may be somewhat of an inexperienced question. But how do you do this - "Make sure actual font files is imported in HTML page"?

Thanks!
No problem, Chris.

Font file can be included to the web page like this:
```HTML
<link href="https://fonts.googleapis.com/css?family=AauxNext" rel="stylesheet">
```

If your page has already been configured to include the font file, then you don't need to do anything; Otherwise, change "AauxNext" to whatever your font is named, and paste above code into Qualtrics custom header/footer via survey's "Looks and Feel" editor.
Userlevel 4
Badge +7

Hi chrissien,
You can also upload the font .ttf file to the Qualtrics files library and then reference that URL in order to pull the font into your survey. Here's an example:
image.png

Userlevel 1
Badge +2

Once I've uploaded the .ttf file - how do I find the link for the font? Like you have in your example?

Userlevel 1
Badge

Hi,

I have uploaded the .ttf file in the library and used the query shown above but my font is not changing. Also, if there are multiple files that I have uploaded in the library the link is same for both files so how would Qualtrics differentiate between the two?

Thanks,

I've uploaded my custom font to the Files Library but I can't seem to work out how to find the full URL to the file to then add to my CSS.
How to I find the direct URL to the font file?

I would like to ask a question but it is exactly like the last 3 posted ... so how do you do it? is there anyone able to answer? thank you

https://community.qualtrics.com/XMcommunity/discussion/comment/24802#Comment_24802Where do you find the URL to pull into the CSS code?

Userlevel 4
Badge +7

Qualtrics129512 Mkunza - once the file is uploaded to the Qualtrics library, you can click the gear icon -> right-click 'View' -> copy link address.
Screen Shot 2021-08-24 at 9.37.44 AM.png

Leave a Reply