明明博客

明明博客


生命是一个过程,可悲的是不能重来,可喜的是它也不需要重来

SHARE ARTICLE


有时间更新博客,顺便更新一下GoogLe字体

MingmingMingming

话说已经好久没更新博客 ,只是没时间更新。
因为google被屏蔽,所以很多运用了 fonts.googleapis的网站都打开很慢,会直到加载fonts.googleapis超时才能打开网页。网络上网友分享了很多方法,有在function.php后面加代码的,有用移除google字体插件的方法。但是,很多国外的主题在很多地方都运用了google字体,就会显得不太有效果。本方法就是直接把谷歌字体放在自己的服务端。
[tabs]
[tab title=”下载字体”]你首先知道你的主题是调用什么字体然后下载对应的字体,具体方法如下面
这是我的主题要用的谷歌字体 :http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,300italic,400italic,600italic,700italic&subset=latin,cyrillic
有的时候能打开有的时候不能打开。就是因为这个字体影响的访问速度。
就正如下面的图片显示你的主题要调用的字体。

正如图显示我的主题调用的字体,我就把这些字体下载本地就可以了。[/tab]
[tab title=”更改字体”]正如第一说的把字体下载本地 不过下载字体的时候会中断 无法下载等等这个原因我也不说什么了大家都懂的。

不过请自备“爬墙”工具等等来进行下载字体。

字体下载后新建个 font.css 文件

以下代码是我修改后的代码

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-Light.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-Semibold.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-Bold.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: local('Open Sans Light Italic'), local('OpenSansLight-Italic'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSansLight-Italic.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-Italic.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: local('Open Sans Semibold Italic'), local('OpenSans-SemiboldItalic'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-SemiboldItalic.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'), url(/wp-content/themes/entrance/fonts/googlefont/OpenSans-BoldItalic.woff) format('woff');

大家都对于这个代码很熟悉吧对就是本主题调用的字体的CSS我把它修改成本地使用
你可以在你的主题文件夹里面创建个Googlefont文件夹等等。。。

url(http://fonts.gstatic.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTYraN7vELC11_xip9Rz-hMs.woff //谷歌在线字体
/wp-content/themes/你的主题文件名称/fonts/googlefont/字体名称.woff //更换后的调用本地字体
注意 我下载的字体都给它们更改对应的名称了
而不是 “DXI1ORHCpsQm3Vp6mXoaTYraN7vELC11_xip9Rz-hMs.woff” 比如它的名称对应是 “OpenSans-Light” 
那就给它更改 “OpenSans-Light.woff” 方便日后更新。

[/tab]
[tab title=”修改Style.css”]
这一步最关键了找到主题的 style.css 在里面找到 有的主题不是在style.css里面的 那就搜索 [highlight color=”red”]fonts.google.com/css?[/highlight]这个关键字
[highlight color=”yellow”]http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,300italic,400italic,600italic,700italic&subset=latin,cyrillic[/highlight]这个是我的主题调用的字体
然后替换成 [highlight color=”blue”]/wp-content/themes/你的主题名称/fonts/googlefont/font.css?family=Open+Sans:300,400,600,700,300italic,400italic,600italic,700italic&subset=latin,cyrillic[/highlight] 这就可以了
好了这就完结了[/tab]
[/tabs]

这就是把字体放在本地服务器来进行访问 而不是在调用谷歌字体了。

00:00/00:00
Mingming
Author

生命是一个过程,可悲的是不能重来,可喜的是它也不需要重来

Comments 6