WordPress 的 Google 字體問題解決辦法


 

在國內訪問的時候,WordPress 里面引用的 google 字體可能會導致加載速度變得很慢。

要修改的地方有(我使用的版本是 4.0):

wp-includes 里面的 script-loader.php 有一行:

$open_sans_font_url = "//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

你使用的主題里面的引用,以我用的 twentytwelve 主題為例:

在:wp-content/themes/twentytwelve/functions.php 里面有一行:

$font_url = add_query_arg( $query_args, "$protocol://fonts.googleapis.com/css" );

把這些里面的 fonts.googleapis.com 替換成 fonts.useso.com。

 

但是我直接瀏覽器訪問 fonts.useso.com 后發現這個服務是 360 做的。

。。。

如果不想依賴 360 的服務怎么辦?

 

Update:

現在只要使用 這個工具 可以直接打包下載字體,生成對應的 css 源碼,放到服務器上即可。

 

我的解決方法是手動下載 .css 和所有其中引用的 woff2 字體文件,然后存在自己的服務器上(但此法的問題是如果你升級了,或者安裝了新主題,就可能會導致字體找不到)。 

具體步驟:

1.首先從代碼得到所有對 google 字體請求的參數,或者使用瀏覽器的開發者工具監聽對 fonts.googleapis.com 的請求。並組合起來自己用瀏覽器請求一次,得到一個 css。

比如看到有這兩個:

?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=latin,latin-ext
?family=Open+Sans:400italic,700italic,600italic,400,700&subset=latin,latin-ext

那么就自己用瀏覽器訪問

https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,300,400,600,700&subset=latin,latin-ext

得到一個 css 文件,包含了兩處引用都需要的資源。

 

2.使用文本編輯器在里面搜索出所有字體的靜態鏈接。

我使用的是 Sublime Text,在里面進行正則表達式搜索,我的搜索條件是:

https://fonts.gstatic.*?.woff2

把它們復制出來

https://fonts.gstatic.com/s/opensans/v10/K88pR3goAWT7BTt32Z01m5Bw1xU1rKptJj_0jans920.woff2
https://fonts.gstatic.com/s/opensans/v10/RjgO7rYTmqiVp7vzi-Q5UZBw1xU1rKptJj_0jans920.woff2
https://fonts.gstatic.com/s/opensans/v10/ttwNtsRpgsxVmgGGmiUOEpBw1xU1rKptJj_0jans920.woff2

.......

粘貼到下載工具里面(如迅雷),批量下載。

 

3.字體文件和 css 全部上傳到你自己的服務器。

4.把 css 文件里面的鏈接查找替換成在你服務器上的地址。

5.最后把 wordpress 里面的引用 fonts.googleapis.com 的鏈接替換成你自己的地址。

完成。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM