如何在 WordPress 中缩小 CSS / JavaScript 文件(2 种方式)

您想缩小 WordPress 网站上的文件吗?

缩小您的 WordPress CSS 和 JavaScript 文件可以使它们更快地加载并加速您的 WordPress 网站。

WordPress 中缩小 CSS / JavaScript
WordPress 中缩小 CSS / JavaScript

在本指南中,我们将向您展示如何在 WordPress 中轻松缩小 CSS/JavaScript 文件以提高性能和速度。

什么是缩小,什么时候需要?

术语“缩小”用于描述一种使您的网站文件更小的方法。 它通过从源代码中删除空格、行和不必要的字符来做到这一点。

下面是一个普通的 CSS 代码示例:

body {
margin:20px;
padding:20px;
color:#333333;
background:#f7f7f7;
}
h1 {
font-size:32px;
color#222222;
margin-bottom:10px;
}

缩小代码后将如下所示:

body{margin:20px;padding:20px;color:#333;background:#f7f7f7}
h1{font-size:32px;margin-bottom:10px}

通常,建议仅缩小发送到用户浏览器的文件。这包括 HTML、CSS 和 JavaScript 文件。

您也可以缩小 PHP 文件,但缩小它不会提高用户的页面加载速度。这是因为 PHP 是一种服务器端编程语言,这意味着它在将任何内容发送到访问者的 Web 浏览器之前在服务器上运行。

压缩文件的优势在于提高了 WordPress 的速度和性能,因为压缩文件的加载速度更快。

但是,一些专家认为,对于大多数网站来说,性能提升非常小,不值得费心。缩小只会删除大多数 WordPress 网站上的几千字节数据。您可以通过优化网络图像来减少更多页面加载时间。

如果您试图在 Google Pagespeed 或 GTMetrix 工具上获得 100/100 的分数,那么缩小 CSS 和 JavaScript 将显着提高您的分数。

话虽如此,让我们看看如何在您的 WordPress 网站上轻松缩小 CSS/JavaScript。

我们将介绍 2 种不同的选项供您选择:

  • 方法 1. 使用 WP Rocket 压缩 WordPress 中的 CSS/JavaScript(推荐)
  • 方法 2. 使用 Autooptimize 缩小 CSS/JavaScript

准备好? 让我们开始使用我们最推荐的方法。

方法 1. 使用 WP Rocket 缩小 WordPress 中的 CSS/JavaScript

这种方法更简单,推荐给所有用户。 无论您使用的是哪个 WordPress 主机,它都能正常工作。

首先,您需要安装并激活 WP Rocket 插件。 有关更多详细信息,请参阅我们关于如何安装 WordPress 插件的分步指南。

WP Rocket 是市场上最好的 WordPress 缓存插件。 它使您可以轻松地将缓存添加到 WordPress 并显着提高网站速度和页面加载时间。

有关更多详细信息,请参阅我们关于如何在 WordPress 中安装和设置 WP Rocket 的教程。

WP Rocket
WP Rocket
WP Rocket
WP Rocket

激活后,您需要访问设置 » WP Rocket 页面并切换到“文件优化”选项卡。

方法 2. 使用 Autooptimize 缩小 CSS/JavaScript

对于未使用 WP Rocket 的用户,建议使用此方法。

首先,您需要安装并激活 Autooptimize 插件。 有关更多详细信息,请参阅我们关于如何安装 WordPress 插件的分步指南。

激活后,您需要访问设置»自动优化页面来配置插件设置。

从这里开始,首先您需要检查 JavaScript 选项下的“优化 JavaScript 代码”选项。

Autooptimize
Autooptimize
Autooptimize
Autooptimize

我们希望这篇文章能帮助您缩小 WordPress 网站上的 CSS 和 JavaScript。

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注