清理 WordPress 主题 HEAD 部分和不需要的 JS 和 CSS 文件

已发表: 2018-09-04

无论您是否愿意，WordPress 的核心广告都会在网站的 HTML head部分中投放大量代码。该代码远非无用，并且在大多数网站上都有用。但是，如果您是一个干净的代码狂或使用 WordPress 为 SaaS 提供支持，您将需要清理 HTML。与 WP 中的大多数内容一样，只需删除一些操作和过滤器即可。

#WordPress 是构建#SaaS 网站的绝佳平台。但在你这样做之前，它需要一些清洁。

点击推文

为什么我要删除 HEAD、CSS 或 JS 文件中的这些标签？

有几个原因。有些人喜欢保持他们的代码和网站尽可能整洁。如果您知道不需要它并且知道如何删除它，为什么还要在 HTML 中编写一行代码。没有任何理由。额外的 CSS 和 JS 文件也是如此。如果您不在您的网站上使用表情符号，为什么要在每个页面上都包含该 JS？

然后是安全。 WordPress 自动添加的一些 HTML 确实显示了过去被利用的 URL。我必须强调，这些 URL（尤其是 XML RPC 端点）并不是秘密。他们应该是公开的。但是，将它们更改为定制的东西并隐藏它们是一种已知的做法。在这种情况下，很明显您不希望 HTML 中包含这些 URL。

速度也是清理 HTML 的一个正当理由。虽然我不得不说我不确定从 HTML 中删除几百个字符会获得多少收益，但这是朝着正确方向迈出的一步。消除不需要的 JS 和 CSS 文件将为您节省一些 HTTP 请求，这是您应该重点优化的内容。 Tidy Repo 最近测试了 100 多个 WordPress 主题的速度，请求的数量对网站的整体速度产生了重大影响。

拥有干净的 HTML 代码可确保您了解网站上发生的情况，并且是优化网站速度的良好开端。

最后但并非最不重要的一点是，我们可以方便地使用此代码的原因是 WordPress 驱动的 SaaS。在构建 SaaS 时，您希望完全控制 HTML 中的内容，而 WP 本身添加到 HTML 中的大部分内容并不是您将要使用的。因此，出于上述所有原因 - 我们尽可能地清理事物。这为我们提供了一个出色、精益的平台来构建自定义解决方案，同时仍保留 WP 用于支持 SaaS 的 99% 的核心功能。

我可以安全地移除这些东西吗？他们不是有目的吗？

是的，它们确实有目的，但仅在某些情况下。在“普通”网站上，标题中的一些额外link标签不是问题，它们都使某些操作和集成更容易。但是，它们对于任何站点的运行都不是至关重要的，当然对于 SaaS 也不是。

让我们清理一些代码

您可以使用任何主题测试下面的代码。默认的 2017 就可以了。然而，如果你使用的是“普通”的 WordPress 主题（以及一些插件），你永远无法知道是谁添加了代码——WP 核心、主题或插件。我建议您重置您的网站以删除所有插件，然后使用其中只有wp_head()和wp_footer()的主题。下面是 index.php 的外观，以及可用于测试的整个测试主题。

<!DOCTYPE html>
<html>
<head>
  <?php
    wp_head();
  ?>
</head>
<body>
  <h1>The Most Basic WP Theme</h1>
  <?php
    wp_footer();
  ?>
</body>
</html>

如果您激活我们的测试主题并打开首页源代码，您会注意到比上面 index.php 中可见的代码要多得多。这就是我们要清理的。将下面的代码放在主题的functions.php中。如果您不想删除/禁用某个功能，请注释掉提及它的行。

add_action('after_setup_theme', 'cleanup');

function cleanup() {
  remove_action('wp_head', 'rsd_link');
  remove_action('wp_head', 'wp_generator');
  remove_action('wp_head', 'feed_links', 2); 
  remove_action('wp_head', 'feed_links_extra', 3);
  remove_action('wp_head', 'index_rel_link');
  remove_action('wp_head', 'wlwmanifest_link');
  remove_action('wp_head', 'start_post_rel_link', 10, 0);
  remove_action('wp_head', 'parent_post_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link', 10, 0);
  remove_action('wp_head', 'adjacent_posts_rel_link_wp_head', 10, 0);
  remove_action('wp_head', 'wp_shortlink_wp_head', 10, 0);
  remove_action('wp_head', 'print_emoji_detection_script', 7);
  remove_action('wp_head', 'rel_canonical');
  remove_action('wp_head', 'rel_alternate');
  remove_action('wp_head', 'wp_oembed_add_discovery_links');
  remove_action('wp_head', 'wp_oembed_add_host_js');
  remove_action('wp_head', 'rest_output_link_wp_head');
  
  remove_action('rest_api_init', 'wp_oembed_register_route');
  remove_action('wp_print_styles', 'print_emoji_styles');
  
  remove_filter('oembed_dataparse', 'wp_filter_oembed_result', 10);
  remove_filter('pre_oembed_result', 'wp_filter_pre_oembed_result', 10);
  
  add_filter('embed_oembed_discover', '__return_false');
  add_filter('show_admin_bar', '__return_false');
}

做什么做什么

rsd_link操作负责显示真正简单的发现链接，而wp_generator显示 WP 版本，几乎所有为 WP 编写的安全插件都将其删除。这两个feed_links操作将各种链接添加到几个 RSS 提要。各种_rel_link操作将链接添加到帖子，以便各种服务更容易访问和找到它们。除非您使用的是 Windows Live Writer，否则您真的不需要wlwmanifest_link操作。我们不需要表情符号，所以print_emoji_detection_script可以运行，各种oembed链接也是如此，包括对 REST API 中的 oembed 的支持。删除oembed_dataparse操作将确保 WP 不会弄乱您帖子中的任何链接，也不会通过 oembed 将它们变成任何富媒体。最后一个过滤器show_admin_bar将阻止 WP 管理栏显示在您的前端，无论每个帐户的设置如何。

#WordPress 中只有少数内容无法通过操作和过滤器进行修改。值得庆幸的是，控制 HEAD 内容不是其中之一。

点击推文

WordPress的灵活性很棒

许多文章都带有诸如“如何从 WP 标题中删除垃圾”之类的标题。这不是垃圾。它为 WordPress 提供了开箱即用的强大功能。许多人重视这一点，他们不必花费数小时进行设置。另一方面，清理只是删除一些操作的问题。您可以完全控制放入 HTML 的内容，并且可以轻松地使用 WordPress 为非内容网站（如 SaaS）提供支持。