如何在WordPress中实现Google AMP

网络在不断发展。对于许多企业主来说，这意味着他们需要跟上谷歌的所有变化。如果你不适应，就意味着你可能会落后。谷歌AMP是他们加快网络速度的移动计划。本文将分享如何在WordPress中开始使用Google AMP的一些步骤，以及新平台的一些优缺点。

Google AMP是什么？

Google AMP的优势

谷歌放大器的缺点

如何在WordPress中设置Google AMP

验证您的Google AMP代码

Google AMP是什么？

Google AMP(加速移动页面项目)最初于2015年10月启动。这个项目依赖于AMP HTML，这是一个完全基于现有网络技术的新的开放框架，它允许网站构建轻量级网页。简而言之，它提供了一种方法来提供当前网页的简化版本。

从第一天起，AMP就专注于速度。这可以说是移动网络最令人沮丧的事情之一——谷歌最近的研究证实了这一点，研究显示，53%的人会在三秒或更短的时间内离开一个无法加载的网站。这对于用户、商家、发布商、网站以及整个移动网络来说，都是最坏的情况。—谷歌公司项目负责人大卫·贝斯布里斯

根据Akamai最新的在线零售业绩报告，每十分之一秒都很重要。即使页面加载时间稍微增加到2.8秒，转化率也会下降2.4%。

与移动速度和转换率的相关性

在过去的一年中，许多大公司都采用了Google AMP，包括WordPress、Reddit、易贝、Pinterest、Washington Post、Wired、Gizmodo等。根据谷歌的数据，Slate的每月独立访客增加了44%，而独立访客的访问次数每月增加了73%。

当一个页面通过Google中的AMP提供时，它旁边会有一个AMP符号，如下面的纽约时报演示所示。请注意，您必须在移动设备上进行测试。也可以使用Chrome devtools中的设备模拟器。结构化数据标签允许谷歌在搜索结果中更突出地显示你的内容。例如，包含适当标签属性的AMP文章可能在SERP中获得令人垂涎的传送带位置，如下所示。

谷歌AMP旋转木马

这是纽约时报网站上的AMP页面示例。如你所见，它非常基础和简单，这正是AMP的目标。这确保了它可以快速加载并提供更好的可用性。

Google AMP页面示例

与任何新平台一样，你应该权衡利弊，决定它是否适合你的业务和/或网站。

Google AMP的优势

AMP是免费和开源的。

AMP绝对可以提高你的WordPress网站的加载时间。记住，速度是排名因素。

SERP中更好的展示位置，有轮播的可能，以获得更好的点击率。在与流行出版商的实施中，Google AMP的点击率达到了600%！

Google AMP实施了许多推荐的Web性能实践，比如防止大型CSS和JS框架。

可能会对你的转变产生积极的影响。

在过去的一年中，谷歌做了许多改进，现在谷歌AMP中的广告选项很容易获得。这意味着杂志和新出版物可以保留甚至增加其AdSense收入。

自动图像优化(甚至转换成WebP格式！)

AMP Lite为慢速网络连接引入了进一步的优化。谷歌的字节数总共减少了45%。

谷歌放大器的缺点

AMP目前不是排名因素，但以后可能会。这个可以看利弊。

如果不是开发人员，AMP可能很难实现和测试。然而幸运的是，WordPress平台比其他平台更容易。

引入了你必须担心的新的独立平台和特性。简单地优化我们的移动网站发生了什么？

可能会以负面的方式伤害或影响你的转变。

据报道，Google AMP搞乱了Google Analytics中的统计数据。

有的人参与度更差，跳出率更高。

是可能仍然不受支持的第三方脚本和应用程序。

不支持一些较旧的浏览器，如Internet Explorer 11。他们表示，一般来说，他们将支持Chrome、Firefox、Edge、Safari和Opera等主要浏览器的2个最新版本。它们支持桌面、手机、平板和相应浏览器的web view版本。

阅读Jan Dawson关于为什么Google AMP使网络发布变得更难而不是更容易的观点。

阅读Alex Kras关于Google AMP的一些问题的文章，以及Google AMP项目技术总监的回应。

Tim Kadlec分享了他对Google AMP的看法，以及对更好的替代方案的需求:内容绩效战略。

