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

loading multiple fonts

Hello!&nbsp; New pro user trying to build out custom character sheets.&nbsp; Having some trouble loading multiple google fonts.&nbsp; Is this not possible or am I missing something? @import url('<a href="https://fonts.googleapis.com/css2?family=Anton&amp;family=Zilla+Slab:wght@400;500;700&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css2?family=Anton&amp;family=Zilla+Slab:wght@400;500;700&amp;display=swap</a>'); This seems to break all CSS and layout styling and doesn't load the fonts either.&nbsp; Thought it might be a css2 issue. @import url('<a href="https://fonts.googleapis.com/css?family=Zilla+Slab:wght@400;500;700&amp;family=Anton&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css?family=Zilla+Slab:wght@400;500;700&amp;family=Anton&amp;display=swap</a>'); @import url('<a href="https://fonts.googleapis.com/css?family=Zilla+Slab&amp;family=Anton&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css?family=Zilla+Slab&amp;family=Anton&amp;display=swap</a>'); Either of these options only load the first listed font.&nbsp; The other font fails in all cases and loads its fallback. @import url('<a href="https://fonts.googleapis.com/css?family=Zilla+Slab&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css?family=Zilla+Slab&amp;display=swap</a>'); @import url('<a href="https://fonts.googleapis.com/css?family=Anton&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css?family=Anton&amp;display=swap</a>'); These will work individually (e.g. if I only try one of the lines in my css it works fine). With both fonts the PREVIEW in game settings looks correct and appears to have loaded both fonts correctly. In the roll20 tabletop the font listed FIRST loads properly, but the second one never loads like the other issues. Anything I should be trying or changing?&nbsp; Thank you.
1586722334

Edited 1586722347
GiGs
Pro
Sheet Author
API Scripter
IIRC You need to put them in the same line, and separate them with a | , like so @import url('<a href="https://fonts.googleapis.com/css?family=Zilla+Slab|Anton&amp;display=swap" rel="nofollow">https://fonts.googleapis.com/css?family=Zilla+Slab|Anton&amp;display=swap</a>');
1586727926

Edited 1586728113
Andreas J.
Forum Champion
Sheet Author
Translator
Yeah, Stephanie's guide show example where two are listed like GiGs suggested. <a href="http://www.mortaine.com/blog/2020/02/21/using-google-fonts-in-roll20-character-sheets/" rel="nofollow">http://www.mortaine.com/blog/2020/02/21/using-google-fonts-in-roll20-character-sheets/</a> Updated the wiki section with GiG's example: <a href="https://wiki.roll20.net/Building_Character_Sheets#Google_Fonts" rel="nofollow">https://wiki.roll20.net/Building_Character_Sheets#Google_Fonts</a>
Perfect, that worked.&nbsp; Thank you both!