1

I am working on new website with adding google font but when i disable my internet google font not working not showing offline mode. How can I set google font but link form my local folder not form google server?

Used html method:

<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&amp;lang=en" />

Used css method:

@import url('https://fonts.googleapis.com/css?family=Open+Sans');
Laur Ivan
  • 4,117
  • 3
  • 38
  • 62
  • You can use the `file://` prefix (e.g. `file://c:/Users/myuser/fonts/myfont.ttf`) – Laur Ivan Sep 21 '16 at 06:34
  • Possible duplicate of [Is it possible to download Open Sans as available on Google Fonts to use on my desktop?](http://stackoverflow.com/questions/14170113/is-it-possible-to-download-open-sans-as-available-on-google-fonts-to-use-on-my-d) – Rehan Haider Sep 21 '16 at 06:44

3 Answers3

2

try this

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'),
  src: local('Open Sans'), local('OpenSans'), url(OpenSans-Light.ttf) format('truetype');
}

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(OpenSans-Light.ttf) format('truetype');

}

Download Google Font

1

Download font files and put them into a folder inside your root folder. And link it inside your HTML like this:

<link rel="stylesheet" href="fonts/OpenSans-Regular.ttf" />

Another possible solution is mentioned here.

Community
  • 1
  • 1
ErTR
  • 863
  • 1
  • 14
  • 37
0

You can use goog-webfont-dl to download fonts locally. This will also generate css file for you to use in your project.

Nilesh Mali
  • 530
  • 6
  • 12