截至2017年2月，Google AMP已经开始显示直销商的网址。之前，它只显示了从缓存中提供服务的Google版本。这就从品牌的角度引发了人们的担忧。好在谷歌也意识到了这一点，做出了改变。现在，浏览器的URL字段将继续显示Google URL。但是，AMP标题区域会显示一个链接或链图标，即所谓的“锚点”按钮。点击此按钮将显示发布者的直接URL，以便于复制和粘贴。这仍然不是一个完美的解决方案，但总比没有好。

Img src: Google开发者博客

这是又一个失去品牌的例子。

不使用谷歌的另一个原因是你失去了你的品牌cc @HuffingtonPost。你可能会考虑pic.twitter.com/n3LEHIOEBZ.

–赛义德·巴尔基(@赛义德·巴尔基)2017年1月19日

另外需要注意的是，如果唯一存在的移动版页面是AMP版，那么即使Google将其索引切换到移动优先索引，Google仍然会使用桌面版进行索引。

所以@ maileoheye证实，在有桌面和AMPs的情况下，Google会首先为移动设备索引桌面。#搜索状态

–詹妮弗·斯拉格(@詹士达)，2016年11月14日

如何在WordPress中设置Google AMP

幸运的是，现在在WordPress中实现Google AMP比六个月前容易多了。WordPress插件和整个平台都有了很大的进步。但是请记住，您的代码必须经过Google验证，才能在SERP中显示您网站的AMP版本。该插件会将你的文章转换成AMP版本，但谷歌决定显示AMP版本。

基本上，它的工作原理是你的WordPress文章被分配了不同的URL。所有这些都是由WordPress插件自动处理的。通常是/amp还是/？Amp将附在您当前的文章中。下面是一个例子:

原博文网址:https://domain.com/blog-post

AMP博客文章的网址:https://domain.com/blog-post/amp/

Google AMP相关的WordPress插件

插件库中目前有2个流行的WordPress插件，可以帮助你使用Google AMP设置它们。第一个是免费的官方AMP插件，其实是Automattic的团队开发的。

Automattic的官方Google AMP插件

在撰写本文时，它目前有超过200，000个活跃安装。你可以从WordPress插件库中下载，或者在WordPress仪表盘的“安装插件”下搜索。您可以在“外观放大器”编辑器下稍微定制外观(如下所示)。但是这个插件的选择非常有限，要看你是否知道如何实现AdSense或者Analytics等功能的其他过滤器。

WordPress AMP样式

另外需要注意的是，它只支持文章，不支持页面。虽然他们已经宣布正在努力增加这一功能。下面是安装插件后我们的WordPress文章的一个例子。

WordPress放大器预览

如果你想要一个简单的方法来添加额外的功能，那么这就是WP插件的AMP for WP发挥作用的地方。这基本上是一个更高级版本的官方AMP插件，并为您提供额外的功能和支持。它是由Ahmed Kaludi和Mohammed Kaludi开发的，他们也经营着一家成功的WordPress主题商店。

WordPress的WP放大器

在撰写本文时，它目前有超过70，000个活跃安装。你可以从WordPress插件库中下载，或者在WordPress仪表盘的“安装插件”下搜索。这个插件允许你使用谷歌放大器设置进行更多的定制。另外，它确实支持页面。下面，我们将深入研究仪表板中AMP插件设置中可用的定制和功能。

你可以在这篇文章中看到AMP运行https://kinsta.com/blog/google-amp/amp/.(更新:kinsta从9月初开始不再运行AMP。查看关于您为什么选择禁用Google AMP的案例研究。)你可以在下面Kinsta博客帖子的SERP中看到一个例子。可以看到AMP的logo。

SERP中的Kinsta放大器示例

常规

在常规屏幕下，您可以添加一个徽标，自定义大小，并选择是否要在页面上启用AMP。根据您的网站和流量，您可能只想在您的博客(帖子类型)上启用AMP。

加速翻页的常规选项

主页

在主页下，您可以启用或禁用主页支持，覆盖主页缩略图大小，并选择当用户单击徽标时您希望发生的情况(转到非AMP版本的AMP版本)。

AMP主页

页面生成器

在页面生成器下，您可以启用它以允许使用AMP小部件。

AMP页面生成器

设计

在设计下，您可以启动文章构建器或从预先设计的模板中选择。你可以打开HTTPS进行搜索，也可以添加“立即通话”按钮。然后还有一个自定义CSS的选项。例如，在我们的网站上，我们添加以下代码来自定义标题的颜色:

