如何使用官方 Google AMP WordPress 插件

已发表: 2020-02-13

网站速度在移动设备上比在浏览器上慢是很常见的，页面内容越丰富，加载所需的时间就越长。 即使您尝试了一些方法来加速您的网站，Google AMP 和 WordPress AMP 插件也可能为您提供所需的提升。

当网站加载时间过长时，它会提高您的跳出率。 另一方面，当网页几乎立即出现时，用户体验 (UX) 会得到改善，您的流量可能会增加。 以下是 Google AMP 的工作原理以及如何在您的网站上使用它。

Google AMP 概述

Google AMP 是一个开源项目，于 2015 年 10 月启动。AMP 代表“加速移动页面”，但 Google AMP 不再局限于移动设备； 今天，它也适用于桌面页面。 （不过，就本文而言，我将主要谈论移动页面，因为这是 AMP 最有用的地方。）Google AMP 的目的是让 Web 内容加载得更快。 WordPress AMP 插件是一种将页面转换为 AMP 版本的简单方法。

它的工作方式是 AMP 借助有限的 CSS、HTML 和 JavaScript 加快网页速度。 基本上，这是一种构建超轻网页的方法，可以减少加载时间。 Google AMP 缓存托管内容，缓存版本是 Google 发送给用户的内容，让他们可以立即查看网页。 Google、LinkedIn、Reddit 和 Twitter 等大型科技公司都支持 Google AMP，并且 AMP 可以在所有应用程序、浏览器和 Web 查看器上查看。

Google AMP 的优缺点

尽管大多数网站都将从 Google AMP 中受益，但它也有一些缺点。 以下是 Google AMP 的优缺点，可帮助您确定 WordPress AMP 插件是否适合您。

优点

  • 如果您从移动搜索中获得大量流量，AMP 可以改善用户体验并帮助您获得更高的排名。
  • 互联网连接缓慢的移动用户可以与您的网站互动。
  • Google 会缓存所有使用 AMP 框架的网站，这有助于提高 Google 排名。
  • 更快的加载时间会带来更好的参与度，这通常会带来更多收入。

缺点

  • 由于 AMP 使用有限的 CSS、HTML 和 JavaScript，网站设计人员必须创建精简的页面。 某些功能和小部件，如动画、社交媒体“喜欢”框和智能选择加入表单，必须减少膨胀。
  • Google AMP 支持 Google Analytics，但除此之外，它不支持大多数其他分析平台。
  • Google AMP 支持的广告选项也不多。 但是，使用其他插件，您可以添加广告选项——稍后会详细介绍。
  • 这是一个温和的骗局，但如果您的移动页面已经很轻且经过优化，则使用 AMP 可能不会明显加快它们的速度，因此设置它可能会浪费时间。

WordPress AMP 插件

移动优化

适用于 WordPress 的 Google AMP 插件会自动为您的所有帖子创建 AMP 版本。 然后，由于源代码中的“amphtml”，搜索引擎和支持 AMP 的应用程序和服务知道在哪里查找页面的 AMP 版本。 无论您使用的是经典构建器还是古腾堡，该插件都能与 WordPress 无缝协作。

该插件不会创建单独的移动主题，也不会将移动设备定向到您网站的 AMP 版本。 但是，如果移动访问者在 Google、Pinterest 或 Twitter 等平台上找到您的内容，他们将看到 AMP 版本。

如果无法呈现页面的 AMP 版本，该插件会确保加载非 AMP 版本。 这意味着网站将尽可能多地进行 AMP 优化，而对于网站中无法优化的部分，它们仍会根据您的需要显示和执行。

WordPress AMP 插件的功能

  • 兼容性和验证：如果无法自动转换为 AMP，您将收到详细的验证错误，以便您可以找到无效标记。 您可以选择删除或保留标记。
  • 核心主题支持： AMP 与所有核心 WordPress 主题兼容。 （它还与许多非核心主题兼容。）
  • CSS Tree Shaking：自动删除未使用的 CSS 以使总数不超过 AMP 50KB 限制。
  • AMP Stories： AMP 有一个 Stories 构建器，可让您为访问者创建全屏广告和体验。
wordpress 放大器插件

资料来源：AMP

如何设置和使用 WordPress AMP 插件

1.安装并激活插件。 在这里获取插件。

2. 转到外观并选择 AMP。 您将看到您的网站在使用移动设备时的外观，您还可以查看 AMP 桌面版本。 如果主页无法使用 AMP，您将收到以下通知：

移动优化

当网页转换为 AMP 时，它基本上是原始网页的精简版。 在下面，您可以将我的博客文章的原始版本与 AMP 版本进行比较——徽标（我的名字在风格化字体中）、颜色和字体都不同。

wordpress 放大器插件

3. 点击“设计”更新标题文本颜色、标题背景和链接颜色以及配色方案（浅色或深色）。 您还可以选择显示一个链接，让访问者退出阅读器模式。

wordpress 放大器

4. 您可以转到您网站上任何帖子的 URL 并在其末尾添加/amp/以查看该帖子的 AMP 版本。 如果您在尝试查看 AMP 版本时收到 404 错误，请转到“设置”，然后转到“永久链接”，然后单击左下角的“保存更改”。 您实际上不必进行任何更改，但通过单击保存按钮，您的永久链接结构将被刷新，这可以让这些 AMP 页面显示给您。

选择网站模式

WordPress AMP 插件具有三种网站模式可供选择，您可以通过转到左侧边栏中的 AMP 然后单击常规来访问这些模式：

  1. 标准： AMP 是您网站的框架。 您不需要单独的非 AMP 和 AMP 版本。
  2. Transitional每个页面都有一个规范 URL 和一个 AMP URL。
  3. 阅读器：每个页面都有一个规范 URL 和一个 AMP URL。 在阅读器模式下，AMP 仅用于单个帖子、页面和其他帖子类型； 其他两种网站模式在整个网站中使用。

默认情况下，将选择阅读器模式。 如果您更改为其他两个选项中的任何一个，您将无法再通过外观访问该“设计”部分。

您选择的网站模式将影响您拥有的其他选项。 如果您选择标准或过渡，您将在下面的屏幕截图中看到选项。 如果您选择阅读器，您将只能从三种内容类型中进行选择。

wordpress 放大器插件

使用附加插件自定义您的 AMP

由于 WordPress AMP 插件没有很多自定义选项，您可以使用其他插件来进一步个性化您的页面。 例如，AMP WP 支持社交图标并具有可自定义的配色方案（以及一系列其他功能），而 Ads for WP 具有对 AMP 的高级广告支持。

此外，如果您目前正在使用 Yoast SEO，您可以使用 Glue for Yoast SEO 和 AMP 插件，以便您的 AMP 页面拥有正确的 Yoast SEO 元数据。 安装并激活插件后，您将像往常一样设置 Yoast SEO 选项。 该插件将在后台发挥其魔力。

设置其他 AMP 相关插件后，请确保重新验证您的 AMP 页面。 这将检查以前不存在的任何新验证错误。

最后的想法

设置加速移动页面只是您可以用来加快网页加载速度的众多技术之一。 多亏了 WordPress 插件，您无需了解 AMP 工作原理的来龙去脉就知道它对您的网站有益。 通过如此简单的、为您完成的设置过程，您可以在一个下午安装它，并在几天内转换您的整个存档。

还有一件事：如果您使用 Google Search Console，如果您没有立即看到 AMP 页面的结果，请不要担心。 在索引您的 AMP 并显示数据时，Google 可能会花时间。

想要从您的移动网站中获得更多吸引力吗？ 查看我们关于如何使用 Divi Theme Builder 在移动设备上优化侧边栏的指南。

精选图片来自 Foaddesigns/shutterstock.com