关于wordpress中字体加载慢的问题解决方案(转)(代码片段)

floodwater floodwater     2022-10-25     708

关键词:

最近发现Wordpress有时候加载的特别慢,于是就想办法找了下原因。之前听网上说是因为wordpress用的是Google的字体库,而且是每次都要加载,导致访问慢的,于是当时装了个Disable Google Fonts的插件,禁用了Google字体,然后装了一个Useso take over Google插件,将字体文件改为360托管的字体库,这样就可以访问快点了。当时的效果的确挺好的,结果最近在使用的时候又发现网站访问慢了,用Chrome查了下资源加载的情况,发现访问useso的字体库的时间特别的长。这时候改用Google字体的时候反而更快了。。。这就十分令人惆怅了,有时候用useso的快,有时候用google的快,真的挺麻烦的。后来想想干脆把这个文件下到服务器上不就好了么。。。于是就倒腾出了下面的办法,将当前主题的字体文件下载到了服务器上。

首先在源代码中找到加载字体文件的位置,在博客首页的源代码中找到了下面这行:

1
<link rel=‘stylesheet‘ id=‘baskerville_googleFonts-css‘ href=‘//fonts.googleapis.com/css?family=Roboto+Slab%3A400%2C700%7CRoboto%3A400%2C400italic%2C700%2C700italic%2C300%7CPacifico%3A400&#038;ver=4.5‘ type=‘text/css‘ media=‘all‘ />

 

其实搜索fonts就可以找到了这行。根据这行,我们晓得他引用了googleapis的字体包,命名为’baskerville_googleFonts-css’,而’baskerville’事实上就是我当前的主题名。

然后我们需要在后台找到上面id对应的那个超链接的位置。打开wordpress的根文件夹,直接搜索’fonts.googleapis.com’这个关键字:

1
$find . -type f |xargs grep fonts.googleapis.com

 

查找结果为:

