Open Sans not working

[xtech]

Hi,

the default theme includes the Open Sans font (at least in the CSS). Nevertheless, it seems that in my community the font seems nothing like Open Sans. I would say it is more like arial or something. 

Is there a problem or something we should do to make it really working?

[opentype]

Where do you see Open Sans? 

The font stack is:

"Helvetica Neue",Helvetica,Arial,sans-serif

 

[xtech]

I do have this (apart from customized colors...):

body {
  font-family: "Open Sans",Helvetica,Arial,sans-serif;
  font-size: 13px;
  line-height: 18px;
  color: #bdbdbd;
  height: 100%;
  background-color: #1b1c1e;
}

[Kevin Carwile]

@xtech, Before you can use the Open Sans via CSS, you need to include the actual font file. Open Sans is not a default browser font. With your current font-family specification, "Open Sans" is not available so the browser will then use either Helvetica, Arial, or a sans-serif font in that order.

Try including this line at the top of your custom.css file.

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

 

[xtech]

@xtech, Before you can use the Open Sans via CSS, you need to include the actual font file. Open Sans is not a default browser font. With your current font-family specification, "Open Sans" is not available so the browser will then use either Helvetica, Arial, or a sans-serif font in that order.

Try including this line at the top of your custom.css file.

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

 

​Thank you! Can i use a local version of it? Storing it at the server?

[AutoItScript]

It's probably better to use the google address, it's a CDN and it means if a user has been to another site already with that font they will likely have it cached from that address already  

[opentype]

 

​Thank you! Can i use a local version of it? Storing it at the server?

You can download the fonts from Google Fonts, upload them to your server and then add the appropriate @font-face rules to your custom.css. 

[Christopher Bergsten]

Yes, you can use a local version on your own server.  Remember though, use https. 

Im just tested this, and that works - i declare the name of the font with the font-family part and then i can call it wherever : 

  @font-face {
    font-family: 'gwfont';
    src: url('https://hockeyforat.se/laravel/fonts/gwfont.ttf'); /*URL to font*/
}

how i use it somewhere :

.ipsPageHeader {
  font-family: 'gwfont';
}

 

[xtech]

Thank you all for the good explanations!