.amp-wp-header {background-color:#5CC0C0;}

定制设计

文章页面

在Single下，你可以启用社交图标，禁用链接，显示作者简介，甚至更改相关文章的选项。

AMP文章页面

广告

在广告屏幕下，您可以启用AdSense并选择显示位置。这个插件是使用Google AMP添加AdSense的最简单的方法之一。对于那些依靠广告来运营网站的人来说，这是一个非常有用的功能。

放大器广告

AMP菜单

在菜单下，您可以选择是否在菜单URL的末尾添加/amp/也许你希望你的访问者停留在AMP功能的网站上，如果是这样，那么你会希望启用这个功能。

AMP菜单

社会化媒体

在“社交”菜单下，您可以添加要在移动设备上显示以供共享的社交网络。对于脸书，您需要注册一个免费的应用程序ID。

AMP社交

搜索引擎优化

SEO屏幕可能是最重要的屏幕之一，因为它与Google如何查看和排列您的AMP内容有关。我们建议启用元描述选项。如果你使用的是Yoast SEO插件，那么我们也建议启用“来自Yoast的Meta标签”和“ld+jason中的Yoast描述”选项。

AMP SEO选项

分析

分析屏幕允许您为谷歌分析和谷歌标签管理器添加跟踪脚本。您需要这样做，以确保您的报告数据是最新的。

放大器分析

它还支持细分分析、Piwik分析、Quantcast测量、comScore、Effective Measure、StatCounter、HitStats分析、Yandex Metrika和Chartbeat分析。

结构数据

结构化数据屏幕允许您自定义默认的结构化数据徽标和发布的图像。

AMP结构化数据

联系方式

联系人表单屏幕只允许您启用联系人表单7支持。

AMP联系人列表

通知

在通知屏幕下，您可以启用它来显示cookie警告。这可能对隐私法更严格的国家的人有用。

AMP通知

评论

在评论界面下，您可以启用对第三方评论系统的支持，如Disqus和脸书评论。

AMP评论

高级设置

在“高级设置”下，您可以启用移动重定向。记住，默认情况下，AMP只对从SERP点击它的移动用户启用。如果移动用户直接浏览您的网站，他们将无法获得启用AMP的页面，除非您启用重定向。您也可以在此屏幕上输入自定义HTML并更改页脚链接操作。

高级放大器设置

发展

开发人员还提供高级扩展，您可以购买这些扩展来进一步扩展AMP插件。你可能要考虑的一些流行选项是电子邮件选项、CTA按钮和自定义文章类型支持。

放大器扩展

这是WP运行AMP插件的文章外观。

WP放大器示例

AMP for WP的同一个开发者最近也发布了一个新的插件AMP WooCommerce，它允许你在电子商务商店中启用AMP。

AMP WooCommerce插件

验证您的Google AMP代码

在你的WordPress网站上安装Google AMP之后，你需要确保你的代码是经过验证的。如果没有，Google不会在SERP中显示AMP版本。你可以通过谷歌AMP验证工具运行你的WordPress网站。如果你通过或失败，它会在底部显示你。

Google AMP验证器

你也可以下载免费的Chrome AMP扩展，它将验证每个页面。如果它显示为红色，您可以单击它并快速查看页面上的错误或警告。

谷歌放大器错误

如果它没有通过验证，您可能会看到以下错误:“不是一个有效的AMP页”。在下面的示例中，这是由于使用了旧的、不受支持的HTML标记，以及。您可以查看AMP支持的HTML标签的完整列表。无效的AMP页面在Google搜索结果中将没有AMP特定的功能。

不是有效的AMP网页。

你也可以在谷歌搜索控制台的“搜索外观”部分下检查你的网站是否有AMP问题。需要注意的是，很多用户反映谷歌搜索控制台中的AMP报告延迟严重。大概是因为还是一个比较新的平台，爬的不那么频繁吧。

加速GSC的移动页面报告

如果你犯了一个错误，谷歌将通过电子邮件通知你，你需要添加所需的结构化数据到AMP页面。

误差放大器–GSC

谷歌AMP搜索引擎优化

你可能想知道的另一个方面是关于SEO的，因为你现在拥有同一个页面或帖子的两个副本。不需要担心内容重复，因为上面提到的两个插件都使用AMP的规范标签。标签告诉谷歌，原创内容是你的桌面版。Google会自动检测你网站上的AMP页面，因为你的原始页面有一个header标签，将Googlebot引导到你的AMP页面。

原始页面上的示例: