分类: 学习

  • 如何将WordPress媒体迁移至谷歌云存储

    如何将WordPress媒体迁移至谷歌云存储

    在之前的教程中,我们向您展示了如何将媒体迁移到Amazon S3。今天,我们将向您介绍如何将WordPress网站上的媒体卸载到Google Cloud Storage,以及选择直接从Google Cloud Storage或CDN提供媒体服务的几个选项。

    谷歌云存储只是谷歌云平台众多产品和服务的一小部分。由于Google拥有庞大的基础架构以及他们处理批量存储的事实,他们能够提供非常低的存储成本。远低于WordPress主机。

    通常,像这样的云存储用于需要使用我们的外部备份插件等解决方案进行额外备份或正在提供大文件(图像、照片、下载、软件、视频、游戏)的站点。他们的一些客户包括Spotify、Vimeo、可口可乐、飞利浦、Evernote和摩托罗拉。

    1. 谷歌云存储与谷歌云CDN
    2. 谷歌云存储定价
    3. WP-Stateless的WordPress谷歌云存储设置
    4. WP Offload Media的WordPress谷歌云存储设置

    谷歌云存储与谷歌云CDN

    不要将Google Cloud Storage与Google Cloud CDN或任何其他CDN提供商混淆。内容交付网络 (CDN) 专为加快媒体交付速度而设计,而Google Cloud Storage专为大容量存储解决方案而设计。

    但是,Google Cloud Storage可以帮助您加快网站速度,因为它使用所谓的多区域存储。这意味着您的Google Cloud Storage内容存储在该区域内的多个位置并从其交付,类似于CDN。它甚至使用相同的边缘缓存技术。但是,重要的是要注意这不是全球性的,并且可能比成熟的CDN解决方案具有更高的延迟。Google Cloud Storage可让您在三个区域之间进行选择:

    • 亚太地区
    • 欧洲联盟
    • 美国

    但我们将在下面向您展示如何将CDN与Google Cloud Storage一起使用。

    谷歌云存储定价

    Google Cloud Platform为新客户提供3个月300美元的免费试用期。如果您从未成为Google Cloud Platform的付费客户并且之前未注册免费试用,则您符合条件。这是在支付任何费用之前测试Google Cloud Storage并查看它是否适合您的网站的好方法。请参阅免费试用常见问题解答Google Cloud Storage定价

    谷歌云免费试用

    谷歌云免费试用

    WP-Stateless的WordPress谷歌云存储设置

    将Google Cloud Storage与WordPress网站集成的第一个选择是使用免费的WP-Stateless插件,该插件由Usability Dynamics的优秀团队开发。

    此插件会在将文件上传到媒体库时自动将文件从您的WordPress站点复制到Google Cloud Storage。然后它提供不同的模式,例如备份您的媒体副本,甚至从WordPress中删除媒体并从Google Cloud Storage提供服务。

    WordPress插件-WP-Stateless

    WordPress插件-WP-Stateless

    这个插件在块上仍然很新,但享有盛誉,并且正在积极维护和更新。在撰写本文时,它目前拥有超过2,000次活跃安装。它还提供与以下第三方插件的官方兼容性:

    • Easy Digital Downloads
    • Imagify Image Optimizer
    • ShortPixel Image Optimizer
    • WPForms
    • WP Smush
    • Advanced Custom Fields Image Crop Addon
    • SiteOrigin Widget Bundle
    • SiteOrigin CSS
    • Gravity Forms
    • WPBakery Page Builder

    仅仅因为插件没有在上面列出并不意味着它不能与集成一起使用。这些只是UsabilityDynamics团队花费额外时间修复错误和确认兼容性的插件。

    第 1 步

    要安装免费的WP-Stateless插件,您可以从WordPress插件库下载,或者在WordPress仪表盘中的“安装插件”下搜索“WP-Stateless”  。单击“立即安装”并启用它。

    安装WP-Stateless WordPress插件

    安装WP-Stateless WordPress插件

    第 2 步

    单击“Begin Setup Assistant”。或者您可以按照他们的手动设置说明进行操作。

    WP-Stateless

    WP-Stateless

    第 3 步

    点击“Google Login”。您应该使用您想与本网站关联的Google帐户并同意权限请求。如果您不确定是否授予对您的Google帐户的访问权限,请查看他们关于权限请求的文档。如果您不想提供对您的Google帐户的访问权限,您可以随时使用手动设置过程

    WP-Stateless谷歌登录

    WP-Stateless谷歌登录

    第 4 步

    点击“Allow”让他们查看和管理您在Google Cloud Platform服务中的数据。注意:一旦用户登录过程完成,他们就不会保留任何令牌或访问凭据。

    谷歌账户权限请求

    谷歌账户权限请求

    第 5 步

    然后,WP-Stateless将帮助您配置将存储WordPress媒体文件的Google Cloud项目和Bucket。

    • Google Cloud Project:每个Google Cloud Bucket都包含在一个项目中。您可以创建一个新项目或从现有项目之一中进行选择。
    • Google Cloud Bucket:您所有的WordPress数据都存储在一个Bucket中。您可以创建新Bucket或从现有Bucket中进行选择。
    • Google Cloud Bucket Multi-Regional Location:您新创建的Bucket将配备多区域存储类。选择最接近您网站的大多数访问者的区域。
    • Google Cloud Billing:如果您没有结算帐户,请单击按钮进行设置。不要忘记他们提供3个月300美元的免费试用

    提示:如果您想为Google Cloud Storage使用自己的自定义域或CDN URL,请确保将您的Bucket命名为与您的CDN域URL完全相同。存储桶名称:gcs.yourdomain.com. 它会给你一个关于字符的警告,但句点可以在Bucket名称中使用。它必须以字母数字字符开头和结尾。

    WP-Stateless项目和Bucket

    WP-Stateless项目和Bucket

    配置完以上所有内容后,单击“继续”。然后,您应该会看到一切都已正确设置的确认信息。

    WP-Stateless设置

    WP-Stateless设置

    WP-Stateless插件中的谷歌云存储设置

    您可以在“Media → Stateless Settings”下找到WP-Stateless和Google Cloud Storage设置。在“Settings”选项卡下,您需要配置您喜欢的模式。

    • Disabled: 禁用无状态媒体。
    • Backup:将媒体文件上传到Google存储并提供本地文件URL。
    • CDN:将媒体文件复制到Google存储并直接从那里提供服务。
    • Stateless:仅使用Google Cloud Storage存储和提供媒体文件。媒体文件不存储在本地。此选项将为您节省最多的磁盘空间
    • File URL Replacement: 在演示过程中扫描文章内容和元数据,并将本地媒体文件URL替换为Google Cloud Storage URL。此设置不会修改您的数据库。

    WP-Stateless模式

    WP-Stateless模式

    担心稍后会获取您的媒体文件?不用担心,该插件具有同步功能(我们将在下面进一步探讨),以防您想恢复。您还可以随时从Google Cloud Storage bucket本身获取WordPress上传文件夹,因为它只是模仿媒体库的确切外观(如下所示)。

    Google Cloud Storage WordPress bucket文件夹

    Google Cloud Storage WordPress bucket文件夹

    在页面下方,您还有其他设置:

    • Cache-Control: 默认情况下,设置为:public, max-age=36000, must-revalidate. 如果需要,您可以覆盖它。
    • Delete GSC File: 如果您希望在从WordPress媒体库中删除文件时从GSC中删除该文件,请启用此选项。
    • File URL and Domain:将默认GCS域替换为您自己的自定义域。这将要求您配置CNAME。请注意,桶名和域名必须完全匹配。根据他们的文档,自定义域不支持HTTPS,但它对我们来说效果很好。
    • Organization:将上传内容组织到基于年份和月份的文件夹中。
    • Cache Busting:在文件名前添加一组随机的数字和字母。这对于在上传具有相同文件名的文件时防止缓存问题很有用。

    WP-Stateless附加设置

    WP-Stateless附加设置

    您上传到WordPress媒体库的图像会自动复制到Google Cloud Storage。但是,在您首次配置插件后,您将需要运行批量同步。在“Media → Stateless Settings → Sync”下,您有以下选项:

    • 重新生成所有无状态图像并将Google Storage与本地服务器同步。(注意:第一次使用此选项需要一段时间)
    • 在Google Storage和本地服务器之间同步非图像文件。
    • 在Google Storage和本地服务器之间同步非媒体库文件。

    WP-Stateless同步

    WP-Stateless同步

    WP Offload Media的WordPress谷歌云存储设置

    将Google Cloud Storage与WordPress网站集成的第二个选择是使用Delicious Brains Inc.提供的同样出色的免费WP Offload Media Lite插件(或高级 WP Offload Media)

    WordPress插件WP Offload Media

    WordPress插件WP Offload Media

    精简版的WP Offload Media绝对可以满足您的大部分需求;但是,如果您升级到高级版本,则有一些不错的功能:

    • PriorityExpert™ 电子邮件支持。
    • 将现有媒体库上传到云存储。
    • 从媒体库控制云存储文件。
    • 在后台卸载后从服务器中删除文件。
    • 下载并从云存储中删除。
    • 在后台在您的存储提供商上的存储桶之间复制文件。
    • 使用Assets Pull Addon只需单击几下,即可从CloudFront或其他CDN提供站点资源(CSS、JS、图像、字体等)。
    • 与WooCommerce、WPML、Easy Digital Downloads、Meta Slider、Enable Media Replace和Advanced Custom Fields集成。

    第 1 步

    要安装免费的WP Offload Media Lite插件,您可以从WordPress插件库下载它,或者在WordPress仪表盘中的“安装插件”下搜索“WP Offload Media Lite”。单击“立即安装”并启用它。

    安装WP Offload Lite WordPress插件

    安装WP Offload Lite WordPress插件

    第 2 步

    按照他们的Google Cloud Storage快速入门说明进行操作:

    谷歌云存储CDN集成

    担心谷歌云存储的性能?确实,多区域存储根本不会像普通的CDN那样快,而且对于全球用户来说绝对不是很好。但是,您仍然可以通过您最喜欢的CDN提供商传送文件。下面是几个不同的选项。

    使用KeyCDN配置WP-Stateless

    只需按照以下步骤操作,我们将使用KeyCDN作为示例。

    重要提示:这确实意味着Google Cloud Storage和您的CDN提供商都会向您收费,因此您可能需要事先处理这些数字。或者,如果您使用的是Google Cloud Platform试用版,那么这是一种无需Google收费即可估算成本的好方法。

    1. 专门为您的Google Cloud Storage媒体设置一个新区域。遵循KeyCDN的Google Cloud Storage CDN集成教程。本质上,您使用Google Cloud Storage作为您的源服务器。
    2. 在新区域上部署Let’s Encrypt for HTTPS。
    3. 在KeyCDN设置新的区域别名。示例:gcs.yourdomain.com
    4. 在WP-Stateless插件设置中使用您的区域别名。

    结果是KeyCDN现在正在交付您所有的Google Cloud Storage文件。性能问题解决!

    谷歌云存储和KeyCDN

    谷歌云存储和KeyCDN

    由于WP-Stateless插件仅处理您的媒体库(图像),您可能还希望通过CDN提供您的脚本(JS、CSS)。只需按照以下步骤操作。

    1. 使用您的CDN提供商为您的资产配置一个单独的区域,并使用与上述不同的URL,例如cdn.yourdomain.com.
    2. 安装支持排除的WordPress CDN插件:  CDN enabler(免费)、  Perfmatters(付费)或 WP Rocket(付费)。
    3. 设置排除项,以便您的CDN插件仅加载CSS、JS等。这样WP-Stateless插件处理您的媒体文件,而CDN插件处理您的其他资源。

    Perfmatters中的CDN排除项

    Perfmatters中的CDN排除项

    最终结果是您的媒体从您的自定义CDN URL(从Google Cloud Storage中提取)加载,而您的资产从您的其他自定义CDN URL加载。如果您在“Stateless”模式下运行,您的WordPress网站将不会为图像使用任何磁盘空间。很酷!

    谷歌云存储和CDN组合

    谷歌云存储和CDN组合

    使用Google Cloud CDN配置WP Offload Media

    默认情况下,WP Offload Media配置为在提供卸载媒体时使用原始Google Cloud Storage URL。您的媒体URL可能如下所示:

    http://storage.googleapis.com/bucket-name/wp-content/uploads/…

    查看他们关于如何为Google Cloud Storage设置自定义域CDN的教程。

  • WordPress网站Amazon S3和CDN集成指南

    WordPress网站Amazon S3和CDN集成指南

    在本教程中,我们将向您介绍如何完成WordPress Amazon S3集成以及可选地使用内容交付网络 (CDN)。这可以大大节省您的带宽成本,充当备份,并帮助加快您的站点。

    Amazon S3是一种存储解决方案,是Amazon Web Services众多产品的一部分。通常,这用于需要使用我们的外部备份插件等解决方案进行额外备份的站点,或者正在提供大文件(下载、软件、视频、游戏、音频文件、PDF等)的站点。

    亚马逊拥有非常可靠的可靠记录,并且由于其庞大的基础设施,它们能够提供非常低的存储成本。S3的一些客户包括Netflix、Airbnb、SmugMug、Nasdaq等。

    Amazon S3

    由于Amazon S3完全处理大容量存储,您几乎可以保证定价会比您的WordPress主机便宜。将媒体迁移到AWS是一种省钱的好方法,并且在您的第一年免费(最多5GB存储空间)。此外,由于您的媒体请求是直接从亚马逊提供的,因此您的WordPress网站的负载更少,这意味着加载时间更快。

    不要将Amazon S3与Amazon CloudFront混淆。CloudFront是一种CDN解决方案,而S3是一种存储解决方案。但是,它们都可以互换使用,因为我们将在下面进行更多介绍。

    WordPress网站Amazon S3设置

    对于这种集成,我们建议使用WP Offload S3 Lite插件,由Delicious Brains的优秀团队开发。基本版是免费的。当文件上传到媒体库时,插件会自动将文件从您的WordPress站点复制到Amazon S3。然后有一个用于添加CDN的可选配置,例如Amazon CloudFront、KeyCDN或MaxCDN。

    WP Offload S3 Lite

    WP Offload S3 Lite

    这个插件非常轻量级,确切地说只有 204 KB。在撰写本文时,它目前拥有超过 30,000 次活跃安装,并获得 4 星评分(满分为 5 星)。请按照以下步骤操作。

    第 1 步

    接下来,安装免费的WP Offload S3 Lite插件。您可以从WordPress插件库下载它,也可以在WordPress仪表盘中的“安装插件”下搜索“wp offload s3”。单击“立即安装”并启用它。

    安装WP Offload S3 Lite

    安装WP Offload S3 Lite

    第 2 步

    您可以按照Delicious Brains的WordPress Amazon S3文档进行操作,或者我们将引导您更深入地了解其余部分。登录到您的亚马逊网络服务帐户。如果你没有,你可以免费注册。然后您需要创建一个新用户。选择一个用户名并确保选择“Programmatic access”。

    亚马逊网络服务 – 添加用户

    亚马逊网络服务 – 添加用户

    第 3 步

    现在您需要为用户设置权限以管理S3中的文件,因此选择“Attach existing policies directly”并单击“Create policy”。这将在新窗口中打开。一旦你完成了,你将需要回到这个。

    AWS中的权限

    AWS中的权限

    第 4 步

    单击创建您自己的策略选项旁边的“Select”。

    在AWS中创建策略

    在AWS中创建策略

    第 5 步

    接下来,您需要为您的保单命名和描述。这可以是任何你想要的。然后将以下代码复制到“Policy Document”部分。

    {
    “Version”: “2012-10-17”,
    “Statement”: [
    {
    “Effect”: “Allow”,
    “Action”: [
    “s3:CreateBucket”,
    “s3:DeleteObject”,
    “s3:Put*”,
    “s3:Get*”,
    “s3:List*”
    ],
    “Resource”: [
    “arn:aws:s3:::*”
    ]
    }
    ]
    }
    {
    “Version”: “2012-10-17”,
    “Statement”: [
    {
    “Effect”: “Allow”,
    “Action”: [
    “s3:CreateBucket”,
    “s3:DeleteObject”,
    “s3:Put*”,
    “s3:Get*”,
    “s3:List*”
    ],
    “Resource”: [
    “arn:aws:s3:::*”
    ]
    }
    ]
    }
    {
    "Version": "2012-10-17",
    "Statement": [
    {
    "Effect": "Allow",
    "Action": [
    "s3:CreateBucket",
    "s3:DeleteObject",
    "s3:Put*",
    "s3:Get*",
    "s3:List*"
    ],
    "Resource": [
    "arn:aws:s3:::*"
    ]
    }
    ]
    }

    此策略允许用户创建buckets、仅删除文件(不是buckets)、上传文件、下载文件以及列出文件和buckets。这是插件运行所需的基本权限级别。

    但是,我们建议您查看Delicious Brain关于额外bucket限制的文档。例如,修改上面的资源部分并添加您的存储桶名称以将其锁定(perftesting是我们在步骤 11中buck down的名称)。

    “Resource”: [
    “arn:aws:s3:::perftesting/*”,
    ]
    “Resource”: [
    “arn:aws:s3:::perftesting/*”,
    ]
    "Resource": [
    "arn:aws:s3:::perftesting/*",
    ]

    然后单击“Create Policy”。

    现在订阅 查看AWS中的政策

    查看AWS中的政策

    第 6 步

    从步骤4返回到窗口,您现在需要将策略添加到您正在创建的用户。单击“Refresh”,您应该会在顶部看到刚刚创建的新策略。选择它并单击“Next”。

    用户的AWS权限

    用户的AWS权限

    第 7 步

    然后点击“Create use”。

    AWS创建用户

    AWS创建用户

    第 8 步

    在最后一个屏幕上,您需要将您的访问密钥ID和私密访问密钥复制到一个安全的地方,因为您需要将其返回到您的WordPress仪表盘中。

    AWS访问密钥

    AWS访问密钥

    第 9 步

    然后回到WordPress,点击AWS下的“Access Keys”并输入您刚刚创建的凭证。或者,正如Delicious Brains建议的那样,最好在wp-config.php文件中定义它们。只需复制以下代码段并用键替换星号。

    define( ‘DBI_AWS_ACCESS_KEY_ID’, ‘********************’ );
    define( ‘DBI_AWS_SECRET_ACCESS_KEY’, ‘****************************************’ );
    define( ‘DBI_AWS_ACCESS_KEY_ID’, ‘********************’ );
    define( ‘DBI_AWS_SECRET_ACCESS_KEY’, ‘****************************************’ );
    define( 'DBI_AWS_ACCESS_KEY_ID', '********************' );
    define( 'DBI_AWS_SECRET_ACCESS_KEY', '****************************************' );

    在WordPress中连接亚马逊网络服务

    在WordPress中连接亚马逊网络服务

    第 10 步

    然后,您必须创建一个要使用的Bucket。如果您尚未注册Amazon S3,您可以在此处注册。他们有一个免费试用版,您可以开始使用。单击AWS插件设置下的“S3 and CloudFront”,然后单击“Create bucket”。然后,您可以选择一个地区。单击“Create New Bucket”。请记住,存储成本因地区而异。查看价格

    创建Amazon S3 Bucket

    创建Amazon S3 Bucket

    第 11 步

    要让WP Offload S3与某些第三方插件(例如WooCommerce)一起使用,您可能需要安装并激活它们的一些兼容性插件。这有时需要支付他们的高级许可证。但是,很多时候您也可以使用免费版本。默认情况下,会选中如下所示的以​​下选项。如果您通过HTTPS运行,则需要启用它。

    AWS插件设置

    AWS插件设置

    您的WordPress Amazon S3设置现已完成!当您的图像上传到您的WordPress媒体库时,它们现在将被复制到Amazon S3存储中。您也可以对您的资产(CSS、JS、字体等)执行相同的技术,但它需要高级许可证才能获得资源拉取插件

    注意:通过SFTP手动上传的文件不会被复制到Amazon S3。WP Offload Media仅迁移首次上传到您的WordPress媒体库的项目。

    上面的另一个重要设置是在将文件迁移到S3后从本地服务器中删除文件的选项。这有助于大幅减少WordPress主机的磁盘空间需求。如果启用此功能,请确保检查与其他插件的兼容性。您还可以查看有关从浏览器将文件上传到Amazon S3的教程。

    WordPress Amazon S3和CDN

    如果您使用CDN来加快资源交付速度,您可以在CloudFront或自定义域部分启用此功能。查看以下这些教程,让您快速上手。

    设置好CDN URL后,您可以将其输入到自定义域字段中,如下所示。

    CDN Amazon S3

    CDN Amazon S3

    请务必查看我们的教程,了解如何将媒体迁移到Google Cloud Storage

  • 为什么WordPress慢?让我们弄清楚问题的根源!

    为什么WordPress慢?让我们弄清楚问题的根源!

    弄清楚WordPress速度慢的原因可能具有挑战性。WordPress网站涉及许多部分,从其Web服务器和相关设置到各种主题和插件。这也可能是由于未优化的内容,例如图像、视频和嵌入。

    但是你怎么能找出导致性能问题的原因呢?很难马上说问题出在哪里——有多种可能性,我们将在这篇文章中探讨它们。

    我们不会仅仅停留在找出您的WordPress网站运行缓慢的原因。您还将学习许多加快慢速WordPress网站的方法。

    1. 为什么WordPress慢?
    2. 确定WordPress网站是否运行缓慢的4个步骤
    3. 改善WordPress网站速度的17种方法

    为什么WordPress慢?

    一些Web开发人员完全忽略了WordPress,理由是它有多慢。虽然以前可能是这种情况,但现在已经有一段时间了,这并不是一个准确的说法。如今,许多大品牌都使用WordPress来托管他们的网站。

    但是,许多因素会影响您的WordPress网站的性能。一些最常见的包括:

    • 您网站的网络托管服务提供商
    • 服务器端优化(PHP版本、缓存、压缩等)
    • 缓慢的WordPress主题
    • 缓慢的WordPress插件
    • 未优化的内容(主要是图片)
    • 外部HTTP请求过多
    • 不使用专用资源来提供内容(CDN、视频托管等)

    典型WordPress网站的各种元素

    典型WordPress网站的各种元素

    除了由您的网络托管服务提供商实施的适当的服务器优化之外,您还可以进行许多优化以确保您的网站超快。我们将在本文后面讨论这些,但首先,让我们弄清楚是什么让您的网站变慢。

    确定WordPress网站是否运行缓慢的4个步骤

    1. 第 1 步:运行页面加载速度测试
    2. 第 2 步:对网站进行负载测试
    3. 第 3 步:查看您的WordPress主题和插件
    4. 第 4 步:使用应用程序性能监控 (APM) 工具

    在您的网站上运行测试是确定是什么导致您的网站变慢的好方法 – 无论是您的网络托管服务提供商、网站本身,还是两者兼而有之?让我们来看看您可以运行的一些网站测试。

    第 1 步:运行页面加载速度测试

    您的网站加载速度有多快?任何加载时间超过两秒的网页都不利于用户体验。理想情况下,您的目标应该是加载时间低于1秒——介于两者之间的任何时间都可以,但您应该始终考虑进一步优化它。

    您可以为此目的使用不同的网站速度测试工具 ——GTmetrix、Pingdom Tools、Google PageSpeed Insights和WebPageTest都是不错的选择。

    我将使用GTmetrixPingdom工具 来演示此步骤。

    首先,让我们启动GTmetrix并测试一个网页。选择离您(或您网站的访问者)最近的服务器位置以获得更好的结果(提示: 注册一个免费的GTmetrix帐户以获得更多服务器位置选项)。

    GTmetrix主页

    GTmetrix主页

    在这里,我们正在测试WordPress网站的主页,因为这是大多数用户会访问的地方。此外,主页包含大量内容,因此非常适合测试。

    测试完成后,您将看到如下GTmetrix性能报告。

    GTmetrix报告示例

    GTmetrix报告示例

    GTmetrix根据许多指标对网页进行评分。它还提供了测试期间页面加载方式的可视化时间线。要详细了解它,您必须向下滚动。

    GTmetrix报告的“Summary”选项卡

    GTmetrix报告的“Summary”选项卡

    Summary选项卡突出显示了影响您网站性能的所有主要问题。在这种情况下,最重要的问题是服务器的响应时间。这几乎总是意味着考虑升级您的托管计划或迁移到更好的主机。但是,在你得出这个结论之前,最好先解决所有其他问题并重新审视这一点。

    下一个主要问题是“避免过多的DOM大小”——这是使用页面构建器时的常见问题。另一个问题——“避免大的布局变化”——也可能与页面构建器或主题有关。

    “避免巨大的网络负载”是指负载重的资产,例如图像、脚本和CSS文件。Page Details部分对此进行了快速概述 。在这里,您可以看到总页面大小和页面请求数非常高。

    不使用CDN在降低WordPress网站速度方面起着另一个关键作用。

    单击“Performance 选项卡将为您提供更多由浏览器和Lighthouse性能报告的指标。

    GTmetrix报告的Performance选项卡

    GTmetrix报告的Performance选项卡

    正如你所看到的,这个测试网页没有什么好做的。转到报告的StructureWaterfall选项卡将为您提供更多见解。

    接下来是Pingdom Tools,另一个流行的速度测试工具。我们将在这里再次测试同一个站点的主页。

    Pingdom Tools网站速度测试工具

    Pingdom Tools网站速度测试工具

    Pingdom Tools使用自己的算法来测试网页。这个网站的结果看起来也不是很好。

    Pingdom Tools速度测试结果

    Pingdom Tools速度测试结果

    进一步向下滚动将向您展示如何提高网站的性能。扩展每条建议将为您提供有关可以改进的地方和方式的更多详细信息。

    Pingdom的性能改进建议

    Pingdom的性能改进建议

    由于每个速度测试工具都有自己的性能指标,因此您无法直接将一个速度测试的结果与另一个进行比较。所以,无论你选择什么,最好还是坚持一个。

    最后,您还应该考虑网站的感知性能和实际性能之间的差异。阅读我们关于运行网站速度测试的深入文章以获取更多信息。

    第 2 步:对网站进行负载测试

    对您的网站进行负载测试将揭示有关它在现实世界中的速度的新信息。我们将为此使用k6  ,这是一个免费的开源负载测试工具,可以在您的系统上本地运行。

    k6 FOSS速度测试工具

    k6 FOSS速度测试工具

    使用免费的k6版本 需要一些命令行知识,但是一旦你开始使用它就会非常强大。(注: 或者,您可以使用k6的高级云解决方案或更简单的基于云的负载测试工具,如Loader.io

    结合其出色的k6 Reporter扩展,您可以运行负载测试并在HTML中获得精确的结果:

    k6负载测试结果——请求指标

    k6负载测试结果——请求指标

    以上结果是针对同一站点进行10分钟的负载测试,最多50个虚拟用户。仪表板还包括其他有用的统计信息:

    k6负载测试结果 - 其他统计信息

    k6负载测试结果 – 其他统计信息

    请注意,大多数请求都失败了,可能表明服务器无法处理它们。

    您还可以在k6脚本中设置阈值和检查(例如,页面加载时间低于1.5秒,用户能否登录等)。这些指标也将整齐地显示在仪表板中。

    下图显示了使用确切条件的另一个站点的负载测试结果,以便为您提供更清晰的画面。

    k6负载测试结果 - 第2轮

    k6负载测试结果 – 第2轮

    有28个失败的请求可能看起来很糟糕,但考虑到请求的总数,情况并非如此。这只是我本地机器发出的所有请求的0.25%。这里的结果表明该站点的网络托管服务提供商可以为相当数量的并发用户提供服务。

    第 3 步:查看您的WordPress主题和插件

    测试您的WordPress网站的主题和插件应该是发现任何主要性能问题的下一个主要步骤。这里有很多种类 – 您经常会发现某些主题和插件比其他主题和插件优化得更好。

    在速度测试部分的前面,我们讨论了在报告中发现有问题的主题或插件。但是还有另一种直接的方法——一次禁用一个主题或插件,然后查看站点的性能(在速度测试、负载测试或两者中)。

    如果性能问题仍然存在,请再禁用一个主题或插件并重新运行测试。继续这样做,直到找到罪魁祸首。

    但是,这种方法不适用于生产站点。拥有一个临时站点在这里真的很有帮助。您可以使用它通过添加、更改或删除特定功能来测试生产站点的各种迭代。

    大多数网络托管服务提供商,尤其是便宜的共享托管计划,默认情况下不提供此功能。因此,您必须手动设置登台站点或使用WordPress登台插件(如WP StagecoachWP Staging)。

    这个登台站点实际上是您的生产站点的精确副本,包括其服务器和服务器端配置。您可以使用它来修补和测试您的网站,而不会影响其实时版本。

    第 4 步:使用应用程序性能监控 (APM) 工具

    APM工具与速度和负载测试工具相结合可以增强您的网站诊断能力。

    无需设置临时站点并逐个猜测要禁用哪个插件或主题,一个称职的APM工具可以帮助您确定性能缓慢的根源——而无需更改站点上的任何内容。它跟踪和分析缓慢的事务、数据库查询、外部请求、WordPress钩子、插件等。

    Kinsta APM

    Kinsta APM

    通常,使用APM工具对初学者并不友好。即使是专业的开发人员也需要一些关于如何有效使用它的培训。另外,总是有额外的成本因素,因为它们中的大多数都需要许可证才能运行。

    最简单直接的方法是,使用免费的Query Monitor WordPress插件

    您可以禁用WP-Cron并将其替换为系统cron以提高站点的性能。

    利用APM工具,您会找到最慢的WordPress插件和钩子。

    APM的“WordPress”标签

    APM的“WordPress”标签

    如果您在此处发现任何不必要的插件,或具有重复功能的插件,您可以将它们从您的WordPress站点中删除。例如,我可以在这里看到两个联系表单插件,以及一个本网站可以不用的投资组合插件。

    向下滚动此选项卡将显示最慢的WordPress钩子。

    显示最慢的WordPress钩子

    显示最慢的WordPress钩子

    跟踪最慢的WordPress钩子是APM最有用的功能之一。您可以单击挂钩项目以查看其事务样本。

    查看慢钩子的事务样本

    查看慢钩子的事务样本

    通过准确了解哪个插件、主题或钩子是性能瓶颈,您可以提高网站性能并减少页面加载时间。

    加速WordPress网站的17种方法

    知道是成功的一半!根据这些知识采取行动,您将看到结果。您已经执行了上述所有测试。现在,让我们探索可以加速WordPress网站的潜在领域。

    您可以使用以下有用的链接跳转到任何部分:

    1. 保持您的WordPress网站更新
    2. 优化您网站的图片
    3. 谨慎使用插件(仅在必要时)
    4. 选择一个快速的WordPress主题
    5. 配置缓存以优化您的网站
    6. 减少外部HTTP请求(和API调用)
    7. 缩小您网站的脚本和样式表
    8. 在每个页面加载时仅加载必要的脚本
    9. 加快您缓慢的WordPress管理仪表板
    10. 服务器位置和配置事项
    11. 使用内容交付网络 (CDN)
    12. 删除不必要的URL重定向
    13. 修复WordPress混合内容警告(HTTPS/SSL错误)
    14. 定期优化您的WordPress数据库
    15. 选择基于云的WordPress安全服务
    16. 升级到最新的PHP版本
    17. 切换到受信任的托管WordPress主机

    1. 保持您的WordPress网站更新

    维护WordPress网站的一个重要方面是保持更新。这似乎是最明显的做法,但仍然值得提醒。

    WordPress更新包括安全补丁、最新功能和性能修复。

    您可以在其wp-config.php文件中为您的站点启用自动更新。我们始终建议更新到最新的WordPress版本以确保您的网站安全。

    同样,您还应该更新所有活动的插件和主题。如果您在您的网站上发现任何超过一年未更新的插件或主题,那么是时候重新考虑其替代品了。

    2.优化您网站的图片

    根据HTTP存档 (2022年3月1日),WordPress网站的中位页面重量为2408KB,其中图像几乎占1117KB(占总页面重量的46.38%)。

    WordPress:图像状态

    WordPress:图像状态。(来源:HTTP存档)

    难怪大图像会减慢您的网站速度,从而产生不太理想的用户体验。因此,手动或使用插件优化图像可以大大加快页面加载时间。

    优化图像时,您可以使用有损或无损图像压缩方法。大多数图像编辑器在保存图像的同时提供质量调整以实现最佳图像压缩。有损压缩几乎总是在保留图像细节和拥有更小的文件大小之间达到完美的平衡点。

    选择正确的图像文件格式至关重要。PNG非常适合计算机生成的图形,而JPEG则更适合照片。还有更多的图像格式,例如GIF、SVG、JPEG XR和WebP。有些浏览器普遍支持,有些则不支持,因此您必须在选择它们之前仔细研究。

    WordPress媒体设置 -> 图像大小。

    WordPress默认支持响应式图片。您可以设置您喜欢的图像大小,让WordPress处理其余的。但是如果你想节省磁盘空间,你可以使用像Imsanity这样的免费WordPress插件来自动将大图像缩小到配置的大小。

    至于WordPress图像优化插件,ImagifyShortPixel 是一些流行的选项。我们在关于优化网络图像的详细文章中列出了更多选项。

    3. 谨慎使用插件(仅在必要时)

    插件是WordPress及其社区的生命。WordPress.org上列出了令人印象深刻的54,000多个免费插件库 ,以及其他地方列出的数千个插件,您可以在安装WordPress插件时陷入困境。

    未优化的WordPress插件会降低您网站的性能,增加页面加载时间。

    尽管如此,您可以在不损害网站性能的情况下安装数十个WordPress插件,但您还必须确保这些插件编码良好并针对性能进行了优化。更重要的是,插件开发人员应该对它们进行优化以使其相互配合。

    WordPress插件推荐列表

    WordPress插件推荐列表

    您可以浏览我们为各种用例精心挑选的最佳WordPress插件列表。无论是SEO插件社交媒体插件联系表单插件还是电子商务插件,您一定会在那里找到有用的东西。

    无论您安装了多少插件,您都可以随时参考本文中的第 3 步和/或第 4 步来确定您是否有任何有问题的插件。

    4. 选择一个快速的WordPress主题

    选择一个快速的WordPress主题对于您的网站性能和用户体验至关重要。主题的功能,如布局、导航菜单、调色板、字体和图像放置,是访问者首先会注意到的。

    如果这些功能没有得到很好的优化,你的网站可能很漂亮,但速度也很慢。

    Hello Elementor是一个流行的WordPress主题

    Hello Elementor是一个流行的WordPress主题

    在选择WordPress主题之前,请列出您想要在您的网站上使用的所有功能。然后研究并记下符合您要求的主题。

    始终寻找具有高评级和出色客户支持的值得信赖的开发人员。我们还建议您避免使用不经常更新的主题。

    无论是免费主题还是高级主题,请选择能够实现您网站目标的主题。为了方便您,我们测试了数十个WordPress主题,包括WooCommerce主题,并列出了表现最佳的主题:

    选择具有重点“主题”的主题, 因为我们经常发现它们简单而轻量级。您可以找到大量实用且美观的主题,而不会产生不必要的臃肿(例如,避免使用半生不熟的页面构建器插件的主题)。

    如果您已经有一个实时的WordPress站点,我们建议您设置一个临时站点并在发布之前测试主题。

    5.配置缓存以优化您的网站

    各种网站缓存的插图

    各种网站缓存的插图

    缓存是一种具有多层的复杂技术。我们有一篇专门的文章来解释什么是缓存。快速总结一下,它是存储和调用经常提供的数据以加快网站速度的过程。

    WordPress在PHP和MySQL上运行,如果您不使用缓存,这两者都会变得臃肿。因此,您的网站速度是您、您的主机和缓存之间的共同努力。

    大多数托管WordPress主机都负责服务器级别的缓存,因此您不必自己实现它。但是,如果他们不这样做,您可以随时使用免费的WordPress缓存插件 (例如WP Super Cache、  W3 Total Cache)。

    缓存和不缓存站点对比

    缓存和不缓存站点对比

    即使没有启用缓存,上述站点的性能也非常出色,因为它经过了合理的优化。但是,启用缓存后,它的性能提高了23%。如果您要为成千上万的唯一访问者提供服务,那么这些加载时间就会加起来。

    6. 减少外部HTTP请求(和API调用)

    您的WordPress网站的主题和插件可能包括对各种资源的外部请求。通常,这些请求用于加载外部托管的文件,例如样式表、字体、脚本等。

    CSS可以是一个渲染阻塞资源

    CSS可以是一个渲染阻塞资源

    有时,它们用于添加分析、社交媒体共享等功能。

    使用其中的一些是可以的,但太多会降低您的网站速度。如果您可以减少HTTP请求的数量并优化它们的加载方式,您就可以加速您的网站。

    有关详细指南,您可以参考我们关于如何减少HTTP请求的文章。

    7. 缩小网站的脚本和样式表

    代码缩小是从代码中删除不必要元素的过程。对于WordPress网站,主要包括缩小JS脚本 和CSS样式表。

    这些元素是代码的一部分,因为它很容易被人类(或Web开发人员)阅读。这种元素的一个简单示例是代码注释。但是,机器(或网络浏览器)不需要这些元素。

    通过缩小您的网站代码,您可以拥有更小的JavaScript和CSS文件。它们不仅加载速度更快,而且浏览器解析它们的速度也更快。它们一起可以极大地提高您的页面加载速度。

    大多数WordPress性能插件 将帮助您毫不费力地做到这一点。一个流行的选项是免费的Autoptimize插件,在撰写本文时,它的活跃安装量已超过1万。

    这种minify发生在Cloudflare 的边缘网络上。它甚至也缓存在那里。由于Cloudflare负责最终缩小代码并将这些文件从最近的边缘服务器提供给访问者,因此它可以释放您的服务器资源。

    8.在每次页面加载时只加载必要的脚本

    大多数WordPress主题和插件资源经常在所有页面上加载和运行,即使在某些页面上不需要它们。例如,联系表单插件可以在每个页面上加载其资产,而不仅仅是在具有联系表单的页面(例如联系页面)上。

    缩小和组合这些脚本可能会稍微提高您的网站性能,但最好首先阻止这些脚本和样式加载。

    我们建议 为此任务使用免费的 Asset Cleanup插件。它将扫描页面上加载的所有资产。然后,您可以选择此特定页面上不需要的CSS和JS文件,从而减少臃肿。

    使用“ Asset Cleanup”插件

    使用“ Asset Cleanup”插件

    资产清理与缓存结合使用效果最佳,因为优化的页面不必由Web服务器重复生成。

    9. 加速你缓慢的WordPress管理仪表板

    通常,后端优化从优化前端开始,因为加速前端几乎总是能解决后端的性能问题。

    如果您的WordPress管理员反应迟缓,您可以反过来做同样的事情——修复后端性能问题可能有助于加快您的网站访问速度。

    在这种情况下,使用服务器级APM工具总是很方便,因为安装额外的插件可能会进一步降低您的网站速度。

    使用Kinsta APM查找最慢的事务

    使用Kinsta APM查找最慢的事务

    高Admin-Ajax使用率是WordPress网站中常见的性能瓶颈。然而,缓慢的WordPress管理员也可能是由于后台WordPress任务,例如WordPress备份、WP-Cron等(如我们之前的示例中所示)。或者它可能是一个臃肿的插件,它在您的管理仪表板中添加了太多的横幅。

    10. 服务器位置和配置事项

    您的Web服务器的位置及其配置会对您网站的速度产生重大影响。

    例如,如果您的网络服务器在美国,您的网站对来自欧洲或印度的访问者的加载速度将比对来自美国的访问者的加载速度慢。

    您可以使用以下方法缓解这种情况:

    • 离您和您网站的大多数访问者最近的网络服务器。
    • 具有广泛全球覆盖范围的CDN 。

    11. 使用内容交付网络 (CDN)

    加快网站速度的最简单方法之一是使用快速可靠的CDN。

    CDN通过直接向您的访问者提供内容来减轻您的Web服务器的负载。这些是一个服务器网络(也称为POP),旨在托管和交付站点内容的副本,例如图像、样式表、字体、脚本和视频。

    Cloudflare CDN

    Cloudflare CDN

    我们建议每个网站至少使用某种类型的CDN来加快其性能。

    提示:如果您的网站使用任何流行的开源JavaScript库(例如 jQuery、D3.js、three.js、Web Font Loader),您可以使用Google Hosted Libraries CDN来加快其交付速度。

    12. 删除不必要的URL重定向

    如果您要使用新帖子和页面更新网站,您的URL结构可能会发生变化。在这种情况下,URL重定向是一件好事。但是,如果您不遵循WordPress 重定向最佳实践,您可能会对您网站的用户体验和搜索引擎优化 (SEO)产生负面影响。

    配置不当的URL重定向最常见的问题是导致重定向链。在某些情况下,这个链是一个无限重定向循环。这种重定向链通常会导致页面加载时间增加。

    有时,错误配置的URL重定向也可能导致错误404“找不到页面” 错误。如果您的网站生成大量404错误,它也会影响您的网站性能,因为这些响应通常不会被缓存。

    我们的蜘蛛分析插件,可帮助您查看重定向和404错误的确切数量。

    蜘蛛统计插件日志列表的404错误和30x重定向故障

    蜘蛛统计插件日志列表的404错误和30x重定向故障

    您可以设计一个有创意的404错误页面来摆脱它,但从长远来看,这对您没有帮助。

    闪电博的错误 404“找不到页面”页面

    闪电博的错误 404“找不到页面”页面

    以下是避免创建不必要的重定向的方法:

    • 使用正确的URL前缀(HTTP或HTTPS)。
    • 保留或删除URL中的“www”子域(不要混淆)。
    • 不要在URL中使用帖子和页面ID 。
    • 包括整个URL路径。
    • 确保您的顶级域 (TLD)在一个重定向中解析(理想情况下,应该没有重定向)。

    WordPress包括许多设置重定向的方法。其中之一是John Godley的免费且流行的重定向插件

    使用免费的WordPress '重定向'插件

    使用免费的WordPress ‘重定向’插件

    如果您的网站通过宝塔面板管理,您还可以从宝塔面板仪表板管理重定向。此工具是设置重定向的更好方法,因为规则是在服务器级别实现的。这也意味着您需要少安装一个第三方插件。

    在宝塔面板中添加重定向规则

    在宝塔面板中添加重定向规则

    转到您要管理的站点,点击设置,然后单击“重定向”选项卡。然后通过单击大的“添加重定向”按钮添加新的重定向。

    如果您的网络主机使用Apache服务器,您需要编辑其.htaccess 文件以设置重定向。对于这种情况,您可以使用.htaccess Generator站点为您的站点生成正确的重定向规则。

    13. 修复WordPress混合内容警告(HTTPS/SSL错误)

    今天必须通过HTTPS协议运行您的WordPress网站。但是,在从HTTP迁移到HTTPS时,您可能会遇到几个问题——最常见的一个是“混合内容警告”警报

    当页面包含HTTP和HTTPS内容时,会出现混合内容警告。不安全地加载资源不仅是一个安全问题,也是一个潜在的性能问题。

    如果您在您的网站上遇到混合内容错误,您可以使用免费工具(如Why No Padlock  )向您显示哪些资源被不安全地加载。

    然后,您可以执行快速搜索和替换以修复所有潜在原因。免费的Better Search Replace插件是解决此问题的一种方法。

    一个简单的搜索和替换应该可以解决您所有的混合内容警告。但如果没有,您可能需要查找并手动更新一些硬编码脚本。或者聘请可以为您做到这一点的开发人员。

    14. 定期优化你的WordPress数据库

    WordPress站点的数据库存储其所有关键信息。但是如果没有定期维护,它可能会降低您的网站速度。

    例如,当您启动网站时,WordPress数据库仍然可以保存多年前的信息。这包括帖子和页面修订、草稿、已删除的评论和已删除的帖子。虽然它们可能有助于编辑和发布最近的帖子,但随着时间的推移,数据库会积累大量不必要的数据并变得臃肿。

    因此,优化您的WordPress数据库对于改善和维护您网站的性能是必要的。

    此外,一些插件和主题将数据添加到wp_options表 中,以便更轻松地配置它们并自动加载设置。但是自动加载过多的数据会减慢页面响应时间。

    您可以使用各种技术来优化WordPress数据库。一种方法是使用phpMyAdmin或Adminer手动清除过时的数据库项目。或者您可以使用WordPress数据库优化插件 ,例如WP-OptimizeWP-SweepAdvanced Database Cleaner

    使用“高级数据库清理器”插件

    使用“高级数据库清理器”插件

    15. 选择基于云的WordPress安全服务

    每天都有成千上万的WordPress网站被黑客入侵。因此,安全性对于WordPress网站来说是一个关键问题,您需要时刻掌握它。

    您有两种使用防火墙保护WordPress站点的主要方法:

    1. 选择具有 良好记录的安全网络托管服务
    2. 使用专门的第三方安全服务来保护您的网站

    第一个选项是明确的。可靠的WordPress托管服务提供商将为您处理大部分网站安全措施。

    但是,如果您必须选择第二个选项,您还有另外两个选择:

    1. 选择WordPress安全插件(例如Wordfence)
    2. 选择DNS防火墙(例如Cloudflare)

    WordPress安全插件因其始终在线和定期扫描要求而耗尽了您网站的资源。

    相反,您可以使用Cloudflare等基于云的安全解决方案。它们还提供针对机器人、DDoS攻击和代理流量的额外保护。

    此外,我们支持双因素身份验证 (2FA) 和IP地理位置阻止。我们还会在一分钟内禁止登录尝试失败六次的IP。此外,我们强制实施完全加密的连接(SFTP、SSH、HTTPS),在所有新的WordPress安装上要求使用强密码,并提供黑客修复保证。

    16. 升级到最新的PHP版本

    WordPress主要由服务器端编程语言PHP提供支持。甚至它的主题和插件也主要是用PHP编写的。

    通常,较新的PHP版本比较旧的版本更快。它们提供了许多性能改进,也更安全。

    年度PHP基准测试发现WordPress在PHP 8.1上比PHP 8.0快47.10% 。与PHP 7.2相比,它更快, 每秒处理超过50%的请求。

    WordPress 5.9-RC2 PHP基准测试

    WordPress 5.9-RC2 PHP基准测试

    在撰写本文时,大多数WordPress插件、主题和开发工具尚不支持PHP 8.1。如果您计划将生产站点的环境升级到PHP 8.1,我们建议您在暂存环境中对其进行彻底测试,以确保它不会中断。

    不过,如果您的服务器仍在PHP 7.x版本上,您可以更新到PHP 8.0并获得大部分相同的好处。

    因此您可以在升级之前在其上彻底测试您的网站。如果您的主机没有让您选择更新到最新的PHP版本,那么是时候重新考虑您的主机提供商了。

    17. 切换到受信任的WordPress主机

    如果您已经尝试了上述所有步骤,但仍然卡在缓慢的WordPress网站上,那么剩下的唯一选择就是切换到可靠的WordPress托管服务提供商。

    通常,WordPress托管具有多种功能,可帮助WordPress网站高效、安全、快速地运行。所有技术知识都留给专家,让您专注于经营业务。

    WordPress托管的计划通常高于共享托管或DIY VPS托管,但您得到的是您所支付的费用。一些流行的托管WordPress主机是Kinsta、WP Engine、Flywheel、Pressable和Pagely。

    无论您最终与谁托管您的网站,都要正确地进行研究并确保它符合您网站的要求。大多数托管WordPress主机还提供免费迁移 ,因此您可以轻松地将当前站点迁移到新主机,而无需任何停机时间。

    小结

    修复缓慢的WordPress网站涉及许多步骤,但您可以做到。拥有一个快速的网站有助于提升您的SEO、用户体验和转化率。另外,每个人都喜欢快速的网站!

  • 如何在WordPress中删除jQuery Migrate?

    如何在WordPress中删除jQuery Migrate

    jQuery Migrate通过识别不推荐使用的功能,极大地简化了将旧jQuery代码移动到更高jQuery版本的过程。然后它会恢复已弃用的功能和行为,以便旧代码仍能在当前jQuery版本及更高版本上正常运行。

    大多数最新的前端代码和插件不需要jquery-migrate.min.js。在大多数情况下,这只会给您的网站增加不必要的负载。如果您启动,您可以看到它正在运行Chrome开发工具控制台.

    删除jQuery Migrate的其他原因:

    • 保持你的代码、主题和插件更新比修补支持额外的文件更好。保持您的网站更新也可以防止它受到安全攻击。
    • 如果您正在运行使用旧jQuery代码的插件,最好更新它们或切换到保持更新的替代方案。

    如何从WordPress中删除jQuery Migrate?

    从WordPress中移除 jQuery Migrate非常简单。您只需要将以下代码行添加到主题functions.php文件中。

    //Remove JQuery migrate
    function remove_jquery_migrate( $scripts ) {
    if ( ! is_admin() && isset( $scripts->registered[‘jquery’] ) ) {
    $script = $scripts->registered[‘jquery’];
    if ( $script->deps ) {
    // Check whether the script has any dependencies
    $script->deps = array_diff( $script->deps, array( ‘jquery-migrate’ ) );
    }
    }
    }
    add_action( ‘wp_default_scripts’, ‘remove_jquery_migrate’ );
    //Remove JQuery migrate
    function remove_jquery_migrate( $scripts ) {
    if ( ! is_admin() && isset( $scripts->registered[‘jquery’] ) ) {
    $script = $scripts->registered[‘jquery’];
    if ( $script->deps ) {
    // Check whether the script has any dependencies
    $script->deps = array_diff( $script->deps, array( ‘jquery-migrate’ ) );
    }
    }
    }
    add_action( ‘wp_default_scripts’, ‘remove_jquery_migrate’ );
    //Remove JQuery migrate
    function remove_jquery_migrate( $scripts ) {
    if ( ! is_admin() && isset( $scripts->registered['jquery'] ) ) {
    $script = $scripts->registered['jquery'];
    if ( $script->deps ) { 
    // Check whether the script has any dependencies
    $script->deps = array_diff( $script->deps, array( 'jquery-migrate' ) );
    }
    }
    }
    add_action( 'wp_default_scripts', 'remove_jquery_migrate' );

    另一种禁用它的最简单方法是添加一个名为Remove jQuery Migrate的插件。

    使用WP Rocket插件删除jQuery Migrate

    WP Rocket插件带有内置功能,只需单击即可删除jQuery Migrate。

    要使用WP Rocket删除jQuery Migrate,请转到WP Rocket插件的设置 >> FILE OPTIMZATION。

    使用WP Rocket缓存插件删除jQuery Migrate

    使用WP Rocket缓存插件删除jQuery Migrate

    在JavaScript Files部分下,您可以选中Remove jQuery Migrate复选框。就是这样。

    参考阅读:使用WP Rocket插件加速您的WordPress网站.

    使用插件Remove jQuery Migrate删除jQuery Migrate:

    Remove jQuery Migrate这个插件从站点的前端删除jQuery Migrate脚本(注:该插件已经久未更新版本)。

    转到仪表板:登录到您的WordPress站点以打开仪表板。

    转到插件:您将在左侧菜单栏上看到插件菜单。单击它将展开更多选项,单击添加新的。

    如图所示,在搜索栏中搜索Remove jQuery Migrate。

    如何在WordPress中删除jQuery Migrate?-1

    搜索安装插件

    如何在WordPress中删除jQuery Migrate?-1

    点击立即安装

    激活插件,就是这样。该插件将完成您的其余工作。

    这是大多数开发人员建议的最常用的插件。您还可以选择其他可用的插件。

    正如我上面提到的,jQuery migrate给你的站点增加了不必要的负载。因此,我建议将其从您的网站或博客中删除。

  • 如何清理WordPress网站Header部分不必要代码?

    如何清理WordPress网站Header部分不必要代码?

    很长一段时间以来,我一直在使用几个插件来清理WordPress Headers中的一些字段。在大多数情况下,我会说您通常不需要很多信息。

    为什么WordPress将这些功能和链接添加到您的网站?

    嗯,原因很明显。WordPress是一个非常大的CMS平台,被超过27%的在线博客网站使用。每个出版商都有自己的要求。有些喜欢wp-admin浏览器页面发布文章,有些使用第三方工具,有些使用 iOS或Android应用。

    如果您使用网络版本在您的WordPress网站上发布文章,那么您应该从您的WordPress网站中删除所有不必要的链接。

    有什么优势?

    1. 页面加载速度肯定更快
    2. 内容代码比增加
    3. 您的重要网站内容现在略高于搜索引擎的读取方式

    让我们看一下WordPress Headers中的一些链接。以下步骤将帮助您清理和优化WordPress网站的header部分。

    WordPress添加EditURI到您的网站Header,如果您通过第三方工具发布文章,这是必需的。

    <link type=“application/rsd+xml” title=“RSD” href=“https://crunchify.com/xmlrpc.php?rsd”>
    <link type=”application/rsd+xml” title=”RSD” href=”https://crunchify.com/xmlrpc.php?rsd”>
    <link type="application/rsd+xml" title="RSD" href="https://crunchify.com/xmlrpc.php?rsd">

    怎么禁用?将下方代码添加到您的主题functions.php文件中:

    remove_action (‘wp_head’, ‘rsd_link’);
    remove_action (‘wp_head’, ‘rsd_link’);
    remove_action ('wp_head', 'rsd_link');

    2.删除WordPress版本号

    版本号可能会暴露您的WordPress版本信息,让某些有预谋的人有机可乘。

    <meta name=“generator” content=“WordPress 4.9.2”>
    <meta name=”generator” content=”WordPress 4.9.2″>
    <meta name="generator" content="WordPress 4.9.2">

    下面的代码将从站点中删除WordPress版本号。

    function crunchify_remove_version() {
    return ;
    }
    add_filter(‘the_generator’, ‘crunchify_remove_version’);
    function crunchify_remove_version() {
    return ”;
    }
    add_filter(‘the_generator’, ‘crunchify_remove_version’);
    function crunchify_remove_version() {
        return '';
    }
    add_filter('the_generator', 'crunchify_remove_version');

    如果您不使用Windows Live Writer写作,完全可以移除WordPress网站Header的以下内容。

    <link type=“application/wlwmanifest+xml” href=“https://www.wbolt.com/wp-includes/wlwmanifest.xml”>
    <link type=”application/wlwmanifest+xml” href=”https://www.wbolt.com/wp-includes/wlwmanifest.xml”>
    <link type="application/wlwmanifest+xml" href="https://www.wbolt.com/wp-includes/wlwmanifest.xml">

    在你的主题function添加以下代码:

    remove_action( ‘wp_head’, ‘wlwmanifest_link’);
    remove_action( ‘wp_head’, ‘wlwmanifest_link’);
    remove_action( 'wp_head', 'wlwmanifest_link');

    如果您使用其他的固定链接形式,WordPress默认的短连接是完全没有意义的,可以考虑移除。

    <link href=“https://www.wbolt.com/?p=8112”>
    <link href=”https://www.wbolt.com/?p=8112″>
    <link href="https://www.wbolt.com/?p=8112">

    在你的主题function添加以下代码:

    remove_action( ‘wp_head’, ‘wp_shortlink_wp_head’);
    remove_action( ‘wp_head’, ‘wp_shortlink_wp_head’);
    remove_action( 'wp_head', 'wp_shortlink_wp_head');

    5.从所有静态资源中删除查询字符串

    静态资源查询字符串

    静态资源查询字符串

    添加下面的代码,所有查询字符串都将被删除。

    function wbolt_cleanup_query_string( $src ){
    $parts = explode( ‘?’, $src );
    return $parts[0];}
    add_filter( ‘script_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    add_filter( ‘style_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    function wbolt_cleanup_query_string( $src ){
    $parts = explode( ‘?’, $src );
    return $parts[0];}
    add_filter( ‘script_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    add_filter( ‘style_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    function wbolt_cleanup_query_string( $src ){
        $parts = explode( '?', $src );
        return $parts[0];}
    add_filter( 'script_loader_src', 'wbolt_cleanup_query_string', 15, 1 );
    add_filter( 'style_loader_src', 'wbolt_cleanup_query_string', 15, 1 );

    注: explore ('?', $src)将删除?符号后的所有内容。如果您只想删除with ver的查询字符串,请替换??ver.

    WordPress REST API使CMS能够与其他Web属性进行通信,无论它们是用什么编程语言编写的。

    但是,很多网站不使用它,因此在大多数情况下,它只是不必要的代码。默认情况下,每个站点的标题中都包含一个链接:

    <link href=“https://www.wbolt.com/wp-json/”>
    <link href=”https://www.wbolt.com/wp-json/”>
    <link href="https://www.wbolt.com/wp-json/">

    在你的主题function添加以下代码:

    remove_action(‘wp_head’, ‘rest_output_link_wp_head’, 10);
    remove_action(‘template_redirect’, ‘rest_output_link_header’, 11, 0);
    remove_action(‘wp_head’, ‘rest_output_link_wp_head’, 10);
    remove_action(‘template_redirect’, ‘rest_output_link_header’, 11, 0);
    remove_action('wp_head', 'rest_output_link_wp_head', 10);
    remove_action('template_redirect', 'rest_output_link_header', 11, 0);

    禁用WordPress网站上的嵌入将执行以下操作:

    • 它可以防止其他人嵌入您的网站,也可以防止您嵌入网站。
    • 删除oEmbed特定的JavaScript。
    • 禁用对oEmbed结果的过滤。
    • 删除oEmbed发现链接。
    • 关闭oEmbed自动发现。
    • 删除所有嵌入重写规则。
    remove_action(‘wp_head’, ‘wp_oembed_add_discovery_links’, 10);
    remove_action(‘wp_head’, ‘wp_oembed_add_discovery_links’, 10);
    remove_action('wp_head', 'wp_oembed_add_discovery_links', 10);

    这是一个完整的代码:

    将以下代码添加到主题的functions.php文件中,一切就绪。

    // ******************** Clean up WordPress Header START ********************** //
    function wbolt_remove_version() {
    return ;
    }
    add_filter(‘the_generator’, ‘wbolt_remove_version’);
    remove_action(‘wp_head’, ‘rest_output_link_wp_head’, 10);
    remove_action(‘wp_head’, ‘wp_oembed_add_discovery_links’, 10);
    remove_action(‘template_redirect’, ‘rest_output_link_header’, 11, 0);
    remove_action (‘wp_head’, ‘rsd_link’);
    remove_action( ‘wp_head’, ‘wlwmanifest_link’);
    remove_action( ‘wp_head’, ‘wp_shortlink_wp_head’);
    function wbolt_cleanup_query_string( $src ){
    $parts = explode( ‘?’, $src );
    return $parts[0];
    }
    add_filter( ‘script_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    add_filter( ‘style_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    // ******************** Clean up WordPress Header END ********************** //
    // ******************** Clean up WordPress Header START ********************** //
    function wbolt_remove_version() {
    return ”;
    }
    add_filter(‘the_generator’, ‘wbolt_remove_version’);

    remove_action(‘wp_head’, ‘rest_output_link_wp_head’, 10);
    remove_action(‘wp_head’, ‘wp_oembed_add_discovery_links’, 10);
    remove_action(‘template_redirect’, ‘rest_output_link_header’, 11, 0);

    remove_action (‘wp_head’, ‘rsd_link’);
    remove_action( ‘wp_head’, ‘wlwmanifest_link’);
    remove_action( ‘wp_head’, ‘wp_shortlink_wp_head’);

    function wbolt_cleanup_query_string( $src ){
    $parts = explode( ‘?’, $src );
    return $parts[0];
    }
    add_filter( ‘script_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    add_filter( ‘style_loader_src’, ‘wbolt_cleanup_query_string’, 15, 1 );
    // ******************** Clean up WordPress Header END ********************** //

    // ******************** Clean up WordPress Header START ********************** //
    function wbolt_remove_version() {
        return '';
    }
    add_filter('the_generator', 'wbolt_remove_version');
    
    remove_action('wp_head', 'rest_output_link_wp_head', 10);
    remove_action('wp_head', 'wp_oembed_add_discovery_links', 10);
    remove_action('template_redirect', 'rest_output_link_header', 11, 0);
    
    remove_action ('wp_head', 'rsd_link');
    remove_action( 'wp_head', 'wlwmanifest_link');
    remove_action( 'wp_head', 'wp_shortlink_wp_head');
    
    function wbolt_cleanup_query_string( $src ){
        $parts = explode( '?', $src );
        return $parts[0];
    }
    add_filter( 'script_loader_src', 'wbolt_cleanup_query_string', 15, 1 );
    add_filter( 'style_loader_src', 'wbolt_cleanup_query_string', 15, 1 );
    // ******************** Clean up WordPress Header END ********************** //
  • 从WordPress评论表单中删除网站URL的6种方法

    从WordPress评论表单中删除网站URL的6种方法插图

    评论垃圾邮件是接受博客评论的WordPress博主面临的最大挑战之一。许多用户发表评论只是为了留下他们的网站链接URL。这是从权威网站获取反向链接的简单方法。如果您只想接受感兴趣用户的评论,那么您可以在WordPress评论表单中删除网站URL或评论作者链接。

    管理WordPress评论中的垃圾邮件

    在我们之前的文章中,我们已经解释了如何有效地拦截WordPress中的垃圾评论。基本上,您可以使用以下选项:

    • 使用Akismet等插件自动过滤垃圾评论。
    • 阻止IP地址列表中的评论。
    • 通过阻止敏感词来防止激进的评论。
    • 限制注册用户的评论。
    • 保留所有评论以供审核和手动批准。
    • 适度发表评论,其中包含一定数量的超链接。

    尽管所有这些方法都会减少垃圾邮件,但由于一个原因,您无法完全摆脱垃圾邮件。那是WordPress评论表单中可用的网站URL文本框。

    WordPress评论表单行为

    默认情况下,WordPress评论表单具有以下字段:

    默认WordPress评论表单

    默认WordPress评论表单

    • 评论留言框
    • 姓名
    • 电子邮件
    • 网站
    • 在浏览器中保存名称/电子邮件/网站以供进一步评论
    • 提交按钮

    您可以在“设置 > 讨论”部分下的浏览器选项中启用或禁用保存名称/电子邮件/网站。

    禁用保存名称和电子邮件选项

    禁用保存名称和电子邮件选项

    除此选项外,WordPress管理面板中没有可用的设置来更改评论表单字段。

    评论表单中的网站URL

    几乎75%的用户留下评论只是为了提供他们的网站URL并获得反向链接。默认情况下,WordPress将rel="external nofollow ugc" 参数分配给注释链接,将它们指示为用户生成的内容。但是,这些链接仍然会损害您的网站,尤其是当它们与您的网站无关时,例如色情链接。用户在您的网站上发表评论后,WordPress将通过链接名称和URL字段来显示已批准的评论。

    与评论作者姓名链接的网站

    与评论作者姓名链接的网站

    在WordPress评论中删除网站URL的6种方法

    如果您收到数十万条垃圾评论,最好的选择是禁用评论表单中的网站URL字段。如果表单中没有URL选项,则以获取反向链接为目标的垃圾邮件发送者将停止。此外,您可以节省处理评论提交所需的服务器带宽。您可以使用多种方式删除WordPress中的评论作者链接。

    1. 使用CSS禁用WordPress评论表单中的网站URL

    当你查看评论表单的源代码时,你可以很容易地发现WordPress使用comment-form-url类在表单中显示网站URL。您需要做的只是简单地转到“外观 > 附加CSS”部分,粘贴以下CSS代码并发布您的网站。

    .comment-form-url{
    display:none;
    }
    .comment-form-url{
    display:none;
    }
    .comment-form-url{
    display:none;
    }

    这将从WordPress评论表单中删除评论作者链接框。下面是它在2021主题浏览器的开发者控制台上的外观。

    使用CSS在评论中禁用网站URL

    使用CSS在评论中禁用网站URL

    上述选项很容易做到,尽管它可能不适用于所有 WordPress 主题。由于主题可以使用自定义CSS来修改默认的WordPress评论表单,因此在使用上述方法之前,您必须检查主题的CSS。此外,您所有的旧评论仍将具有与作者姓名链接的网站URL。因此,从评论中删除作者链接的下一个选项是在主题的functions.php文件中使用一个函数。

    您可以转到“外观 > 主题编辑器”部分并为您的活动主题找到“functions.php”文件。将以下代码粘贴到文件末尾,然后单击“更新文件”按钮。

    /* Remove Comment Author Link */
    add_filter( ‘get_comment_author_link’, ‘remove_comment_author_link’, 10, 3 );
    function remove_comment_author_link( $return, $author, $comment_ID ) {
    return $author;
    }
    /* Remove Comment Author Link */
    add_filter( ‘get_comment_author_link’, ‘remove_comment_author_link’, 10, 3 );
    function remove_comment_author_link( $return, $author, $comment_ID ) {
    return $author;
    }
    /* Remove Comment Author Link */
    add_filter( 'get_comment_author_link', 'remove_comment_author_link', 10, 3 );
    function remove_comment_author_link( $return, $author, $comment_ID ) {
                return $author;
    }

    它在您的文件中应如下所示:

    添加删除评论作者链接的函数

    添加删除评论作者链接的函数

    如果您使用缓存插件,请确保清除缓存并检查您的评论表单。不要对评论表单上仍然存在网站URL字段感到惊讶。该代码的作用是删除已发布评论上评论作者姓名和网站URL之间的超链接。因此,您无需再担心评论表单中的网站URL字段。当您批准评论时,它将根本不使用。此函数还将从您网站上已发布的所有现有评论中删除评论作者链接。

    评论作者链接已删除

    评论作者链接已删除

    请记住,不建议编辑主题的functions.php,因为当您更新主题时更改将被清除。您可以为此目的使用子主题或使用代码片段插件将上述代码添加为独立片段。

    3. 使用功能删除WordPress评论表单中的网站URL

    您可以在主题的functions.php中插入以下代码,而不是上述函数。此功能将完全删除WordPress评论表单中提交的网站URL。但是,所有现有链接都将保留而不会产生任何影响。

    /* Remove Website URL in Comments */
    add_filter(‘comment_form’, ‘remove_url_field’);
    function remove_url_field($fields){
    if(isset($fields[‘url’]))
    unset($fields[‘url’]);
    return $fields;
    }
    /* Remove Website URL in Comments */
    add_filter(‘comment_form’, ‘remove_url_field’);
    function remove_url_field($fields){
    if(isset($fields[‘url’]))
    unset($fields[‘url’]);
    return $fields;
    }
    /* Remove Website URL in Comments */
    add_filter('comment_form', 'remove_url_field');
    function remove_url_field($fields){
    if(isset($fields['url']))
    unset($fields['url']);
    return $fields;
    }

    在您的评论表单中,它将如下所示。

    评论表单中的网站URL已删除

    评论表单中的网站URL已删除

    这是一种超级简单且免费的方法。转到WordPress管理面板中的“插件 > 安装插件”部分并安装“Hide Comment Author Link”插件。

    安装Hide Comment Author Link插件

    安装Hide Comment Author Link插件

    该插件没有任何设置页面,激活后将禁用已发布评论中的评论作者链接。请记住,此插件与上述方法3中解释的添加函数的工作相同。因此,您仍然会看到网站URL链接,用户可以在评论中留下他们网站的URL。但是,已发布评论中的评论作者姓名将不提供URL。

    5. 使用高级插件禁用评论URL

    下一个选项是为此目的使用高级性能优化插件。您可以使用终极性能优化插件,而不是为此使用专用插件。此插件的单站点许可证费用为24.95美元,可帮助您从WordPress安装中禁用不必要的项目。您只需单击几下即可禁用WooCommerce样式/JS、提要、XML-RPC和许多其他项目。

    此外,上述两种方法(添加功能和免费插件)是不可取的,因为它们会将评论者与表单上可用但在已发布评论中删除的网站URL混淆。因此,我们建议为此使用Perfmatters高级插件

    • 激活插件后,转到“设置 > 性能”菜单。
    • 导航到“选项 > 常规”部分。
    • 向下滚动并启用“删除评论URL”选项。
    • 单击“保存更改”按钮以在您的站点上应用更改。

    使用Perfmatters删除评论URL

    使用Perfmatters删除评论URL

    此插件将从您的评论表单中删除网站URL字段,并从所有现有评论中删除评论作者链接。

    6. 从主题设置中禁用网站URL

    有些主题允许您禁用在WordPress评论表单中提交的评论和网站URL。例如,您可以使用流行的Kadence主题轻松完成此操作,只需单击定制器设置。在尝试上述任何选项之前,请检查您的主题是否提供此类功能。

    删除Kadence主题中的评论网站字段

    删除Kadence主题中的评论网站字段

    小结

    评论形式的网站URL是WordPress网站中最大的垃圾邮件来源。但是,您没有任何默认选项来禁用评论作者链接或删除WordPress评论表单中的网站URL。您可以使用上述任何一种在您的网站上运行良好的方法。在测试了所有这些方法之后,我们建议使用Perfmatters,因为它可以通过许多其他优化来提高您网站的性能。尽管删除ReURL可以减少人工垃圾邮件,但您仍可能收到来自自动机器人的评论。在这种情况下,请使用安全插件来阻止机器人访问或在评论表单中添加验证码保护。

  • 前端CDNJS库及Google Fonts、Ajax和Gravatar国内加速服务

    前端CDNJS库及Google Fonts、Ajax和Gravatar国内加速服务

    由于某些众所周知的原因,好多开源的JS库采用的国外CDN托管方式在国内访问速度不如人意。所以u.sb特意制作了这个公益项目,托管了CDNJS的所有开源JS库以及反代了Google Fonts、Ajax和Gravatar。

    1、CDNJS开源JS库

    我们采用的方法是每天定时同步CDNJS的Github

    所有的JS/CSS库可以在这儿找到您需要的链接

    https://cdnjs.loli.net/ajax/libs/

    如果您使用cdnjs.com只需要替换 cdnjs.cloudflare.com 为 cdnjs.loli.net 即可,如

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    

    替换成

    <script src="https://cdnjs.loli.net/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    

    CDNJS的API开发文档请摸这里

    2、Google Fonts

    我们采用的方法是万能的Nginx反代 + 关键词替换

    使用的时候,您只需要替换 fonts.googleapis.com 为 fonts.loli.net 即可,如

    <link href="https://fonts.googleapis.com/css?family=Open+Sans">
    

    替换成

    <link href='https://fonts.loli.net/css?family=Open+Sans' rel='stylesheet'>
    

    如果需要Material icons ,把

    <link href="https://fonts.googleapis.com/icon?family=Material+Icons">
    

    替换成

    <link href="https://fonts.loli.net/icon?family=Material+Icons">
    

    如果需要Early Access,把

    @import url(https://fonts.googleapis.com/earlyaccess/notosanskannada.css);
    

    替换成

    @import url(https://fonts.loli.net/earlyaccess/notosanskannada.css);
    

    如果需要下载单个字体,您只需要把 fonts.gstatic.com 替换成 gstatic.loli.net 或 themes.googleusercontent.com 替换成 themes.loli.net 即可

    比如

    https://fonts.gstatic.com/s/opensans/v14/K88pR3goAWT7BTt32Z01mxJtnKITppOI_IvcXXDNrsc.woff2
    

    替换成

    https://gstatic.loli.net/s/opensans/v14/K88pR3goAWT7BTt32Z01mxJtnKITppOI_IvcXXDNrsc.woff2
    

    或者

    https://themes.googleusercontent.com/static/fonts/anonymouspro/v3/Zhfjj_gat3waL4JSju74E-V_5zh5b-_HiooIRUBwn1A.ttf
    

    替换成

    https://themes.loli.net/static/fonts/anonymouspro/v3/Zhfjj_gat3waL4JSju74E-V_5zh5b-_HiooIRUBwn1A.ttf
    

    Google Fonts的API文档请摸这里

    3、Google前端公共库

    方法同上,直接替换 ajax.googleapis.com 为 ajax.loli.net 即可,如

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    

    替换成

    <script type="text/javascript" src="https://ajax.loli.net/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    

    Google前端库API开发文档摸这儿

    4、Gravatar头像

    方法还是同上,直接替换 *.gravatar.com 为 gravatar.loli.net 即可,如

    https://secure.gravatar.com/avatar/8406d089bc81b664a2610b8d214c1428
    

    替换成

    https://gravatar.loli.net/avatar/8406d089bc81b664a2610b8d214c1428
    

    5、赞助商

    国内外CDN, GeoDNS、域名、SSL证书等基础服务均由Riven Cloud赞助

    6、加速域名列表

    所有国内加速服务的域名列表如下,您只需要修改程序里的原域名即可

    原域名 加速域名 制作方法
    cdnjs.cloudflare.com cdnjs.loli.net 每日同步 Github
    ajax.googleapis.com ajax.loli.net Nginx 反代
    fonts.googleapis.com fonts.loli.net Nginx 反代
    fonts.gstatic.com gstatic.loli.net Nginx 反代
    themes.googleusercontent.com themes.loli.net Nginx 反代
    secure.gravatar.com gravatar.loli.net Nginx 反代

    注意: 个别国内的网络环境可能无法使用本服务,这也暂时没有办法解决这个问题,请自行检查或更换运营商。

    via u.sb

  • 什么是WordPress自动保存及如何更改保存间隔和禁用

    什么是WordPress自动保存及如何更改保存间隔和禁用

    WordPress Autosave是我最喜欢的功能之一,它让我们在编辑我们许多网站上的文章或页面时高枕无忧。

    如果您使用过其他没有自动保存功能的CMS,您可能会经历过那个可怕的时刻,当您按下“保存”时,您的登录超时,您将失去一切。

    WordPress自动保存可以防止这样的悲惨故事,这种故事一次又一次地发生在很多人身上。

    默认情况下,WP会在您更新内容后每60秒自动保存您的文章、页面或自定义文章类型。

    这可以非常方便地保留未保存内容的副本,否则您可能由于不同的原因而丢失,例如过期的cookie、浏览器崩溃、互联网连接丢失、无意导航、WP核心或插件错误/崩溃等。

    除了自动将内容保存到数据库之外,从最近的WP版本开始,该功能现在还利用浏览器的本地存储功能来防止在您意外快速离线(例如突然断电)时丢失您的内容。

    虽然WordPress自动保存功能可以成为那些经常在WP管理员中编辑内容的人的救命稻草,但由用户决定是否需要启用该功能。好消息是您可以根据自己的喜好禁用该功能或​​自定义保存间隔。在我们设计的网络博客上,我们倾向于保持原样或缩短一点。

    在这篇文章中,让我们详细了解一下自动保存功能。

    什么是WordPress自动保存

    当您撰写或编辑内容时,您对文章所做的更改将每60秒自动保存一次。

    当文章更新或自动保存时,它将在您的文章编辑器的右下角被视为通知。

    请参阅下面的屏幕截图。

    文章自动保存时间戳

    自动保存后,如果您的文章被更新,下一次保存将覆盖旧的。这意味着您的表格每60秒不会增长超过一次。每个文章只存储一个(最新的)自动保存。

    这与您按下更新按钮时完全不同,每次都会创建一个新的WordPress文章“修订”。

    现在您可能已经注意到这一点 – 当您尝试关闭浏览器选项卡而不保存您的文章时,您会看到一个警告弹出,通知您文章未保存。

    文章自动保存弹窗提示

    使用自动保存的好处是,即使您在未保存的情况下离开选项卡,下次登录时您在文章编辑器中看到的第一件事就是文章的自动保存版本。

    最好的是,这些自动保存不会覆盖您发布的文章或保存的修订。因此,您可以在下次登录时轻松开始编辑自动保存的文章。

    在浏览器上临时保存WordPress文章

    除了将您的内容保存在数据库中之外,如果您离线,WP现在还利用浏览器的本地存储功能。当您在线返回时,它会通知您是否发现任何差异。

    本地临时保存文章

    此功能使您能够准确地从离开的位置继续书写。

    自动保存使WordPress成为更好的内容编辑工具

    虽然WP无疑是目前最好的CMS,但它仍然缺乏MS Word和Google文档的许多内容编写、内容编辑和协作功能。

    由于这个事实,仍然有许多博主更喜欢离线创建文章或使用Google文档进行协作编辑。此类用户仅在文章完成编写后才使用WP管理员。

    这为网站的编辑和作者创造了更多的工作 – 将内容从文档迁移到您的后端需要大量时间,因为大部分格式都会在此过程中丢失。

    但是,这种增强的WordPress自动保存功能使该CMS向前迈进了一步,成为更可靠的内容编辑工具。

    如果您仍在使用第三方应用程序进行内容创建和协作,除了此功能之外,以下是WordPress管理员可能是您最佳选择的几个原因。

    WordPress文章修订

    WordPress文章修订允许您比较已保存文章的不同版本。如果您需要查看文章的以前版本(也许如果您错误地进行了更改),这可以成为救命稻草。截至目前,没有其他离线文字处理器提供这一惊人的功能。

    文章其他人编辑提醒

    锁定文章编辑

    自3.6版本以来,WordPress发布了一个名为post lock的新编辑控制功能。这允许文章作者锁定文章,直到完成编辑。对于多作者博客来说,这可能是一个有用的功能,其中作者协作为每篇文章做出贡献。

    更好的语法检查器

    尽管WordPress提供了大量的文章编辑器功能,但它仍然落后于MS Word等可靠的语法检查工具。如果这就是您仍然使用离线文字处理应用程序的原因,您需要做的就是安装Grammarly浏览器插件。

    文章语法检测

    Grammarly是一款免费的在线语法检查器,在校对和语法检查方面比MS Word好得多。

    毫无疑问,所有这些功能将使WordPress成为可靠的内容创建和编辑工具。

    如何更改自动保存间隔

    现在我们已经了解了WordPress自动保存功能的各种好处,让我们看看如何根据您的喜好更改保存间隔。

    例如,如果您使用慢速互联网连接来写博客,您可能需要增加自动保存间隔,以确保您的浏览器不会在WordPress每分钟强制保存时频繁挂起。

    或者,如果您想尽量减少因操作系统崩溃或断电而丢失内容的可能性,您可能需要缩短时间间隔,以便更频繁地保存内容。

    更改WordPress自动保存设置只需进行一些调整。

    如果您想更改自动保存间隔,只需找到您网站的wp-config.php文件,在其上插入以下代码片段并保存即可。

    define(‘AUTOSAVE_INTERVAL’, 120 );
    define(‘AUTOSAVE_INTERVAL’, 120 );
    define('AUTOSAVE_INTERVAL', 120 );

    上面的代码将自动保存间隔更改为120秒。在保存之前,请根据您的喜好随意编辑上述代码中的数字(以秒为单位)。

    请务必在wp-config.php文件中的以下代码行之前添加上述代码片段,否则设置将不起作用。

    require_once(ABSPATH . ‘wp-settings.php’);
    require_once(ABSPATH . ‘wp-settings.php’);
    require_once(ABSPATH . 'wp-settings.php');

    如何禁用自动保存功能

    WP的美妙之处在于您可以轻松自定义或禁用它提供的几乎所有功能。

    在极少数情况下,如果您不想为您的网站使用自动保存功能,您可以按照以下指南轻松禁用它。

    在本节中,您会发现使用两种方法禁用自动保存——编辑wp-config.php文件和编辑functions.php文件。

    您可以使用以下任何一种方法来禁用WordPress自动保存功能。

    编辑wp-config.php文件以禁用WordPress自动保存

    编辑wp-config.php文件可能是禁用WordPress自动保存的最简单方法。

    尽管您可以通过禁用WP_POST_REVISIONS来禁用它,但这种方法的问题在于它也会禁用后期修订。

    所以正确的方法是增加wp-config.php文件中的自动保存间隔,这样它就永远不会自动保存任何东西。

    define(‘AUTOSAVE_INTERVAL’, 86400);
    define(‘AUTOSAVE_INTERVAL’, 86400);
    define('AUTOSAVE_INTERVAL', 86400);

    上面的代码片段确保你的文章会在 86400 秒后被保存;那是一天之后。

    通过编辑functions.php文件禁用WordPress自动保存

    但真的,真的,你为什么要禁用它啊?

    禁用此功能的最聪明的方法是在您的functions.php文件中添加几行代码 – 这就是您的WordPress的动作钩子。添加代码后,您可以保存文件。

    add_action( ‘admin_init’, ‘disable_autosave’ );
    function disable_autosave() {
    wp_deregister_script( ‘autosave’ );
    }
    add_action( ‘admin_init’, ‘disable_autosave’ );

    function disable_autosave() {

    wp_deregister_script( ‘autosave’ );

    }

    add_action( 'admin_init', 'disable_autosave' );
    
    function disable_autosave() {
    
        wp_deregister_script( 'autosave' );
    
    }

    它的作用是简单地取消注册自动保存脚本,您可以在wp-admin/post.php文件和wp-admin/post-new.php文件中找到该脚本。

    常见问题

    什么是WordPress自动保存?

    WordPress自动保存是WordPress编辑器的一项功能,它会定期自动保存编辑器的内容,这样您就不必手动按下更新按钮。

    如何在WordPress中关闭自动保存?

    要在WordPress中关闭自动保存,您需要对WordPress的functions.php文件进行小幅调整。添加以下代码并保存,您的自动保存将被禁用:

    add_action( ‘admin_init’, ‘disable_autosave’ );
    function disable_autosave() {
    wp_deregister_script( ‘autosave’ );
    }
    add_action( ‘admin_init’, ‘disable_autosave’ );

    function disable_autosave() {
    wp_deregister_script( ‘autosave’ );
    }

    add_action( 'admin_init', 'disable_autosave' ); 
    
    function disable_autosave() {
     wp_deregister_script( 'autosave' ); 
    }

    如何返回到以前版本的WordPress?

    如果您想返回WordPress中文章的先前版本,请找到修订链接,单击浏览并单击恢复此修订以将当前版本替换为文章的先前版本之一。

    我在哪里可以找到WordPress的修订版?

    您可以在“发布”选项卡中屏幕右侧的WordPress中找到修订。如果您没有看到 Revisions 选项,请单击右上角的Screen Options并启用Revisions复选框

    如何在WordPress上保存更改?

    要在WordPress上保存更改,请单击“发布”选项卡中的“更新”按钮。请注意,WordPress还会按照此处描述的autosave_interval设置的定义定期自动保存编辑器的内容。

  • 什么是WordPress Heartbeat API以及如何管理它

    什么是WordPress Heartbeat API以及如何管理它插图

    2013年,WordPress引入了Heartbeat API——一种允许您的浏览器自动与服务器通信的功能。但是,此功能有几个缺点。

    如果您使用共享主机计划,则需要仔细查看服务器的CPU使用率。那是因为当您超出限制时,一些托管公司可能会暂停您的帐户。

    在这里,我们将讨论为什么WordPress Heartbeat API是导致问题的常见嫌疑人,及如何禁用和修改Heartbeat API频率。

    什么是WordPress Heartbeat API?

    WordPress Heartbeat API在浏览器和服务器之间提供了一种使用AJAX调用的通信协议

    顾名思义,API将在接收到数据时发送连续脉冲并触发事件(或回调)。此功能可帮助您在服务器和WordPress仪表盘之间同步所有数据。

    Heartbeat API背后的想法非常引人注目。例如,当您从编辑器创建/编辑文章时,它提供了定期自动保存文章的功能。

    在协作WordPress网站中,它具有后锁定功能,以防止您编辑其他用户正在处理的文章。如果您使用电子商务插件,此API还将有助于显示您网站上发生的销售情况。

    为什么要限制WordPress Heartbeat API?

    虽然具有自动保存功能和实时数据通知功能是有益的,但在特定情况下可能是有害的。

    Heartbeat API使用/wp-admin/admin-ajax.php文件发送AJAX请求(POST 请求) 。每个执行PHP文件的请求都等于服务器上的CPU时间。

    这可能会导致向托管服务器发送大量请求,从而导致CPU使用率过高。

    正如我们之前提到的,对于具有共享托管计划的网站管理员来说,这可能是一个问题。当您达到配额限制时,高CPU使用率最终会导致帐户暂停。

    因此,如果您遇到的问题会导致POST-admin-ajax.php出现峰值,这里有一个教程可以帮助您解决这个问题

    停止Heartbeat API之前需要考虑的事项

    如果您打算完全停止Heartbeat API,则需要三思而后行。不是因为你做不到,而是不实用。

    如果没有WordPress Heartbeat API,如果您忘记单击“保存草稿”按钮,您在文章中所做的所有更改都将丢失。您将无法再访问WordPress中的修订功能

    如果您安装使用Heartbeat API的WordPress插件,您也无法在您的站点上显示实时通知和信息功能。

    但是,如果您是一个人工作,并且所有这些功能对您来说并不重要,那么您可以继续停止WordPress Heartbeat API。

    否则,您可能会考虑改为控制API。

    如何使用插件限制WordPress Heartbeat API?

    您可以使用Heartbeat Control插件控制Heartbeat API向您的服务器发送回调的频率。

    安装并激活插件后,转到Settings -> Heartbeat Control Settings。在这里,您可以为API设置一定的规则。

    • Heartbeat Behavior– 允许您启用心跳禁用心跳修改心跳
    • Location– 确定您要控制API的区域,它为您提供三个选项:WordPress仪表盘前端文章编辑器
    • Frequency– 您允许每个确定位置的回调次数。取值范围为15到300秒

    什么是WordPress Heartbeat API以及如何管理它-1

    在示例中,我们将Post Editor中Heartbeat API函数的频率限制为200秒。如果您有多个作者在同一个WordPress网站上工作,这是一种更实用的方法。

    您还可以在您希望控制的每个位置设置不同的值。只需单击添加另一个值按钮,并相应地进行调整。

    该插件还允许您完全禁用WordPress Heartbeat API。您可以通过为Heartbeat Behavior选择Disable Heartbeat来做到这一点。

    如何在没有插件的情况下完全停止Heartbeat API?

    您也可以在没有插件的情况下停止Heartbeat API,方法是将此代码段添加到您的活动主题functions.php文件中。

    add_action( ‘init’, ‘stop_heartbeat’, 1 );
    function stop_heartbeat() {
    wp_deregister_script(‘heartbeat’);
    }
    add_action( ‘init’, ‘stop_heartbeat’, 1 );
    function stop_heartbeat() {
    wp_deregister_script(‘heartbeat’);
    }
    add_action( 'init', 'stop_heartbeat', 1 );
    function stop_heartbeat() {
    wp_deregister_script('heartbeat');
    }

    请记住,如果您是网站的唯一工作人员并且您不需要安装使用此API的其他插件,则应该这样做。

    什么是WordPress Heartbeat API以及如何管理它-2

    从您的WordPress仪表板,转到Appearance -> Theme Editor。确保您正在编辑网站的活动主题。从右侧导航菜单中单击主题函数 (functions.php) 。将上面的代码片段粘贴在<?php标记之后,然后单击Update

    就是这样,现在您已经成功地在您的站点上禁用了WordPress Heartbeat API。

    小结

    您已经了解了WordPress Heartbeat API及其为您的站点提供的功能。尽管这无疑是有益的,但在共享托管环境中,如果您处理不当,它可能会导致相当大的问题。

    要减少服务器上的CPU使用率,您可以控制API或完全禁用它。此外,您可以使用插件或手动将代码添加到functions.php文件中。

  • 如何在WordPress网站中禁用谷歌字体?

    如何在WordPress网站中禁用谷歌字体?

    使用商业主题时,WordPress网站看起来很漂亮。这些高级主题使用缩略图和好看的字体来制作吸引人的外观。然而,酷炫的外观伴随着您作为网站所有者需要承担的一定成本。在本文中,让我们探讨字体问题以及如何在WordPress站点中禁用Google字体。

    在WordPress中使用字体

    以下是在WordPress中使用字体的流行方式,您可以随时切换使用字体的方式。

    • 使用第三方字体,如Google Fonts
    • 在您的服务器上托管自定义字体
    • 使用系统字体

    无论您使用什么方式;您需要以下三件事才能使用任何字体系列:

    • 具有不同扩展名的字体文件,如woff、eot、ttf或svg。虽然主要使用一个文件,但其余文件用于后备和兼容性目的。或者,您可以使用CSS字体文件,尤其是从Google字体网站加载时。
    • 将字体从文件导入到您的站点。CSS字体导入在早期很流行,现在在标题部分链接外部字体文件很常见。
    • 在HTML元素中使用CSS规则来提及字体系列和其他属性。

    这是一个使用外部文件链接的示例CSS,用于在标题部分使用具有常规400粗的Roboto系列。

    <link href=“https://fonts.googleapis.com”>
    <link href=“https://fonts.gstatic.com” crossorigin>
    <link href=“https://fonts.googleapis.com/css2?family=Roboto&display=swap”>
    <link href=”https://fonts.googleapis.com”>
    <link href=”https://fonts.gstatic.com” crossorigin>
    <link href=”https://fonts.googleapis.com/css2?family=Roboto&display=swap”>
    <link href="https://fonts.googleapis.com">
    <link href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap">

    以下是如何在HTML中使用带有H1标题的Roboto字体系列:

    h1 {
    font-family: ‘Roboto’, sans-serif;
    }
    h1 {
    font-family: ‘Roboto’, sans-serif;
    }
    h1 {
    font-family: 'Roboto', sans-serif;
    }
    

    据说页面上的每个HTML元素都需要一个字体系列来呈现它在浏览器上的预期显示方式。

    WordPress中的谷歌字体

    通常为HTML body元素声明字体系列,以便整个页面使用相同的字体。然而,那些好看的主题需要对标题、块引用、预格式化、表格、按钮等元素使用不同的字体系列。为了避免设计多种字体或支付许可费用,许多WordPress主题和插件开发人员使用免费的第三方 -派对字体。谷歌字体的使用与谷歌的流行和CDN的能力一起提供了更接近您网站访问者的字体文件。

    谷歌字体

    谷歌字体

    10个商业WordPress主题中几乎有7个使用Google字体并提供自定义主题面板。您可以从1250多种可用字体系列中选择一种。由于有大量的字体可供免费使用,开发人员可以简单地将所需的Google字体文件与标题部分中的系列和重量详细信息联系起来。您可以通过查看您网站的源代码来查看您网站上的Google字体文件。

    源代码中的Google字体CSS文件

    源代码中的Google字体CSS文件

    您可以看到字体是从fonts.googleapis.com服务器加载的。Open Sans和Roboto是字体系列,400/600表示字体粗细。有时您可能还会看到字体是从诸如fonts.gstatic.com之类的Google域加载的。

    使用多种和外部字体的问题

    在WordPress中使用Google字体会产生以下问题:

    • 任何第三方资源都会影响您网站的页面加载速度。示例包括Google字体、分析跟踪、Facebook像素等。
    • 使用多个字体系列和字体粗细会增加 Google 服务器所需的外部文件数量。这将增加从您的站点发送的 HTTP 请求的数量,从而降低页面加载速度。
    • 在从Google服务器下载所有字体文件之前,浏览器不会加载文本。这可能需要一些时间,在此期间用户将看到空白的空白页面。您将在Google PageSpeed Insights工具中看到警告,以确保在网络字体加载期间文本可见。
    • 您可能需要使用预连接和DNS预取来连接到Google字体域,以加快网站的加载速度。

    由于速度是Google搜索中的官方排名因素之一,因此您没有其他选择可以避免使用第三方Google字体。

    如何在WordPress中禁用谷歌字体?

    现在很明显,您必须在WordPress中禁用Google字体以提高页面加载速度。但问题是当您的主题和插件使用Google字体时,如何在影响或不影响网站外观的情况下做到这一点。以下是可供您选择的选项。

    • 完全禁用Google字体,以便您的网站使用浏览器的备用字体。
    • 将swap参数添加到Google字体文件并继续使用它们。
    • 通过添加自定义CSS或更改主题来使用系统字体。

    我们将在以下部分探讨所有这些选项。

    #1 – 完全禁用WordPress中的Google字体

    随着Google字体成为速度问题,几乎所有缓存和速度优化插件都提供了从您的网站合并或删除Google字体的功能。我们推荐的最佳选择是使用Perfmatters插件,该插件还附带一套完整的选项来消除腹胀。例如,如果您使用WooCommerce插件,您只需点击几下即可禁用文章和页面上的WooCommerce样式和脚本。

    • 在您的网站上购买并安装Perfmatters插件
    • 转到“设置 > Perfmatters”菜单。
    • 导航到“Fonts”部分下的“Options”选项卡。
    • 启用针对“Disable Google Fonts”选项的按钮。
    • 单击“保存更改”按钮以应用更改。

    在Perfmatters插件中禁用Google字体

    在Perfmatters插件中禁用Google字体

    如果您不想使用付费插件,请转到仪表板中的“插件 > 安装插件”部分并安装“Disable and Remove Google Fonts”插件。这是一个免费且专用的插件,它只做一项工作即可完全摆脱您网站上的Google字体。

    Disable and Remove Google Fonts插件

    Disable and Remove Google Fonts插件

    令人惊讶的是该插件没有任何烦人的设置页面。您所需要的只是在您的站点上安装并激活它。

    其他免费选项包括Auto optimize,它与缓存选项一起很有用。如果您在SiteGround主机上,请使用SG Optimizer插件来组合所有Google字体以减少HTTP请求的数量。

    #2 – 设置谷歌字体Swap显示

    如上所述,不使用谷歌字体的主要原因之一是它会延迟文本内容的加载。要处理这个问题,您可以使用如下CSS属性:

    对于使用外部字体文件:

    <link href=”https://fonts.gstatic.com” crossorigin>
    <link href=”https://fonts.googleapis.com/css2?family=Roboto&display=swap”>
    <link href=”https://fonts.gstatic.com” crossorigin>
    <link href=”https://fonts.googleapis.com/css2?family=Roboto&display=swap”>
    <link href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap">
    

    与CSS @import一起使用:

    <style>
    @import url(‘https://fonts.googleapis.com/css2?family=Roboto&display=swap’);
    </style>
    <style>
    @import url(‘https://fonts.googleapis.com/css2?family=Roboto&display=swap’);
    </style>
    <style>
    @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
    </style>
    

    最近,Google推出了对CSS font-display:swap属性与Google Fonts的支持。这实质上意味着您可以指示浏览器首先使用默认浏览器的字体,直到Google字体文件可用。当浏览器完成下载谷歌字体文件时,它会交换显示并使用谷歌字体。这样,查看文本内容不会有延迟。这将帮助您解决问题,例如确保在Google PageSpeed Insights工具中加载网络字体期间文本保持可见。

    为了实现字体交换,您可以使用Swap Google Fonts Display插件。该插件也没有任何设置,您只需在您的站点上激活插件即可在所有Google字体文件中添加display=swap值。

    Swap Google Fonts Display插件

    Swap Google Fonts Display插件

    #3 – 使用系统字体

    最近,许多WordPress主题都提供了使用系统字体堆栈和Google字体的选项。例如,您可以为此目的使用流行的轻量级主题(如GeneratePress )。您只需在定制器设置中选择系统字体选项即可。

    在GeneratePress主题中使用系统字体堆栈

    在GeneratePress主题中使用系统字体堆栈

    如果您想在站点中手动使用系统字体,只需在“外观 > 自定义 > 添加CSS”部分下添加以下CSS。此CSS仅适用于body元素,如果需要,您可能需要在声明中添加其他元素。此外,您必须手动删除其他CSS导入或文件链接,以避免同时加载这些字体文件。

    body {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, “Segoe UI”, Helvetica, Arial, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”, “Segoe UI Symbol”;
    }
    body {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, “Segoe UI”, Helvetica, Arial, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”, “Segoe UI Symbol”;
    }
    body {
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    }

    虽然这是一个简单的选项,但在使用系统字体时,您不会在所有设备中都有固定的字体显示。

    小结

    无论您使用哪种方法,请确保测试该站点的源代码中不包含任何Google字体文件。如果您使用交换选项,请检查字体CSS文件是否包含display=swap属性。此外,使用Google PageSpeed Insights工具测试您的网站,以确保没有与字体相关的警告。