1
2
3
4
5
./wp-admin/includes/class-wp-press-this.php: $open_sans_font_url = ‘,‘ . add_query_arg( $query_args, ‘https://fonts.googleapis.com/css‘ );
./wp-content/themes/baskerville/functions.php: wp_register_style(‘baskerville_googleFonts‘, ‘//fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:400,400italic,700,700italic,300|Pacifico:400‘ );
./wp-content/themes/baskerville/functions.php: $font_url = ‘//fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:400,400italic,700,700italic,300‘;
./wp-includes/js/tinymce/plugins/compat3x/css/dialog.css:@import url("https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=latin-ext,latin");
./wp-includes/script-loader.php: $open_sans_font_url = "https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

 

这样我们就找到了所在文件的位置。大概看一下,实际上用处比较大的是第二行的那串在主体中的定义(对比第一步的内容)(./wp-content/themes/baskerville/functions.php的内容)(其余都是写无关紧要的插件所用的字体)。很明显可以看出来,接下来我们只要把后面那个url换成本地的字体包就可以了。

现在就来下字体包,打开第一步中的那个链接,可以看到是下面的内容:

1
2
3
4
5
6
7
8
9
10
11
/* latin */
@font-face
font-family: ‘Pacifico‘;
font-style: normal;
font-weight: 400;
src: local(‘Pacifico Regular‘), local(‘Pacifico-Regular‘), url(http://fonts.gstatic.com/s/pacifico/v7/Q_Z9mv4hySLTMoMjnk_rCfesZW2xOQ-xsNqO47m55DA.woff2) format(‘woff2‘);
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
/* cyrillic-ext */
@font-face
......

 

发现是一段css,使用了很多的外部资源,下面我们就用一个爬虫来把他直接下下来并打包好:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
#coding:utf-8
import urllib2,cookielib,sys,re,os,urllib
import numpy as np
 
#网站登陆
cj=cookielib.CookieJar()
opener=urllib2.build_opener(urllib2.HTTPCookieProcessor(cj))
opener.addheaders=[(‘User-agent‘,‘Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.106 Safari/537.36))‘)]
urllib2.install_opener(opener)
 
path=‘http://fonts.googleapis.com/css?family=Roboto+Slab:400,700|Roboto:400,400italic,700,700italic,300|Pacifico:400‘
request=urllib2.Request(path)
response=urllib2.urlopen(request)
 
html=response.read()
urls=re.findall(r‘url\ ((.*?)\ )‘,html.replace(‘\n‘,‘ ‘))#由于这里排版会和latex冲突,所以在\和(,以及\和)之间加了空格,使用的时候要删掉
 
path=‘font_cache/‘
 
if not os.path.exists(path):
os.mkdir(path)
for url in urls:
urllib.urlretrieve(url,path+url.split(‘/‘)[-1])#下载文件
 
for url in urls:
html=html.replace(url,url.split(‘/‘)[-1])#更新改css文件
 
font=open(path+‘font-css‘,‘w+‘)
font.write(html)#保存

 

这样就生成了一个font_cache文件夹,在这里有所有下好的字体文件以及更新新后的css文件

最后把这个文件上传到wordpress的根目录下(放到其他目录有时候会没有权限访问,有点麻烦),然后将function.php中的那个url改成/font_cache/font-css(相对于wordpress的根)即可。(记得备份初始文件防止改错。。。。)

怎么解决wordpress运行慢的问题

参考技术A  自从更新的wordpress3.9以后,发现网站打开速度超慢,无奈,排查了一下原因,发现是由于Google服务器无法访问造成的,因为系统中会加载谷歌Opensans字体样式,导致网站非常的慢,需要加载很久才可以勉强打开,开... 查看详情

wordpress慢的八种解决方法(用排查法解决)

 WordPress的打开速度慢会影响到用户体验和关键词的稳定排名,WordPress为什么加载慢呢?其实很简单的,就是WordPress水土不服,用WordPress的大家都知道,WordPress是外国人开发的,在国内用肯定会卡的,今天笔者给大家整理了几个... 查看详情

如何提高wordpress的加载速度

针对wordpress加载速度慢的原因:1.由于Wordpress系统默认使用谷歌字体,在国内谷歌域名被屏蔽,所以导致操作反应慢。对于很多商业主题默认使用了谷歌字体、谷歌ajax库、谷歌地图等谷歌服务,所以导致网站前台访问速度慢。解... 查看详情

关于wpf的combobox中items太多而导致加载过慢的问题

原文:关于WPF的ComboBox中Items太多而导致加载过慢的问题                           &nb 查看详情

关于idea运行很慢的解决办法

参考技术A在实际开发中,随着project的增大,idea使用过程中逐渐出现了各种各样的运行慢问题。博主就针对这些问题做了一个综合,方便读者各自对症下药。引起idea慢的原因多种多样,我们需要有步骤的慢慢排查。 查看详情

wordpress登录后台半天都无法访问或者是访问慢的解决方法

wordpress登录后台如果打开速度慢,一般分为两部分,第一部分是php虚拟主机的原因,其中主机的原因,又分为很多种情况。第二部分就是WordPress程序本身的问题.这里无忧主机小编主要是讲第二部分。所以我们要具体问题具体分析,以... 查看详情

解决maven项目因achetype加载太慢的问题

解决方案: 加载太慢由于achetype-catalog.xml文件的访问问题,导致了整个构建过程的缓慢,所以是否能够将文件保存到本地,成为一种解决思路。翻阅Maven官方文档可以找到,确实是可以的。官方链接如下: http://maven.apache.... 查看详情

关于pip安装较慢的问题解决

在~/.pip/下创建文件pip.conf(如果还没有的话),并填入以下内容:[global]timeout=6000index-url=http://pypi.douban.com/simple/[install]use-mirrors=truemirrors=http://pypi.douban.com/simple/trusted-host=pypi.douban.com可以提高安装速度 查看详情

解决dom4j加载xml文件性能慢的问题(代码片段)

...ntextdocument=reader.read(newFile(extMapperPackagePath));经过检测每次加载3KB文件的xml耗时1秒钟。性能极慢。经过很久终于找到原因,原来是验证xmlDTD文件导致的。 解决办法:跳过 查看详情

为啥wordpress反应这么慢

wordpress反应慢是因为wp要加载谷歌字体。而谷歌又退出中国市场,从而较慢参考技术A国内访问是比较慢的,用代理访问要快一点。 查看详情

在 wordpress 博客上使用特殊字体

...文件中的任何内容更改为function.php。因此,我找到的唯一解决方案是在css自定义文件中添加此内容:@font-facefont-family 查看详情

解决chrome打开第一个网页加载非常慢的问题

1.打开ie浏览器,选择Internet选项2.选择连接—局域网设置—取消自动检测设置的勾选—点击确定。重新打开chrome时,第一个网页的加载速度明显变快。 查看详情

用延迟加载解决cnzz加载慢的问题

...计代码?现在的移动站页面,是有载入提示浮层的,要在页面加载完毕后,才会将浮层撤销,结果CNZZ动不动加载超时,导致浮层经常盖在那里好几分钟不动弹.原来的代码是<scripttype="text/javascript">varcnz 查看详情

极慢的 Wordpress WooCommerce 网站(在管理面板和最终用户中)

】极慢的WordpressWooCommerce网站(在管理面板和最终用户中)【英文标题】:ExtremelySlowWordpressWooCommercewebsite(Bothinadminpanelandenduser)【发布时间】:2017-01-1419:27:39【问题描述】:我在共享Windows托管环境中托管的IIS8中安装了一个woo-comme... 查看详情

Wordpress - 字体大小和图像布局的 Chrome / Safari 问题

】Wordpress-字体大小和图像布局的Chrome/Safari问题【英文标题】:Wordpress-Chrome/Safariissueswithfontsizeandimagelayout【发布时间】:2018-03-3005:37:12【问题描述】:我刚刚加载到wordpresshtml5blank子主题的网站存在一些跨浏览器样式问题。例如... 查看详情

让javascript加载速度倍增的方法(解决js加载速度慢的问题)

通常我们的网站里面会加载一些js代码,统计啊,google广告啊,百度同盟啊,阿里妈妈广告代码啊,一堆,最后弄得页面加载速度很慢,很慢。解决办法:换一个js包含的方式,让javascript加载速度倍增。把通常加载方式: <... 查看详情

u盘加载速度慢的解决方法

...序。然而,一些朋友发现U盘有时候在使用过程中的识别加载速度非常缓慢。是U盘出故障了吗?其实不尽然,下面就为大家分享一下如何快速解决U盘加载缓慢的方法。U盘加载速度缓慢的解决方法1、使用“WIN+R”打开运行对话框... 查看详情

c#关于winform窗口控件过多,显示慢的问题?

如果一个窗口含有5个页的选项卡,每个页上有20个控件,这样在窗体首次显示时就要加载100个控件,所以我想可不可以修改窗体的InitializeComponent()方法,首次打开窗体只生成第一页的20个控件,剩下的打开选项卡时再生成,这样... 查看详情