如何在自己的服务器上托管谷歌网页字体？ [英] How to host google web fonts on my own server?

问题描述

我需要在Intranet应用程序上使用一些Google字体。客户可能或可能没有互联网连接。阅读许可条款，似乎它在法律上是允许的。 解决方案

请注意，我的答案已经过时了一点。还有其他更复杂的技术问题，例如：

• localfont


• 绝对不会/ google-font-download


• google-webfont-helper

所以不要让这个是目前被接受的答案的事实给你的印象，这仍然是最好的。





---





现在，您也可以通过github上的谷歌/字体库。他们还提供〜350MB的字体快照。





---





您首先将字体选择下载为压缩包，为您提供一大堆真正的字体。将它们复制到某个公共位置，然后在某个地方可以链接到您的css。





在google webfont下载页面中，您可以找到如下所示的包含链接：

  http://fonts.googleapis.com/css?family=Cantarell:400,700,400italic,700italic|Candal 
  @ font-face 来链接到一个定义字体的CSS。  $ b> 
 
 
 
在浏览器中打开它，将其复制并粘贴到您自己的CSS中，然后修改网址以包含正确的字体文件和格式类型。 b 
 $ b 
所以这个：
 
 
  @ font-face {
 font-family： 坎塔雷尔; 
 font-style：normal; 
 font-weight：700; 
 src：本地（'Cantarell Bold'），本地（'Cantarell-Bold'），网址（http://themes.googleusercontent.com/static/fonts/cantarell/v3/Yir4ZDsCn4g1kWopdg-ehHCUOGz7vYGh680lGh-uXM.woff ）格式（'woff'）; 
 
 $ / code $ / $ p 
 
 
变成这样：
 
 
  / *您的本地CSS文件* / 
 @ font-face {
 font-family：'Cantarell'; 
 font-style：normal; 
 font-weight：700; 
 src：local（'Cantarell Bold'），local（'Cantarell-Bold'），url（../ font / Cantarell-Bold.ttf）格式（'truetype'）; 
 
 
 
 
 
 $ b 
正如你所看到的，在你自己的系统上托管字体的缺点是方式是，你限制自己的真正的类型格式，而谷歌webfont服务由访问设备确定哪些格式将被传输。
 
 
 
此外，我不得不添加 .htaccess 文件保存到包含MIME类型的字体的目录中，以避免在Chrome开发工具中出现错误。
 
 
 
对于这个解决方案，只需要真正的类型，但是当你想要包含不同的字体的时候，定义更多也不会伤害，比如 font-awesome 。
 ＃。htaccess 
 AddType application / vnd.ms-fontobject .eot 
 AddType字体/ ttf .ttf 
 AddType font / otf .otf 
 AddType application / x-font-woff .woff 
  
 
I need to use some google fonts on an intranet application. The clients  may or may not have internet connection. Reading the license terms, it appears that its legally allowed.
解决方案
Please keep in mind that my answer has aged a bit. There are other more technically sophisticated answers below, e.g.:


localfont
neverpanic/google-font-download
google-webfont-helper


so don't let the fact that this is the currently accepted answer give you the impression that this is still the best one.



You can also now also download google's entire font set via on github at their google/font repository. They also provide a ~350MB zip snapshot of their fonts.



You first download your font selection as a zipped package, providing you with a bunch of true type fonts. Copy them somewhere public, somewhere you can link to from your css.

On the google webfont download page, you'll find a include link like so:
http://fonts.googleapis.com/css?family=Cantarell:400,700,400italic,700italic|Candal
It links to a CSS defining the fonts via a bunch of @font-face defintions.

Open it in a browser to copy and paste them into your own CSS and modify the urls to include the right font file and format types.

So this:
@font-face {
  font-family: 'Cantarell';
  font-style: normal;
  font-weight: 700;
  src: local('Cantarell Bold'), local('Cantarell-Bold'), url(http://themes.googleusercontent.com/static/fonts/cantarell/v3/Yir4ZDsCn4g1kWopdg-ehHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
}
becomes this:
/* Your local CSS File */
@font-face {
    font-family: 'Cantarell';
    font-style: normal;
    font-weight: 700;
    src: local('Cantarell Bold'), local('Cantarell-Bold'), url(../font/Cantarell-Bold.ttf) format('truetype');
}
As you can see, a downside of hosting the fonts on your own system this way is, that you restrict yourself to the true type format, whilst the google webfont service determines by the accessing device which formats will be transmitted.

Furthermore, I had to add a .htaccess file to my the directory holding the fonts containing mime types to avoid errors from popping up in Chrome Dev Tools.

For this solution, only true type is needed, but defining more does not hurt when you want to include different fonts as well, like font-awesome.
#.htaccess
AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
AddType application/x-font-woff .woff


                        
这篇关于如何在自己的服务器上托管谷歌网页字体？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！