0 votes
by (160 points)
@import url(//fonts.googleapis.com/css?family=Open+Sans);

body {
  font-family: 'Open Sans', sans-serif;
}

I put this in my story stylesheet but it doesn't work. Any help?

1 Answer

+1 vote
by (159k points)
selected by
 
Best answer

There are you mistakes in your example:

1. The URL to the hosted font is malformed.

If you access the @import tab of that font family selector on the Google Fonts site you will see that the relavent URL looks like the following;

@import url('https://fonts.googleapis.com/css?family=Open+Sans');

... notice the quotes around the URL value and that it has a https: protocol 

2. You are targeting the body element with your font-family related rule.

If you Inspect the CSS being applied to the elements of the main page of your story you will discover that Harlowe assigns it's default to it's custom tw-story element so your CSS rule should like like the following.

tw-story {
  font-family: 'Open Sans', sans-serif;
}

If you place both of the above within your project's Story Stylesheet area, making sure that the @import statement comes before the tw-story based rule, then the font change will work.

by (160 points)
Hi again!

Could you please send me the code for this font?

This is for a school project and want to make it perfect: https://fonts.google.com/specimen/Jua
by (159k points)
...