分类: WordPress优化

  • 如何在WP Rocket插件中使用安全模式?

    wp rocket

    顾名思义,安全模式表示有助于在不完全禁用功能的情况下解决问题。例如,您可以在PC中以安全模式打开Word和Excel文档,通过禁用扩展程序和其他不必要的功能来打开应用程序。现在越来越流行,像WP Rocket这样的WordPress插件也提供安全模式。

    在本文中,我们将解释如何在WP Rocket中启用安全模式以及如果这样做会发生什么。

    排查WP Rocket问题

    作为一个强大的缓存插件,WP Rocket可能会破坏您的网站布局或禁用某些功能。当您启用合并JavaScript、删除未使用的CSS等设置时会发生这种情况。每当您想确认问题是由于WP Rocket缓存引起的,您可以轻松绕过WP Rocket缓存来检查您网站上未缓存的页面。好的部分是您可以在不停用插件的情况下执行此操作。

    WP Rocket官网

    但是,确认问题后,唯一的选择是停用插件或逐一禁用功能以缩小问题范围。为了使此故障排除更容易并最大程度地减少工作,WP Rocket引入了一项称为安全模式的新功能。使用此功能,您可以在不停用插件的情况下禁用整个站点上的某些功能。

    在WP Rocket中启用安全模式

    • 当您遇到问题时,请转到仪表盘中的“插件 > 已安装插件”部分。
    • 找到WP Rocket插件,然后点击插件名称下方的“停用”链接。

    停用WP Rocket插件

    停用WP Rocket插件

    • 如果您使用的是3.11.0.3之前的版本,您将看到如下消息。

    旧插件版本中的消息

    旧插件版本中的消息

    • 这意味着您必须首先将插件更新到3.11.1或更高版本。之后,您将在停用时看到以下消息。
    • 现在,选择“Yes, apply Safe Mode”选项,然后单击“Confirm”按钮。
    • 您已在WP Rocket 插件中启用安全模式并继续检查问题是否已解决。

    WP Rocket中的安全模式选项

    WP Rocket中的安全模式选项

    安全模式会发生什么?

    确认安全模式选项时,WP Rocket将禁用以下功能。

    • 在“Media > Lazy Load”下的图片、iframe和视频的延迟加载选项将禁用。
    • 所有CSS和JavaScript优化,如“File Optimizations”下的最小化、合并、关键CSS生成删除未使用的CSS、延迟JS会被禁用。
    • 在“CDN”下“Enable Content Delivery Network”选项将禁用。

    禁用所有这些功能后,您应该能够使站点恢复工作状态。之后,您可以一一启用这些选项并检查哪个选项造成了问题。

    如何禁用安全模式?

    这一点很重要,因为WP Rocket不提供任何禁用安全模式的选项。由于它只是禁用一组选项,因此您需要重新启用这些设置以禁用安全模式。这意味着您应该在使用安全模式之前记住之前的设置。否则,您可能会对您之前是否使用过某个功能感到困惑。在这种情况下,我们不建议使用安全模式,除非您知道自己的设置或使用WP Rocket进行了登台/本地主机设置。

    小结

    在完全停用插件之前,您可以轻松地在WP Rocket中启用安全模式。它可以帮助您在不丢失缓存功能的情况下恢复您的站点。但是,您必须逐个启用这些功能才能恢复以前的手动设置。

  • 如何使用WP Rocket插件正确设置Cloudflare?

    如何使用WP Rocket插件正确设置Cloudflare?

    WP Rocket是WordPress网站最简单有效的缓存插件之一。它提供一键式功能,用于删除未使用的CSS延迟JavaScript和优化缓存以加速您的网站。另一方面,Cloudflare是一项免费的CDN服务,可从最近的位置向用户访问者提供内容。将WP Rocket缓存的强大功能与Cloudflare CDN相结合以提高您网站的性能是一个好主意。

    Rocket CDN与Cloudflare

    WP Rocket还提供自己的RocketCDN,您可以将CDN部分集成到WP Rocket设置中。RocketCDN来自StackPath,您每月需要7.99美元才能开始使用这项仅限高级服务。要使用RocketCDN,您需要通过在您的DNS区域中设置CNAME来创建CDN重定向,并在CDN设置页面添加CNAME。但是,Cloudflare是一个免费的CDN,您无需创建CNAME记录即可在WordPress中使用Cloudflare。

    来自WP Rocket的RocketCDN

    来自WP Rocket的RocketCDN

    您需要更改指向Cloudflare服务器的域的名称服务器,并通过它们路由整个流量。这有助于保护您的网站并改善向用户的内容交付。要将Cloudflare与WP Rocket一起使用,您需要启用附加组件且无需使用CDN部分。

    WP Rocket Cloudflare附加组件

    要将WP Rocket与Cloudflare一起使用,您必须启用默认情况下随WP Rocket插件提供的附加组件。将Cloudflare CDN与WP Rocket一起使用时,不必使用该插件。但是,该插件有助于优化您的Cloudflare帐户中的设置,以便通过缓存正确使用CDN设置。

    启用Cloudflare插件

    登录到您的WordPress管理面板并导航到“Setting > WP Rocket”部分。导航到“附加组件”菜单并向下滚动到“Rocket Add-ons”部分。此时,WP Rocket提供了两个附加组件——Cloudflare和Sucuri。默认情况下,所有加载项状态都设置为关闭。通过单击“Add-ons status”按钮打开Cloudflare加载项,如下所示。

    WP Rocket插件中的Cloudflare插件

    WP Rocket插件中的Cloudflare插件

    使用WP Rocket设置Cloudflare

    启用插件后,单击“Modify Options”按钮查看配置设置。有三个部分可用于优化Cloudflare的设置。

    • Cloudflare凭据
    • Cloudflare设置
    • Cloudflare缓存

    相关文章:

    Cloudflare凭证

    要将WP Rocket与Cloudflare一起使用,您需要允许插件访问您的Cloudflare帐户。这可以通过添加Cloudflare全局API密钥、区域ID以及您的登录电子邮件地址来完成。

    连接Cloudflare和WP Rocket

    连接Cloudflare和WP Rocket

    转到您的Cloudflare帐户并选择您的站点以查看仪表盘。您将登陆“Overview”部分并向下滚动以查看“API”部分(这将显示在右侧边栏上)。您可以在此处找到Zone ID,将其复制并粘贴到您的WP Rocket Zone ID文本框中。之后单击显示在您的帐户ID下方的“Get your API token”链接。

    获取Cloudflare区域ID

    获取Cloudflare区域ID

    这将带您进入帐户资料中的“API Tokens”部分。您可以在“API Keys”部分看到“Global API Key”和“Origin CA Key”。单击Global API Key选项的“View”按钮。

    在Cloudflare中获取Global API Key

    在Cloudflare中获取Global API Key

    您需要输入您的Cloudflare帐户密码才能查看Global API Key。因此,输入您的密码,然后单击弹出窗口中的“View”按钮。

    输入Cloudflare密码

    输入Cloudflare密码

    现在,您将获得您的全局API密钥,您可以将其复制并粘贴到WP Rocket的“Global API Key”文本框中。

    复制全局API密钥

    复制全局API密钥

    注意:对于帐户电子邮件,请确保向您提供Cloudflare帐户电子邮件,而不是WP Rocket或WordPress管理员电子邮件地址。

    Cloudflare设置

    下一部分,您将拥有如下所示的三个选项。关闭开发者模式和相关协议选项并启用“Optimal settings”选项。

    Optimal Cloudflare设置

    Optimal Cloudflare设置

    开发模式将在您的Cloudflare帐户中打开开发模式并禁用缓存/缩小设置。您可以使用开发模式立即测试更改,而不会干扰Cloudflare缓存。否则,只需禁用此选项即可。启用最佳设置以自动打开Cloudflare中的以下功能:

    • 自动缩小 – 启用 CSS、JSS和HTML最小化选项。
    • 将浏览器缓存TTL从默认值4小时更改为1年。
    • 禁用WP Rocket功能。
    • 使缓存级别达到标准。

    Cloudflare最佳设置

    Cloudflare最佳设置

    相对协议选项会将所有静态文件(如图像)的URL更改为使用//而不是http://或https://。WP Rocket建议仅在Cloudflare中的SSL状态设置为灵活时才使用此选项。您可以在Cloudflare帐户仪表盘的“SSL/TLS > Overview”部分下查看SSL/TLS状态。

    在Cloudflare中检查SSL状态

    在Cloudflare中检查SSL状态

    如果您使用完整或严格模式,则禁用相关协议选项。

    Cloudflare缓存

    这是最终设置,只有当您想要删除Cloudflare缓存的内容时,才可以单击“CLEAR ALL Cloudflare CACHE FILES”。这与Cloudflare帐户的“Caching > Configuration”部分下的“Purge Everything”选项相同。

    从WP Rocket清除所有Cloudflare缓存

    从WP Rocket清除所有Cloudflare缓存

    完成设置后,单击“Save Changes”按钮以连接WP Rocket和Cloudflare。您将在您的Cloudflare帐户中看到更改的最佳设置摘要,并且WP Rocket将开始预加载页面。

    Cloudflare设置状态

    Cloudflare设置状态

    小结

    如您所见,WP Rocket通过附加组件简化了Cloudflare设置。您只需连接您的Cloudflare帐户并启用最佳设置即可无缝使用CDN。如果您的网站出现问题,您可以禁用该插件并直接在Cloudflare帐户中进行更改。

  • 如何实现WordPress评论延迟加载(懒加载)?

    如何实现WordPress评论延迟加载(懒加载)?

    WordPress带有默认的评论系统,您可以使用它在您的博客上进行互动讨论。您可以选择启用或禁用站点范围内的评论以及单个博客文章。当您对文章有大量评论时,用户需要滚动浏览整个评论部分才能到达页脚。

    在本文中,我们将解释如何在WordPress中延迟加载评论以仅在需要时加载它们。

    懒加载评论

    延迟加载是仅在有用户交互时才加载内容的功能。虽然WordPress用户主要使用延迟加载图像,但您也可以使用此功能进行评论。以下是您需要在WordPress网站中延迟加载评论的一些原因。

    • 评论仅在您的博客文章底部可用,因此在初始页面加载期间不需要加载它们。
    • 长长的评论列表会增加DOM元素,从而影响您网站的页面加载速度
    • 当用户不想发表评论时,评论表单可能会影响用户在您网站上的体验。
    • 冗长的评论列表会在移动设备上占据很大的空间,这是可以避免的。
    • 默认情况下,评论将显示gravatar图像,如果您从设置中禁用gravatar,大多数主题将无法正确对齐评论部分。由于gravatar图片是从第三方网站加载的,因此会影响您网站的速度。

    总之,在需要时隐藏和加载评论表单将改善页面加载时间和用户体验。由于这些是谷歌搜索算法中的排名因素,您可以通过延迟加载评论来提高排名。

    评论分页的默认选项

    WordPress 在“设置 > 讨论”部分提供了一些默认设置来管理评论。例如,您可以设置在博客文章中显示的最大评论数。当评论数量超过设置限制时,这将创建分页评论。但是,它并没有提高多少速度,因为评论表单将在初始页面加载期间加载。

    在WordPress仪表盘中启用分页评论

    在WordPress仪表盘中启用分页评论

    对于gravatar图片,您可以通过WP RocketPerfmatters等插件使用图片延迟加载功能。此外,大多数免费缓存和优化插件都提供图像延迟加载功能,您可以使用它来延迟加载gravatar图像。

    在WordPress中延迟加载评论

    懒加载评论可以解决很多速度问题,包括懒加载gravatar图片。为此,您必须使用延迟加载评论插件并选择方法。登录到您的WordPress仪表盘部分后,转到“插件 > 安装插件”区域。搜索“lazy load comments”并向下滚动以找到lazy load comments插件

    单击“立即安装”按钮,然后单击“启用”按钮开始在您的站点上使用该插件。

    安装lazy load comments插件

    安装lazy load comments插件

    自定义评论延迟加载选项

    该插件提供了一种简单的设置来决定您希望如何延迟加载评论部分。转到“设置 > 讨论”部分并向下滚动到底部。在“头像”部分上方,您可以找到“Lazy Load Comments”的新选项。

    延迟加载评论设置

    延迟加载评论设置

    单击“lazy load comments”的下拉菜单以找到三个可用选项。

    选择滚动延迟加载评论

    选择滚动延迟加载评论

    • On Scroll – 当用户到达页面上的评论部分时,延迟加载滚动评论。这是一个默认选项,类似于延迟加载图像。
    • On Click – 这将显示“Load Comments”按钮,用户可以单击它以显示评论和表单部分。
    • No Lazy Load – 这将禁用延迟加载功能,因此不要选择此选项。

    我们建议选择“On Click”选项以显示一个按钮,该按钮可以通过两种方式提供帮助。首先是只有感兴趣的用户想要留下或阅读评论才会点击按钮。其次,它可以通过隐藏评论和表单来节省空间,从而改善手机上的用户体验。选择选项后,向下滚动并单击“保存更改”按钮以在您的站点上应用设置。

    在您的网站上进行测试

    我们建议您在测试或临时站点中测试延迟加载按钮。这是因为按钮的外观取决于您主题的样式,并且大多数主题不支持正确的样式。下面是“Load Comments”按钮在默认的WordPress主题二〇二二中的外观。单击按钮时,您将看到一个旋转的加载程序,然后将出现评论部分。

    在默认WordPress主题中加载评论按钮

    在默认WordPress主题中加载评论按钮

    这是按钮在我们测试过的第三方主题之一上的外观。它只是显示为没有清晰可见性的文本。

    加载评论按钮未对齐

    加载评论按钮未对齐

    如果您的主题没有正确显示“Load Comments”按钮,您需要使用自定义CSS调整填充和边距细节。该插件使用llc_comments_button的CSS类ID来定义按钮样式。例如,下面是我们用来对齐breek主题上的按钮的CSS代码。

    #llc_comments_button {
    padding: 15px;
    margin: 100px;
    border-radius: 5px;
    font-size: 18px;
    background: rgb(255 241 118);
    }
    #llc_comments_button {
    padding: 15px;
    margin: 100px;
    border-radius: 5px;
    font-size: 18px;
    background: rgb(255 241 118);
    }
    #llc_comments_button {
    padding: 15px;
    margin: 100px;
    border-radius: 5px;
    font-size: 18px;
    background: rgb(255 241 118);
    }

    您可以在浏览器中使用检查选项检查源代码,并在实时站点上调整填充、边距、边框半径和其他参数。

    在浏览器中自定义按钮CSS

    在浏览器中自定义按钮CSS

    如果要在悬停时更改按钮背景,请使用以下CSS。由于我们在上面的CSS中使用黄色变体作为默认按钮背景,这里我们使用白色来显示悬停。这与黑色文本颜色混合,以便用户可以清楚地看到按钮并阅读文本。

    #llc_comments_button:hover {
    background: rgb(255 255 255);
    }
    #llc_comments_button:hover {
    background: rgb(255 255 255);
    }
    #llc_comments_button:hover {
    background: rgb(255 255 255);
    }

    准备好CSS后,转到WordPress管理仪表盘并导航到“外观 > 自定义”部分。将CSS代码粘贴到“附加CSS”部分下,然后单击“发布”按钮。

    在定制器部分添加额外的CSS

    在定制器部分添加额外的CSS

    请注意,定制器不会反映按钮,因为延迟加载仅适用于实时站点。

    评论链接的问题

    许多主题在文章标题下方显示“评论”链接作为文章元数据。延迟加载评论时,此评论链接将不起作用,因为当您在文章标题部分时不会加载评论部分。

    标题下方的评论元链接

    标题下方的评论元链接

    不幸的是,这里唯一的选择是禁用评论元链接。Astra、GeneratePress和Kadence等流行的轻量级主题提供了一个选项来切换您想要在标题下方显示的元数据。但是,如果您的主题不提供此功能,您可能需要使用CSS来隐藏链接。如上所述,您可以右键单击链接并使用检查选项在开发人员工具部分中找到相关的CSS类。拥有评论元数据的CSS类后,在“外观 > 自定义 > 附加CSS”部分下添加以下CSS以隐藏链接。

    .my_comments_meta {
    display: none;
    }
    .my_comments_meta {
    display: none;
    }
    .my_comments_meta {
    display: none;
    }

    如果需要,请从主题开发人员那里获得有关如何隐藏元链接的帮助。

    延迟加载第三方评论设置

    一些网站所有者使用Facebook或Disqus评论而不是默认的WordPress评论表单。虽然这有助于减少评论垃圾邮件,但它会通过发送额外的HTTP请求以从第三方站点加载评论,从而极大地影响速度。如果您使用Facebook或Disqus评论,那么您可以使用不同的插件延迟加载它们。您可以使用Facebook的Lazy Social Comments插件和Disqus的Disqus Conditional Load插件。

    FB和Disqus评论延迟加载插件

    FB和Disqus评论延迟加载插件

    这些插件也来自同一作者,但是提供了大量的自定义设置。对于Facebook评论延迟加载,安装插件后转到“设置 > Lazy FB Comments”部分。填写应用ID的详细信息、要显示的评论数量、选择配色方案并选择点击选项。您还可以添加一个“Comments Div Class”以将按钮包装在 div元素中,您可以使用其他CSS进行自定义,如上所述。

    Lazy FB Comments设置

    Lazy FB Comments设置

    Disqus Conditional Load插件需要在延迟加载之前完全集成Disqus。它将在仪表盘侧边栏中创建名为“Disqus”的附加菜单项。您可以浏览不同的部分并自定义设置以延迟加载Disqus评论。

    Disqus Conditional Load插件设置

    Disqus Conditional Load插件设置

  • 如何解决使用Cloudflare导致WP-Cron不工作问题?

    WordPress定时任务不工作

    WordPress需要一些基本要求,例如MySQL和正确的PHP版本才能正常运行。此外,您还需要额外的设置才能使已安装的插件和主题正常工作。

    WP-Cron是WordPress网站在仪表盘中获取更新和报告所需的此类要求之一。另一方面,Cloudflare是许多托管公司内置的流行的免费CDN服务。

    不幸的是,如果您没有正确配置Cloudflare,它可能会停止WP-Cron作业的运行并导致不希望出现的问题。如果您遇到困难,这里是您可以尝试通过Cloudflare CDN设置以修复WP-Cron无法正常工作的问题。

    更多关于WP-Cron

    Cron是Unix中用于调度作业以在后台完成任务的命令。在WordPress世界中,WP-Cron类似于Unix cron作业,用于以周期性间隔调度任务。与您可以在特定时间安排的系统cron作业不同,WP-Cron在每次页面加载时运行并触发预定任务。以下是一些示例,让您了解WP-Cron的作用:

    • 更新WordPress仪表盘小工具,例如实时销售小工具。
    • 检查处于预定状态的文章并按计划发布。
    • 插件可以在后台运行数据库更新、缓存清除等任务。

    您还可以在此处从官方WordPress页面阅读有关WP-Cron的更多详细信息。

    查找WP Cron问题

    当WP-Cron运行出现问题时,会直接影响定时任务的运行。您可以在仪表盘和服务器的错误日志中看到一些失败通知。下面是一个来自WP Rocket插件的例子,它使用WP-Cron来运行预定的缓存清除。如果不清除缓存,则会因大量过时的缓存内容而减慢您的网站速度。

    WP Rocket Cron作业问题

    WP Rocket Cron作业问题

    您还可以使用WP Crontrol之类的插件来监控和查找站点中与cron相关的问题。一旦您发现WP-Cron存在问题,您应该检查您最近在该网站上所做的活动。如果您启用了Cloudflare或更改了CDN中的任何设置,那么这是开始故障排除的第一个地方。

    在Cloudflare中检查WP Cron问题

    Cloudflare的安全设置允许您阻止恶意机器人。不幸的是,这也可以阻止像WP-Cron这样的自动化活动作为误报。好的部分是您可以根据日志中的IP地址和查询字符串轻松找到它。由于WP-Cron将从您的托管服务器的IP地址运行,您可以根据您的服务器的IP检查被阻止的条目以查找更多详细信息。

    • 如果您不知道服务器的IP地址,您可以从主机面板中找到它。或者,您可以转到Cloudflare帐户的DNS部分并找到带有@的A记录,该记录将指向您服务器的IP地址。
    • 之后,转到“Security>Overview”部分,然后单击“Add filter”按钮。
    • 根据与服务器IP相同的IP地址过滤日志。
    • 在这里,您应该找到显示“ /wp-cron.php ”的“Paths”部分,如下图所示。
    • 您还可以找到其他详细信息,例如阻止的原因,在我们的例子中是“manage defined bots”。

    查找服务器IP的安全详细信息

    查找服务器IP的安全详细信息

    如果您想了解更多详细信息,请在页面上向下滚动并查看活动日志部分。在这里,您可以找到为了解WP-Cron因托管规则设置和托管挑战而被阻止而采取的服务和操作。这取决于您的安全设置,您可能在其中选择了一些带有托管质询的选项。

    查看服务器IP的活动日志

    查看服务器IP的活动日志

    单击“Edit columns”按钮以添加可以显示更多详细信息的其他列。由于IP地址已经存在,请选择“Path”和“Query string”复选框。

    选择路径和查询字符串

    选择路径和查询字符串

    这将添加其他列并向您显示路径和查询字符串。正如您在下面的屏幕截图中所见,路径将显示为/wp-cron.php,查询字符串将显示类似?doing_wp_cron的内容。

    查找路径和查询字符串详细信息

    查找路径和查询字符串详细信息

    相关文章:

    使用Cloudflare修复WP-Cron问题

    现在很明显,Cloudflare安全设置会阻止WP-Cron在您自己的托管服务器上运行。尝试以下选项来解决问题。您可能需要检查您的WordPress仪表盘,使用插件或检查服务器的日志,如上所述,以确认WP-Cron工作正常。

    1.禁用绝对自动化的机器人

    免费Cloudflare帐户有一个简单的“机器人战斗模式”来阻止自动机器人。您可以转到“Security> Bots”部分并关闭此选项并检查WP-Cron是否在您的站点上运行。

    Bots Fight Mode

    在免费Cloudflare帐户中禁用Bots Fight Mode

    如果您使用高级Cloudflare计划,请在“Security > Bots”部分单击“Configure Super Bot Fight Mode”链接。

    在Cloudflare中配置超级机器人战斗模式

    在Cloudflare中配置超级机器人战斗模式

    在这里,您可以看到“Definitely automated”机器人被“Managed Challenge”选项阻止。这是您在活动日志中看到的“Definitely automated”,如上所述。由于WP-Cron肯定是在后台自动化的,Cloudflare会阻塞并造成麻烦。单击下拉菜单并选择“Allow”,Cloudflare将自动保存您的设置。

    允许绝对自动化的机器人

    允许绝对自动化的机器人

    在大多数情况下,这将解决Cloudflare的WP-Cron不工作问题。

    2.禁用WAF下的托管规则

    如果允许机器人不能解决问题,那么下一个选项是禁用Cloudflare自动设置的托管规则。根据您使用的平台,Cloudflare将自动启用某些Web应用程序防火墙 (WAF) 规则来保护您的站点。您可以转到“Security> WAF”部分并在“Managed rules”部分下找到为您的站点启用的规则。只需禁用“Managed rules”选项即可将其关闭。

    在Cloudflare中禁用托管WAF规则

    在Cloudflare中禁用托管WAF规则

    或者,进入页面并仅禁用Cloudflare WordPress规则集。

    禁用Cloudflare WordPress规则集

    禁用Cloudflare WordPress规则集

    现在,检查您的WP-Cron是否在没有来自Cloudflare的WAF规则的情况下运行。

    3. 在IP访问规则中将您的服务器列入白名单

    禁用WAF规则集是有风险的,这可能会破坏Cloudflare安全的目的。虽然您可以使用Wordfence和AIOWPS等插件来添加防火墙,但最好的选择是在Cloudflare WAF设置中允许您网站的服务器IP。当您位于Cloudflare帐户的WAF部分时,请转到“Tools”选项卡。输入您的服务器IP,选择允许和此网站选项,然后单击“Add”按钮。这将添加一个异常并避免阻止您自己的服务器的活动,如WP-Cron作业。

    为绕过Cloudflare防火墙添加IP例外

    为绕过Cloudflare防火墙添加IP例外

    小结

    Cloudflare是流行的CDN和安全服务,但是,它无法识别WordPress站点所需的另一个流行的WP-Cron作业。这是可以理解的,因为插件可以出于不同的原因运行WP-Cron并导致您的站点出现安全问题。

    不幸的是,即使在服务器上手动安排cron作业也无法解决问题,因为插件开发人员可能会使用默认的WP-Cron作业。解决方案是禁用机器人保护或排除服务器的IP地址,这将允许运行WP-Cron作业。

  • 如何解决Elementor加载缓慢问题?

    如何解决Elementor加载缓慢问题?

    Elementor是一个免费的WordPress页面构建器插件,拥有超过500万个活动安装。此外,该插件还具有高级版本和数百个附加组件,可在您的网站中添加精美的元素。

    与任何其他页面构建器插件一样,Elementor添加了自定义样式和脚本,为页面的前端外观添加了令人惊叹的因素。但是,它会在前端和后端影响您网站的页面加载速度的高成本。如果由于Elementor页面构建器而导致网站速度缓慢,您可以尝试以下一些选项来解决速度问题。

    修复缓慢的Elementor插件

    页面速度和用户体验是谷歌搜索算法中的排名因素。因此,与使用拖拽页面速度的Elementor添加美化元素相比,您必须重视加快网站速度。幸运的是,Elementor在插件设置中提供了一些优化功能。此外,您可以优化可能影响Elementor页面加载速度的外部因素。

    使用Elementor设置优化页面速度

    让我们首先探索这些设置,如果这些设置不能解决您的问题,那么您应该检查其他解决方案。

    1. 仅对页面启用Elementor

    默认的WordPress设置允许您创建两种文章类型——文章和页面。此外,像WooCommerce这样的插件将创建产品,您还可以根据需要创建自定义文章类型。我们强烈建议只为页面启用Elementor,而不是为文章和其他自定义文章类型启用。这有助于在前端和后端禁用除页面之外的Elementor资源的加载。当您激活Elementor插件时,它将默认为文章和页面启用。您可以转到“Elementor > Settings”菜单并在“General”选项卡下禁用文章插件。

    为文章禁用Elementor

    为文章禁用Elementor

    2. 使用Elementor Experiments

    该插件在“Experiments”选项卡下提供了许多实验性功能。在这里,您可以看到正在进行的实验以及已完成并被接受为稳定功能的实验。为了提高加载速度,您可以在稳定和持续部分下启用所有与速度相关的项目。

    激活以下正在进行的实验:

    • Improved Asset Loading – 此选项将减少加载的默认代码并仅在需要时动态加载剩余代码。
    • Improved CSS Loading – 这与上面的功能相同,仅在需要时加载CSS。
    • Inline Font Icons – 禁用Font Awesome和eicon的加载并加载内联SVG图标。

    Elementor正在进行的实验

    Elementor正在进行的实验

    激活以下Stable实验:

    • Optimized DOM Output——这将减少HTML wrappers的数量以提高速度。

    Elementor Stable功能

    Elementor Stable功能

    确保在启用正在进行的实验后彻底测试您的网站,因为它们可能会破坏您网站的布局。例如,动态加载资源会影响使用WP Rocket和其他插件删除未使用的CSS等功能。

    3.优化字体使用

    使用Google字体和其他自定义字体会在Google PageSpeed Insights中产生很多问题。例如,当您使用带有Elementor插件的Google Fonts时,您会看到在加载Web字体和预加载字体时使文本可见的警告。幸运的是,Elementor具有内置的字体优化选项,您可以使用它们来提高页面加载速度。

    • 如上所述,使用“Inline Font Icons”来使用“Ongoing Experiments”部分下的SVG图标。
    • 转到“Elementor > Settings > General”部分并启用“Disable Default Fonts”选项。这将有助于禁用Elementor加载的字体,并且该插件将继承您主题的所有元素的字体。
    • 如果您不想禁用Elementor字体,请转到“Advanced”选项卡并为“Google Fonts Load”选择“Swap”选项。这将有助于为每个Google字体文件请求添加“swap”参数,并修复PageSpeed Insights中的文本可见性警告。

    使用外部CSS文件并交换Google字体

    使用外部CSS文件并交换Google字体

    4.使用外部CSS文件

    正如您在上面的屏幕截图中看到的那样,Elementor允许两个“CSS Print Method”选项。一种是使用“External File”,另一种是使用“Internal Embedding”。选择“External File”选项,以便将所有CSS样式作为外部文件加载。之后转到“Elementor > Tools > General”部分,然后单击“Regenerate Files & Data”。这将重新生成数据并作为外部CSS文件加载。它将有助于正确缓存页面并提高速度,而不是动态注入无法缓存的CSS。

    Elementor中的安全模式和文件重新生成

    Elementor中的安全模式和文件重新生成

    5.尝试安全模式

    如果您在创建或编辑页面时遇到加载缓慢的Elementor编辑器,则可以使用“Elements > Tools > General”部分下的安全模式。安全模式会在加载缓慢时在编辑器中显示建议。

    Elementor Editor以安全模式打开

    Elementor Editor以安全模式打开

    同样,您可以启用“Debug Bar”选项来查找页面上加载的模板。当您尝试解决问题时,此信息可用于故障排除。

    6.回滚插件

    最后,如果您在升级Elementor后遇到任何问题,可以选择恢复到以前的版本。与任何回滚一样,请确保备份数据库以备不时之需。转到“Elementor > Tools > Version Control”部分。您可以重新安装当前版本,也可以选择要回滚的任何先前版本。

    回滚Elementor插件

    回滚Elementor插件

    提高Elementor速度的其他因素

    以上所有因素都在Elementor设置范围内,以下是可能影响您网站速度的外部因素。

    7.使用轻量级主题

    尽管Elementor是一个独立的插件,但许多商业主题都将Elementor与其他功能捆绑在一起。由于这些主题是自定义编码来创建页面布局的,因此很容易产生冲突并影响加载速度。我们建议使用带有免费Elementor入门模板的轻量级主题,例如Astra或GeneratePress。

    另一种选择是使用来自同一插件开发人员的Hello Elementor主题。这个主题有超过100万个活动安装,并且在不知不觉中可以与Elementor顺利配合。它具有最小的设计,主要与Elementor模板一起使用。因此,如果您真的喜欢Elementor插件,那么Hello Elementor是您拥有优化网站的最佳主题。

    免费Hello Elementor主题

    免费Hello Elementor主题

    8. 减少附加组件的数量

    有数百个第三方插件可用作Elementor页面构建器插件的附加组件。这些插件将为基础插件添加额外的元素以创建漂亮的布局。但是,这些插件可能无法很好地与父Elementor插件一起使用,尤其是当父插件更新到较新版本时。此外,附加组件将添加额外的CSS/JS并增加HTTP请求。如果您喜欢 Elementor,请转到提供足够元素和模板库的 Pro 版本。避免使用第三方插件来添加一些可能会降低您网站速度的元素。

    如果您想使用附加组件,请使用诸如Ultimate Add-ons for Elementor之类的插件。您可以仅启用所需的小工具并禁用其他小工具以减小文件大小。

    9.检查缓存设置

    首先是确保在使用Elementor时有适当的缓存或优化插件。这将有助于将所有页面作为静态页面提供并提高加载速度。WP RocketPerfmatters是可用于优化Elementor网站的两个最佳插件。但是,在使用WP Rocket或任何其他缓存插件优化CSS交付功能时需要小心。当您在Elementor中添加了动态CSS时,删除未使用的CSS生成关键路径CSS将无法正常工作。

    • 如果您优化网站上的CSS交付,请禁用“Improve CSS Loading”实验并使用外部文件选项。
    • 或者,您可以从CSS优化中排除动态文件。由于动态资源会在每个页面上发生变化,因此您需要使用缓存/优化插件允许的通配符格式排除它们。

    如果您将Elementor用于文章或任何其他自定义文章类型,那么我们强烈建议您使用Perfmatters或Asset Cleanup插件。使用这些插件,您可以在特定文章和站点级别禁用未使用的CSS和JS文件。

    9. Cloudflare Rocket Loader

    当用户从全球访问您的页面时,CDN有助于将您的内容从最近的服务器传送到用户的位置。这适用于Elementor页面和您的整个网站。许多用户使用托管公司提供的免费Cloudflare CDN以及Elementor设置。Cloudflare提供了一项名为Rocket Loader的功能,可帮助改进基于JavaScript的页面的加载。但是,它可能会在Elementor编辑器中以及在已发布的页面上产生问题。如果您发现编辑器在滚动或发布页面损坏时运行缓慢和跳跃,请禁用Rocket Loader功能并检查它是否有效。

    如果Rocket Loader是问题所在,那么您可以使用Cloudflare中的页面规则忽略Elementor页面和模板来解决问题。

    10.优化托管设置

    Elementor和WooCommerce等其他重型插件需要优化的托管来更快地加载您的页面。之前,您需要寻找SiteGround Cloud、 Cloudways或任何其他VPS托管平台来使用Elementor页面构建器。现在Elementor人自己提供了一个优化的托管与谷歌云平台和Cloudflare CDN。尽管这有10万次访问、100GB带宽和20GB空间的限制,但您可以轻松启动网站并以每年99美元的价格购买Elementor Pro。您可以获得针对Elementor的完全优化设置,并且您的网站将使用Hello Elementor等主题快速加载。

    11. 图像优化

    最后,在折叠区域上方使用的大尺寸图像将产生加载最大内容绘画的问题。此外,其他图像如果未正确优化也会产生问题。

    • 减小图像的大小和尺寸,尤其是用于折叠区域上方的图像。
    • 延迟加载图像以仅在用户滚动到该位置时加载它们。
    • 使用WebP格式来减小大小并更快地加载它们。

    小结

    像Elementor这样的插件因拖放元素和有吸引力的可重用模板而变得流行。然而,现在情况完全改变了,与漂亮的页面布局相比,速度是最重要的因素。您可以利用默认的Elementor实验和其他设置来修复缓慢的站点并提高页面加载速度。此外,您还可以尝试他们优化的Hello Elementor主题和高级云托管,让您的网站更上一层楼。

  • 如何解决WordPress由于字体导致预加载关键请求问题?

    如何修复WordPress由于字体导致预加载关键请求问题?

    如今,速度就是一切。浏览器会尝试缓存网页上的内容以加快加载速度。有很多方法可以通知浏览器缓存什么、何时缓存以及缓存内容保留多长时间。

    预加载就是这样一种缓存功能,有助于提高WordPress网站的页面加载速度。但是,这可能会在Google PageSpeed Insights工具中使用的Google Lighthouse报告中产生错误。

    在本文中,让我们解释如何解决PageSpeed Insights中由于字体导致的预加载关键词请求问题。

    如何使用预加载?

    预加载,顾名思义,就是在页面开始加载时,通知浏览器立即开始缓存网页上的资源。这将有助于缓存稍后需要的CSS、脚本和字体。您可以在这篇Google开发人员文章中了解有关预加载的更多信息。

    基本上,preload是HTML链接标签中rel属性的值。以下是在您的网站上使用预加载请求的语法:

    <link href=“font.woff” as=“style”>
    <link href=”font.woff” as=”style”>
    <link href="font.woff" as="style">

    对于网站上加载的每个CSS、脚本和字体文件,您需要在HTML的head标签之间插入此链接标签。

    预加载的Google PageSpeed问题

    虽然预加载会加快加载时间,但应该正确使用。使用PageSpeed Insights工具检查您的网站,看看是否有任何机会因预加载请求而可用。下面是一个示例,显示由于预加载关键请求,您可以节省7.05秒。

    单击向下箭头时,您将看到导致延迟的所有相关内容。在这种情况下,都是网页上加载的字体。

    PageSpeed Insights中的预加载关键词请求错误

    PageSpeed Insights中的预加载关键词请求错误

    WordPress插件和预加载

    现在,您可能会对WordPress网站的Google PageSpeed报告中显示的预加载方式感到困惑。您会收到此错误的原因有很多:

    • 通过在CSS中导入的主题和插件加载字体。
    • 您正在使用像WP Rocket这样的缓存插件来预加载页面但不预加载字体。
    • 您正在使用带有Google AdSense等广告的第三方字体或使用插件在您的网站上加载字体很棒的图标。

    缓存插件将预加载请求键添加到所有资源。但是,使用@font-face在CSS中导入的字体不会使用预加载键请求。PageSpeed显示的错误可能是由于站点加载的字体未使用预加载键所导致。

    如何修复由于字体导致预加载关键请求问题?

    您可以通过在PageSpeed中显示的那些资源的站点标题上手动添加预加载键来消除错误。但是,也有一些插件可以自动在您的标题上插入元标记。我们将解释手动和插件方法。

    使用WP Rocket修复Google PSI中的预加载关键词请求

    首先,我们将使用WP Rocket插件进行说明,因为它很简单,您不需要修改PHP文件。

    使用WP Rocket包括字体预加载

    WP Rocket是一款高级缓存插件,可让您预加载字体。如果您使用的是WP Rocket,请转到“设置 > WP Rocket > Preload”部分。将字体资源的相对URL粘贴到“Preload fonts”文本框下并保存更改。这将帮助您摆脱Google PageSpeed Insights工具中的预加载请求问题。请记住,相对URL的格式应为“/wp-content/themes/your-theme-name/font-file-name”(主题字体)和“/wp-content/plugins/plugin-name/font-file-name”(用于插件加载的字体)。

    在WP Rocket插件中预加载字体

    在WP Rocket插件中预加载字体

    WP Rocket优化了许多其他功能,例如关键CSS生成、DNS预取和在本地托管Google Analytics等第三方脚本。因此,使用WP Rocket之类的插件来提高WordPress网站的整体速度是一个好主意。WP Rocket插件还提供了生成关键路径CSS移除未使用的CSS的选项。

    手动添加预加载元标记

    按照以下步骤在主题的header.php文件中手动插入元标记。我们建议使用子主题,以便在更新父主题时更改将保持不变。

    准备链接元标记

    第一步是获取Google PageSpeed中显示的资源的所有URL。通常,您会看到URL的结尾部分,将鼠标悬停在链接上以查看阻塞资源的完整URL。现在,您可以复制URL并粘贴到文本编辑器中。

    您需要使用以下格式的URL来包含在链接标签中:

    <link rel=“preload” href=“Font URL Showing in PageSpeed” as=“font” crossorigin=“anonymous”>
    <link rel=”preload” href=”Font URL Showing in PageSpeed” as=”font” crossorigin=”anonymous”>
    <link rel="preload" href="Font URL Showing in PageSpeed" as="font" crossorigin="anonymous">
    

    为您的主题和插件使用的每个字体资源准备链接标签。

    在标题中插入链接标签

    下一步是复制所有带有预加载请求的链接标签,并粘贴到网站的标题部分。在您的WordPress网站上,您需要将链接标签粘贴到活动主题的header.php文件中。您可以使用托管帐户中的文件管理器应用程序或使用FTP编辑header.php文件并在标题中插入代码。

    • 使用FileZilla等FTP客户端登录您的托管帐户,或在您的托管帐户中找到文件管理器应用程序。
    • 导航到“/wp-content/themes/yourtheme”文件夹并找到header.php文件。

    编辑header文件

    编辑header文件

    • 编辑文件并在标题部分插入预加载代码。
    • 它将如下所示,记住插入您在Google PageSpeed Insights工具中看到的所有请求。

    在header文件中添加预加载参数

    在header文件中添加预加载参数

    或者,您也可以在管理仪表盘中转到“外观 > 主题编辑器”并编辑文件。我们建议使用子主题并修改header.php文件。如果修改父主题文件,每次更新主题时都需要手动插入这段代码。或者,您可以使用插入页眉和页脚插件等插件将链接标签添加到您网站的页眉,而无需编辑主题文件。

    再次检查PageSpeed

    手动插入链接标签或使用WP Rocket后,请确保清除您网站上的缓存。回来查看PageSpeed Insights,现在您不会看到预加载关键请求错误。

    没有预加载问题

    没有预加载问题

    您可以单击“Passed audits”部分并检查“Preload key requests”问题是否处于通过状态。

    结论

    通常,Google PageSpeed Insights会显示预加载错误,导致页面加载延迟数秒。您可以按照上述步骤手动或使用插件插入预加载链接。这将帮助您从Google PageSpeed中消除错误并提高速度得分。

  • 如何绕过WordPress中的WP Rocket缓存?

    如何绕过WordPress中的WP Rocket缓存?

    WP Rocket是可用于WordPress的最流行的缓存插件之一。它打破了拥有数百个选项的传统规则,并为用户提供了简单易用的界面。您只需切换选项即可在几分钟内加快您的网站速度

    但是,该插件在前端不提供任何选项来禁用页面缓存或绕过特定页面的设置。在本文中,我们将解释如何使用各种方法绕过WordPress中的WP Rocket缓存。

    绕过WP Rocket缓存

    尽管缓存可以帮助用户快速加载页面,但在您执行某些活动时可能会产生问题。以下是您可能希望绕过WP Rocket缓存的一些常见场景:

    • 您想在使用和不使用WP Rocket插件的情况下在Google PageSpeed Insights工具中测试页面速度得分。您可能还想查看在没有缓存的情况下加载了多少CSS或JS文件或进行类似分析。
    • 只想在某些页面上禁用WP Rocket缓存。例如,WP Rocket将无法与WooCommerce和GeneratePress主题一起使用,并使商店页面无响应。您需要在小屏幕上禁用WooCommerce样式才能解决此问题
    • 您想禁用WP Rocket自动的页面级缓存,而没有任何选项可以在前端禁用它。

    根据情况,您可以按照以下选项之一绕过WP Rocket缓存。在大多数情况下,您可能需要在整个站点或页面级别禁用插件而不是绕过。因此,我们将解释禁用和绕过而不停用的可用选项。

    1.完全禁用插件

    简单易用的选项是简单地停用您网站上的插件。您可以完成测试,然后重新激活。好的部分是该插件将保留您以前的所有设置。但是,每次想要测试一些简单的东西时,完全禁用插件并不是一个可行的解决方案。

    请记住,当您想要测试兼容性或想要测试另一个缓存插件时,您应该停用该插件。例如,如果您想测试W3 Total Cache,那么在安装W3 Total Cache插件之前先停用WP Rocket。这些缓存插件将添加像advanced-cache.php这样的插件文件,当两个插件都处于活动状态时,它们可能会相互冲突。结果,您的网站将显示白屏死机或缓存不起作用。

    转到WordPress管理面板中的“插件”部分,然后单击WP Rocket插件下的“停用”链接。单击“Skip & Deactivate”按钮可暂时停用插件而不删除缓存的内容。

    停用WP Rocket插件

    停用WP Rocket插件

    2.禁用特定页面上的插件

    大多数WordPress商业主题都提供页面构建器集成,例如Elementor和Visual Composer。使用页面构建器插件在页面上使用繁重的JavaScript时,缓存会遇到真正的问题。动态动画图表和jQuery数据表等元素可能无法与WP Rocket等激进的缓存插件一起正常工作。最好的解决方案是在缓存有问题的页面上禁用WP Rocket缓存。

    • 转到“文章”或“页面”并在古腾堡编辑器中找到您的文章并进行编辑。
    • WP Rocket将在编辑器中添加一个元框,您可以使用它来更改全局行为。如果您在边栏中没有看到元框,请单击三个点按钮并选择“首选项”。转到“面板”部分并启用“WP Rocket Options”元框。

    启用WP Rocket选项元框

    启用WP Rocket选项元框

    • 在侧边栏中看到元框后,选中“Never cache this page”选项。
    • 发布您的文章,插件将忽略所有类型的缓存页面。

    从不缓存特定页面

    从不缓存特定页面

    您也可以对您网站上的任何其他自定义文章类型执行相同的过程

    3.清除特定页面的缓存

    与排除页面类似,您可能还想简单地删除某些页面上的缓存。默认情况下,每当您更改页面内容并再次发布时,WP Rocket都会清除缓存。但是,在某些情况下,清除可能不起作用,例如当您从文章索引页面更改类别或使用第三方工具更改编辑器外部的内容时。无论如何,我们建议您在分享URL或在Google Search Console中提交之前清除该特定页面的缓存。

    • 转到“文章”部分,找到要删除旧缓存的页面。
    • 将鼠标悬停在标题链接上,然后单击“Clear this cache”选项。
    • 这将删除旧缓存,当再次访问该页面时,WP Rocket将缓存新内容。

    清除特定页面的缓存

    清除特定页面的缓存

    4.从缓存中排除页面

    如果您不想通过转到编辑器来排除页面,您也可以从插件的设置中排除。使用设置的优点是您可以使用不同的选项,如正则表达式或限制特定用户代理访问缓存页面。您可以通过转到“设置> WP Rocket”菜单并导航到“Advanced Rules”部分来忽略页面缓存。

    输入要从缓存中排除的URL

    输入要从缓存中排除的URL

    在同一设置页面上,您可以在“Never Cache User Agent(s)”部分下添加用户代理。

    5.绕过WP Rocket缓存而不停用

    有时,您想测试多个页面绕过缓存而不停用插件。

    • 只需添加?nowprocket参数和要测试访问未缓存页面绕过WP Rocket缓存的页面URL。
    • 例如,如果您的页面URL是“ https://yoursite.com/my-page/ ”,则使用“ https://yoursite.com/my-page?nowprocket ”之类的URL来访问未缓存页面的内容。

    这是绕过WP Rocket缓存并进行兼容性测试来检查页面速度的最佳方法。但是,这不会绕过通过htaccess文件应用的缓存规则。例如,WP Rocket将为浏览器缓存和GZIP压缩应用htaccess指令,当绕过?nowprocket查询时,这些指令可能仍然有效。

    6.禁用页面级缓存

    最后一个选项是永久禁用整个站点或特定页面上的页面级缓存。这是不可取的,因为页面缓存对于提高速度很重要。但是,在某些情况下,如果您有另一个与WP Rocket设置冲突的页面缓存插件,您可能需要这样做。例如,SiteGround提供自动静态缓存缓存(加上浏览器缓存和GZIP压缩)以及来自主机帐户的Nginx直接交付选项。我们已与WP Rocket支持团队确认SiteGround设置上的WP Rocket可以正常工作,没有任何冲突。

    SiteGround中的静态缓存

    SiteGround中的静态缓存

    但是,这可能不适用于所有自定义缓存设置,解决方案是禁用 WP Rocket 的页面缓存,因为您无法快速更改托管设置。不幸的是,这是一个漫长的过程,您需要根据您的要求使用不同的辅助插件。

    6.1 为特定URL启用页面缓存

    请按照以下步骤仅为您网站上的特定页面启用WP Rocket页面缓存。

    • 转到GitHub并下载WP Rocket helper插件,用于带有排除项的页面缓存。
    • 解压缩存档文件并编辑“wp-rocket-no-cache-with-exception-urls.php”文件。
    • 他们在该文件中包含了从第24行到第27行的三个示例包含URL,如下所示。您可以将“example.com/page-one/”和其他两个示例行替换为您的域的URL。如果需要,您可以在该块之间添加更多行。

    包括用于页面缓存的URL

    包括用于页面缓存的URL

    • 保存文件并将其与自述文件一起再次归档为ZIP文件夹。
    • 转到您的WordPress管理面板,上传插件并像您网站上的任何其他插件一样激活。

    现在WP Rocket不会在整个站点上进行页面缓存,除了助手插件文件中列出的URL。

    6.2 仅在特定页面上禁用页面缓存

    除了上述方式,您可以使用备用帮助插件仅在某些页面上禁用页面缓存。

    • 您可以下载帮助插件并编辑“wp-rocket-no-cache-for-page.php”文件。
    • 在这种情况下,您必须通过替换文件中的示例ID 1、2在第29行输入文章或页面ID。
    • 保存文件并再次压缩以上传到您的站点。
    • 激活插件以仅在提供的文章或页面ID上禁用页面缓存。

    在特定页面上禁用页面缓存

    在特定页面上禁用页面缓存

    6.3 完全禁用页面缓存

    如果您想毫无例外地禁用整个站点上的页面缓存,请使用此帮助插件。您可以简单地在您的网站上上传并激活它,而无需修改插件的文件内容。

    6.4 为登录用户禁用页面缓存

    上述两种方法都为未登录您网站的普通用户禁用页面缓存。但是,WP Rocket还提供了为登录用户创建单独缓存的功能。您可以在“Cache > User Caching”部分启用此选项。

    用户缓存已启用

    用户缓存已启用

    如果您想为登录用户禁用页面缓存,请使用此帮助插件。您无需修改​​内容,只需上传zip文件并激活帮助插件即可。请记住,您需要使用此插件以及上述方法之一来禁用登录和注销用户的页面缓存。

    要记住的要点

    通常,只要您的站点发生更改,WP Rocket就会清除缓存。但是,我们建议您在再次尝试测试页面之前删除以下缓存内容。

    • 通过在Windows中按“Control + Shift + Delete”和在macOS中按“Command + Shift + Delete”来删除浏览器的缓存。这将打开删除浏览历史记录弹出窗口,您可以在其中从浏览器中删除以前缓存的文件。但是,这会将您从WordPress管理面板中注销,因为会话cookie将过期。因此,请先保存所有更改并注销,然后再清除浏览器的缓存。最好的选择是使用备用浏览器进行测试,这样您就可以在不注销的情况下进行并行测试。
    • 如果在您的站点上处于活动状态,请从任何其他插件中删除缓存。如前所述,所有SiteGround站点都预装了SG Optimizer插件。因此,您需要在进行测试之前清除SG Optimizer缓存。
    • 最后,如果在您的托管服务器上处于活动状态,则清除服务器级缓存。大多数提供清漆或自定义缓存设置的托管公司就是这种情况。

    小结

    如您所见,通过在您的URL中添加参数来绕过WordPress站点中的WP Rocket缓存是一项简单的任务。您还可以从插件的全局设置或编辑器元框中排除单个页面。但是,完全禁用页面缓存或在特定页面上禁用页面缓存是一项需要帮助插件的棘手任务。确保根据您的需要选择正确的方法以获得正确的结果。

  • 如何彻底卸载删除W3 Total Cache插件?

    如何彻底卸载删除W3 Total Cache插件?

    W3 Total Cache (W3TC) 是WordPress网站最受欢迎的缓存插件之一。它通过缓存WordPress安装中的每个元素来开箱即用,并有助于加快网站速度。但这只有在您正确配置设置时才会发生,否则可能弊大于利。此外,托管在共享托管平台上的网站应小心启用许多选项以避免帐户终止。

    不管是什么原因,如果W3 Total Cache不适合您,那么删除过程并不像您想象的那么简单。在本文中,我们将解释如何从您的WordPress安装中完全卸载删除W3 Total Cache插件。

    如何彻底删除W3 Total Cache插件?

    以下是要遵循的步骤:

    1. 清除所有缓存
    2. 停用并删除插件
    3. 检查您的.htaccess文件
    4. 删除缓存文件夹
    5. 删除W3tc配置文件夹
    6. 删除升级文件夹
    7. 删除object-cache.php插入文件
    8. 从CDN服务器清除缓存

    1. 清除缓存

    在删除任何缓存插件之前,您应该做的第一件事是清除缓存文件。对于W3 Total Cache,转到顶部栏上的“Performance”菜单,然后单击“Purge Everything”选项。

    请记住,此清除所有内容不会从服务器中删除任何缓存的内容。

    2. 停用和删除插件

    与删除任何其他插件类似,只需在“插件 > 已安装插件”下“停用”插件即可。一旦停用,然后点击“删除”以从“/wp-content/plugins/”文件夹中删除插件文件夹。

    停用和删除W3TC插件

    停用和删除W3TC插件

    3. 检查.htaccess文件

    W3TC将在.htaccess文件中创建许多指令来控制缓存行为。每个部分都将以“#BEGIN W3TC Page Cache core”和“#END W3TC Page Cache core”之类的注释开始和结束。

    确保删除插件后在您的 .htaccess 文件中没有残留条目。

    删除其他目录

    W3TC在“/wp-content/”文件夹下创建了许多其他目录,如下所示。您应该删除所有这些目录和子目录以进行清理。我们将在本文的其他部分对此进行解释。

    残留的W3TC文件

    残留的W3TC文件

    4. 删除缓存文件夹

    W3TC将在“/wp-content/”下创建一个“Cache”文件夹,并存储您网站的所有缓存内容。此处的内容取决于启用的设置。每种启用的缓存类型都会在此处创建一个目录。例如,启用页面缓存、数据库缓存和对象缓存将创建三个不同的文件夹并分别存储内容。

    W3TC缓存目录的内容

    W3TC缓存目录的内容

    根据您网站的大小,您将在每个文件夹中看到大量子目录。在共享主机环境中,这将导致违反限制文件数和目录数的条款。由于文件数量众多,删除这些缓存的内容也不是一件容易的事。

    相关阅读: 在W3TC中排除页面和目录?

    5. 删除W3TC配置文件夹

    该插件将所有保存的配置设置存储在“/wp-content/plugins/W3TC”目录之外。这将有助于插件在删除并再次安装时恢复设置。当您决定完全摆脱插件时,请删除文件夹“/wp-content/w3tc-config”。

    6. 删除升级文件夹

    W3TC还在“/wp-content/”目录下创建了一个“Upgrade”文件夹。我们认为此文件夹用于保存与升级的高级版本相关的设置。确保也删除此文件夹。

    7. 从CDN中删除缓存文件

    除了删除所有相关文件外,如果您使用CDN,请确保从CDN中清除缓存的内容。当您在W3TC设置中启用最小化选项时,这是必需的。您应该从CDN服务器中删除压缩和组合的脚本和CSS文件,以避免站点在浏览器上中断。

    8. 删除object-cache.php文件

    它并没有就此结束。W3TC还为其对象缓存添加了一个“drop-in”插件。文件名为“object-cache.php”,可在“/wp-content/”文件夹下找到。我们还建议删除此文件。当您安装另一个缓存插件时,他们很可能会再次创建这个“drop-in”。

    小结

    如前所述,在您的WordPress网站上安装W3TC插件很容易。但是从管理面板中删除它并不容易。您应该使用FTP访问后端服务器以完全删除文件。这与许多缓存和安全插件的情况相同。至少有一件好事是W3TC不创建任何MySQL数据库表。因此,在尝试在您的网站上安装不必要的插件之前,请注意这一事实。您还可以查看其他可用的缓存插件,为您的站点选择最佳的。

  • 从W3 Total Cache插件缓存中排除页面和目录

    W3 Total Cache缓存设置

    W3 Total Cache是WordPress的顶级免费缓存插件之一,活动安装量超过100万。但是,它需要在您的站点上进行正确设置才能缓存页面并正常工作。不同部分下有数百种可用设置,您很容易迷失方向。在设置中很容易出错,这会影响页面速度并破坏您网站的布局。特别是当您在页面上使用大量JavaScript时,您应该在部署到实时站点之前在您的登台或测试站点上彻底测试W3 Total Cache (W3TC)。当您发现某些页面布局错乱并希望将它们从缓存中排除时,下面是详细的教程。

    为什么要排除特定页面和目录?

    从缓存中排除特定页面或目录以进行正确加载的原因有很多。这取决于您在网站上使用的主题和插件。以下是W3 Total Cache插件遇到问题的一些常见案例:

    • 当您拥有WooCommerce插件时,产品和购物车页面通常会因W3TC缓存而中断。
    • 使用带有jQ​​uery或JavaScript的slideshow轮播会破坏缓存,并且无法正确加载,尤其是在移动设备上。
    • 大多数页面构建器插件(如WPBakery)附带的博客轮播元素无法在W3TC中正常工作。

    如果您使用严重依赖jQuery的主题,则需要禁用JavaScript的最小化(minification)才能正确加载页面。幸运的是,W3TC提供了一个使用通配符排除页面和目录的选项,以便您可以轻松地将它们从缓存中排除。

    觉得W3 Total Cache设置复杂的朋友,可以尝试WP Rocket高级插件来加速您的网站。您会对最小的设置和网站页面速度得分的提高感到惊讶。

    从W3 Total Cache插件缓存中排除页面和目录

    登录到您的WordPress管理面板并导航到“Performance > Page Cache”部分。向下滚动到“Advanced”部分并查找“Never cache the following pages”选项。

    W3 Total Cache Page Cache高级设置

    W3 Total Cache Page Cache高级设置

    您将看到插件已经在文本框中添加了几行,如下所示。

    wp-.*.php
    index.php
    wp-.*.php
    index.php
    wp-.*.php
    index.php

    在“Never cache the following pages”文本框中输入页面URL和目录,以将它们从缓存中排除。再次,向下滚动到底部并单击“Save Settings & Purge Caches”按钮以清除旧缓存并保存您的更改。

    如何输入页面URL和目录?

    W3 Total Cache允许通过多种方式进入要从缓存中排除的页面和目录。您可以使用URL、目录名称、通配符和正则表达式格式。输入您的详细信息时,请确保遵循以下准则:

    • 每行输入一个整体,可以是页面URL或目录。
    • URL和目录作为相对URL输入到您的域。这意味着您需要忽略站点地址,只输入剩余部分。

    以下是您可以输入的一些示例排除规则:

    排除格式 预期结果
    /showcase* 域名后以/showcase开头的任何内容都不会被缓存
    /shop* * 所有商店页面将被忽略
    /demo/ 只有演示目录将被忽略
    /post-name/ 指定文章URL不会被缓存
    /page-url/ 指定页面URL不会被缓存

    从缓存中排除内容的其他可能性

    除了不包括文章、页面和目录之外,W3 Total Cache插件还允许其他一些可能性。这些选项在“Advanced”下的“Page Caching”菜单可用。

    排除指定类别的文章

    您可以通过在“Never cache pages associated with these categories”文本框中提及类别标签来排除指定类别下的所有文章。例如,如果您有一个名为“技术”的类别,那么只需将其slug填入,不带前导或尾随斜杠。该插件将从缓存中排除“技术”类别下的所有文章,用户将查看非缓存页面。

    根据W3TC中的类别排除文章

    根据W3TC中的类别排除文章

    排除带有指定标签的文章

    与类别类似,您可以根据标签忽略缓存中的文章。请记住输入不带斜线的标记段。

    Exclude-Caching-Based-on-Tags-in-W3TC

    在W3TC中排除基于标签的缓存

    排除基于作者的文章

    在“Never cache pages by these authors”框中每行输入一个作者姓名。这将从缓存中排除指定作者的所有文章。

    根据作者姓名排除页面

    根据作者姓名排除页面

    根据自定义字段排除文章

    自定义字段是您可以在WordPress中存储相关数据的附加字段。您可以使用Gutenberg或经典编辑器中可用的默认WordPress自定义字段将自定义字段添加到您的文章和页面。稍后,您可以根据您在编辑器中添加的自定义字段将页面从缓存中排除。条目的格式应类似于“custom filed=value ”,如下所示。

    根据自定义字段排除页面

    根据自定义字段排除页面

    小心其他选项

    如前所述,W3 Total Cache插件的问题是您很容易对设置感到困惑。就在“Never cache….”下方。选项,您会发现更多与排除页面无关的选项,实际上,它们用于包含在缓存中。

    • 还有另一个选项称为“Cache exception list”。该插件将缓存您在此框中输入的任何URL或目录,无论您是否使用上述排除方法之一进行了排除。因此,当您从缓存中排除页面时,请确保保留此框。
    • 此外,“Non-trailing slash pages”选项对于包含没有尾随斜杠的页面进行缓存非常有用。通常,您可以使用它来缓存XML站点地图和其他在WordPress中没有斜杠的文件。因此,要从缓存中排除页面,您不应在此框中输入URL或目录。
    • 最后,保留“Specify page headers”部分,它也用于缓存页面,而不是用于排除。

    W3TC缓存选项

    W3TC缓存选项

  • 如何从WordPress网站彻底卸载删除WP Rocket插件?

    彻底删除WP ROCKET

    随着谷歌追求速度,像WP Rocket这样的缓存插件在WordPress博主中变得流行起来。通常,WP Rocket可与流行的主题和页面构建器插件无缝协作。

    但是,如果设置不正确或与您网站上的其他插件发生冲突,它可能会产生问题。如果您想摆脱WP Rocket插件,这里有一个完整的指南,介绍如何从您的WordPress网站上完全卸载删除WP Rocket

    为什么您可能需要删除WP Rocket插件?

    该插件虽然具有简单的用户界面;但是,您可能会在缓存和支持方面遇到以下问题:

    • 设置WP Rocket后,您可能会发现Google PageSpeed Insights工具中的页面速度是降低而不是提高。
    • 您发现该插件破坏了您网站的布局。
    • 没有禁用某些功能(如页面缓存)的选项。该插件默认缓存所有页面,您需要安装额外的帮助插件来禁用页面缓存。
    • 删除未使用的CSS等新引入的功能将创建会增加数据库大小的表。
    • 移动缓存可能会给无响应的网站带来问题,尤其是使用WooCommerce插件创建的电子商务商店。
    • 关键CSS,删除未使用的CSS选项将造成渲染阻塞资源问题,而不是提高移动速度。
    • 如果您使用的是SiteGround托管,您有一个免费的SG Optimizer插件,它提供了类似的WP Rocket功能。因此,您可能想要摆脱WP Rocket设置。同样,许多托管公司提供自定义缓存解决方案,而WP Rocket可能无法有效工作或将变得多余。
    • 开发人员的支持恶化,您需要等待3天才能得到回复。以前,您可以直接从WordPress管理面板提出票证。但是,现在您需要登录他们的网站并提出问题。不幸的是,您甚至不会在提出工单后收到一封礼貌的回复电子邮件,并且除非他们回复,否则无法跟踪您的问题的状态。

    不管是什么原因,清理您网站上的WP Rocket残留物比您想象的要艰巨。

    从您的WordPress网站中删除WP Rocket插件

    在我们之前的文章中,我们已经解释了如何删除W3 Total Cache插件。W3 Total Cache和WP Rocket等缓存插件会创建许多文件夹,安装插件插件,在htaccess文件中插入指令并创建缓存文件夹。不幸的是,简单地删除插件并不能完全删除插件留下的所有这些残留物。您必须手动清理它们才能从安装中删除插件。

    如果最新的更新为您的站点带来了问题,那么回滚WP Rocket插件而不是完全删除是个好主意。您可以通过导航到WordPress管理面板中的“设置 > WP Rocket > Tools”部分回滚到以前的主要版本。您将在“Rollback”部分下看到一个“Reinstall Version Number”按钮,然后单击它以将插件恢复到以前的主要版本。

    回滚WP Rocket插件

    回滚WP Rocket插件

    按照以下步骤从您的WordPress安装中完全摆脱WP Rocket插件。

    第 1 步 – 停用任何其他缓存插件

    几乎所有缓存插件都使用一些常见的设置,例如使用插件插件和在wp-config.php文件中添加条目。因此,卸载WP Rocket并删除相关文件会影响其他缓存插件的常用功能。一般来说,缓存插件应该重新生成条目并添加插件插件。

    但是,为了避免混淆,请在删除WP Rocket之前先停用您网站上的任何其他缓存插件。稍后,您可以激活应该插入所需条目并创建插件的其他缓存插件。

    Step2 – 卸载和删除插件

    作为第一步,您需要从您的WordPress网站上卸载该插件。

    • 登录到您的管理面板并转到“设置 > WP Rocket > Dashboard”部分并首先清除您缓存的文件。

    清除WP Rocket缓存

    清除WP Rocket缓存

    • 然后导航到“插件>已安装插件”部分,然后单击“WP Rocket”插件下的“停用”。
    • 选择“Skip & Deativate”按钮以停用插件。

    停用WP Rocket插件

    停用WP Rocket插件

    • 之后,单击“Delete”选项将其从您的站点中删除。

    虽然这应该卸载并删除所有与插件相关的文件,但请检查以下内容以确保插件没有剩余。

    Step3 – 删除Drop-ins插件

    激活WP Rocket插件时,它还会安装“advanced-cache.php”文件。这是一个带有单个php文件的插件插件,您可以在“插件 > 已安装插件 > Drop-ins”部分下看到该文件。如果您看到该文件仍然存在,请确保在删除WP Rocket插件后将其删除。

    WP Rocket插件Drop-ins

    WP Rocket插件Drop-ins

    Step4 – 删除缓存内容

    WP Rocket将在“/wp-content/”文件夹下创建两个文件夹,如果存在则应将其删除。

    • 登录到FTP并导航到“/wp-content/”文件夹。
    • 删除包含您网站上所有缓存页面的“/wp-content/cache/”文件夹。
    • 此外,删除包含所有插件设置的“/wp-content/wp-rocket-config/”文件夹。

    删除WP Rocket文件

    删除WP Rocket文件

    请注意,您也可以在此处删除“advanced-cache.php”插件文件。

    Step5 – 删除htacces条目

    WP Rocket在htaccess文件中添加了GZIP压缩浏览器缓存和许多其他指令。这些参数将覆盖服务器上可用的任何其他缓存设置。

    • 当您远程登录到服务器时,导航到WordPress安装的根目录。这通常应该是“/public-html/”文件夹,除非您在子目录中安装了WordPress。
    • 使用Visual Studio Code等代码编辑器应用程序查找并打开.htaccess文件。请记住,此文件可能不可见,因为它没有名称,只有扩展名。因此,您需要使隐藏文件在您的FTP软件中可见以便编辑文件。
    • 检查#BEGIN WP ROCKET和#END WP ROCKET块之间文件中存在的任何条目。您可以安全地删除块、保存文件并将修改后的文件上传回服务器。

    删除WP Rocket htaccess条目

    删除WP Rocket htaccess条目

    测试您的站点是否正常运行,以确保其他.htaccess条目没有问题。

    Step6 – 清理wp-config.php文件

    您还需要从WP Rocket插件创建的wp-config.php文件中删除一个条目。

    • 当您使用FTP登录到服务器时,导航到根安装目录。
    • 找到“wp-config.php”文件并使用代码编辑器进行编辑。
    • 检查以下行并将其删除。
    define(‘WP_CACHE’, true)
    define(‘WP_CACHE’, true)
    define('WP_CACHE', true)
    

    WP Rocket的WP配置条目

    WP Rocket的WP配置条目

    Step7 – 删除缓存的WebP图像

    WP Rocket允许您单独缓存WebP图像格式以提高加载速度。您需要从“/wp-content/uploads/”文件夹中检查并删除这些缓存的图像文件。如果您有生成WebP图像并将其存储在上传文件夹中的插件,则不需要此步骤。但是,许多托管公司不会将WebP图像存储在“上传”文件夹中。它们将即时生成WebP图像并直接提供给浏览器。在这种情况下,如果您启用了WebP缓存选项,插件将创建您在站点中上传的每个图像的副本。

    当您卸载WP Rocket时,这些缓存的WebP图片将变得多余且无用。您可以保留它们原样或删除它们以节省服务器上的存储空间。确保在删除WP Rocket缓存图像后测试您的服务器动态提供WebP图像。

    注意:您还可以使用主机帐户中的文件管理器应用程序删除和编辑文件,而不是使用FTP。

    Step8 – 删除数据库条目

    WP Rocket将在wp_options表中创建条目以存储设置和其他相关条目。同样,当您使用删除未使用的CSS功能时,该插件也会创建额外的表。

    • 登录到您的托管帐户并打开phpMyAdmin。
    • 找到您的数据库并导航到wp_options表。
    • 使用“rocket”搜索表格并删除您找到的条目。
    • 选择表“wp_wpr_rucss_resources”和“wp_wpr_rucss_used_css”并删除它们。

    小结

    如您所见,WP Rocket插件创建了许多条目和文件夹以提高速度。例如,启用删除未使用的CSS选项将在数据库中创建大表。不幸的是,您不会在插件的销售页面上找到这些详细信息。我们希望这篇文章能帮助您从您的WordPress网站上完全删除WP Rocket插件。