Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

CSS & Google Fonts?

1534221986
Fyndhal
Plus
Sheet Author
I'm trying to add a font from fonts.google.com to my sheet and having problems figuring out how to implement it. The inability to use &lt;head&gt; tags in the html or @import in the CSS is giving me headaches. Has anyone done this successfully? If so, what am I missing? This would go into the head, were it available:&nbsp;&lt;link href="<a href="https://fonts.googleapis.com/css?family=Dosis" rel="nofollow">https://fonts.googleapis.com/css?family=Dosis</a>" rel="stylesheet"&gt; This would then go into the CSS: body {font-family: 'Dosis', sans-serif;} Alternatively, this could be used in the CSS as well, except it breaks the sheet completely:&nbsp;@import url('<a href="https://fonts.googleapis.com/css?family=Dosis" rel="nofollow">https://fonts.googleapis.com/css?family=Dosis</a>'); Any help is appreciated!
1534230046
GiGs
Pro
Sheet Author
API Scripter
I dont think you can use google fonts, though I hope someone will come along and correct me because I'd love to. There have been many threads over the years looking for ways to use external fonts, and i think Brian posted the only solution, to host them on your own server and link to them. Hopefully there have been new developments since then.
1534232006
Ziechael
Forum Champion
Sheet Author
API Scripter
G G said: I dont think you can use google fonts, though I hope someone will come along and correct me because I'd love to. Sorry to disappoint but there is a very popular suggestion for it that needs all the support it can get ;)
1534234482
GiGs
Pro
Sheet Author
API Scripter
Agreed, I've already voted on that one :)
1534264756
Fyndhal
Plus
Sheet Author
Thanks for the link and discussion. I'll see what I can do regarding hosting the font myself. FWIW, forum search tools would be handy. None of the searches I did returned much on this topic!
1534267692
Scott C.
Forum Champion
Sheet Author
API Scripter
Compendium Curator
Note that any externally hosted font will not work out of the box on character sheets. The font either needs to be installed locally, be one of the 4 or 5 that Roll20 hosts, or be a websafe font (which really just means most people have it installed locally by default). If one of these is not true, then the user will get a notice about "unsafe scripts" in their address bar, or other error notice location depending on browser. They can allow the "unsafe scripts" to run to get the fonts, but how many users do you know that will blindly trust your assertion that it's just a font and not dangerous. Also, note that the above is only possible by using @font-face, not @import.
1534276188

Edited 1534277149
Fyndhal
Plus
Sheet Author
Scott C. said: Note that any externally hosted font will not work out of the box on character sheets. The font either needs to be installed locally, be one of the 4 or 5 that Roll20 hosts, or be a websafe font (which really just means most people have it installed locally by default). If one of these is not true, then the user will get a notice about "unsafe scripts" in their address bar, or other error notice location depending on browser. They can allow the "unsafe scripts" to run to get the fonts, but how many users do you know that will blindly trust your assertion that it's just a font and not dangerous. Also, note that the above is only possible by using @font-face, not @import. Is there a list of the Fonts hosted on Roll20 and their access links? I might be able to use one of those, (though, I kinda doubt "Dosis" is one of them!) EDIT: Also, I see you used @Font-Face in the Starfinder CSS but it is not generating an "unsafe scripts" message for me. Did you do some sort of workaround on the backend?