概述
什么是AMP？
去年10月， Google宣布AMP作为一项开源计划，旨在提供更快的移动网络浏览。 如TechCrunch所述 ，许多人将AMP视为Google试图与Facebook的Instant Articles和移动应用程序更好地竞争的原因，后者越来越提供更快，更简化的浏览。 我倾向于同意。
使用AMP优化的页面将显示在Google搜索结果顶部的移动浏览轮播中，从而将传统HTML文章降级到页面下方。 而且它们几乎会立即加载。
老实说，我对博客作者和小型发布商对AMP持怀疑态度。 我们经常撰写出色的内容，以使其无法在Google搜索结果中脱颖而出。 现在，我们必须在有限的资源上实施另一种技术，希望我们的内容出现在顶部。 有趣的是，虽然出现了大型媒体发布者，但我在AMP搜索结果中没有看到博客文章， 其他WordPress博客作者也没有 ：
我还怀疑将其他搜索结果隐藏在轮播下的用户体验将对Google很好。
当我在Microsoft工作时，我在1995年帮助启动了MSN新闻，这是MSN在线网络的一部分，该网络随Windows 95一起启动，这是Microsoft对AOL的回答。 MSN News需要一个自定义的应用程序查看器，该查看器必须在Microsoft Media Viewer平台的版本上运行，该框架已使他们早期的CD内容工作成为可能。 但是，在一年之内，我们不得不为网络做准备，并与NBC合并，后来合并为MSNBC.com。 我们必须定制我们的发布框架以同时生成Media View和HTML。 这产生了许多新的复杂性。
AMP使我想起了所有这些努力。 它是完全不同的，高度受限制HTML版本，需要对网站和您可能正在使用的任何广告进行大量更改。
免费的WordPress AMP插件
好消息是WordPress已经推出了免费的AMP插件，可帮助您实现AMP，而无需进行大量额外开发。 但是，它有很多限制。 您网站的设计受到严重限制，并且与其他WordPress插件，常见的优化技术等存在冲突。 AMP现在也将成为WordPress主题开发人员的额外负担。
AMP尚处于起步阶段，我感到失望的是Google选择创建一个全新的框架，而不是与发布商合作来优化HTML5，以便更快速地配置页面的加载方式，首先加载的内容以及如何快速布置文本。 这本来是一种更开明的方法。 但是后来Google团队才华横溢 。
尽管有我的担忧，但在本教程中，我将指导您安装适用于WordPress的AMP插件和适用于AMP插件的Yoast SEO Glue，这使您可以更好地控制网站的最终外观。
AMP在WordPress上看起来像什么？
这是与原始HTML页面相比的AMP页面的示例。 您可以动态浏览它们， 在这里可以找到原始 版本 ， 在这里可以找到AMP版本 。 当然，使用AMP可以更快地加载页面。
JeffReifman.com上 原始HTML5页面的 图像 ：
将以下链接标记添加到<head>块内的每个页面，告诉搜索引擎该页面的AMP版本可用。
<link rel="amphtml" href="http://jeffreifman.com/2016/01/28/a-new-business-model-for-twitter/amp/" /></head>但是，还有一个规范链接定义了用于链接的源页面URL：
<link rel="canonical" href="http://jeffreifman.com/2016/01/28/a-new-business-model-for-twitter/" /> JeffReifman.com上 AMP页面的 图像 ：
菜单和导航不见了，品牌也不见了（尽管有一些选择），但是页面加载很快。
让我逐步引导您使用WordPress激活AMP。
AMP WordPress插件
您可以从WordPress插件目录中学习并下载AMP WordPress插件 。 或者，您可以直接从WordPress仪表板搜索并安装它。
只需转到“ 插件”>“添加新项”并搜索AMP。 然后，点击立即安装 ：
安装后，点击激活 ：
激活后，只需使用/amp/扩展名访问WordPress博客上的任何帖子。 例如， Amazon Marketplace Fraud Made Easy帖子是我最受欢迎的Google搜索结果之一。 在http://jeffreifman.com/2014/03/25/amazon-makes-fraud-easy-in-marketplace/amp/中访问AMP版本时的外观如下：
Yoast SEO和AMP插件的胶水
WordPress的通用AMP插件提供了一些自定义功能。 Yoast SEO员工已经为其受欢迎的插件创建了一个附件，可进一步增强对AMP的支持。
您可以查看适用于Yoast SEO和AMP插件的Glue ，或者像我们之前对AMP插件所做的那样，通过WordPress仪表板安装它。 激活后，它应如下所示：
注意：请确保先安装 Yoast WordPress SEO插件 。
您可以通过Yoast SEO侧边栏菜单修改AMP设置-单击菜单底部的AMP ：
您将看到Glue插件可以用来改进AMP实现的各种方式。
首先，Yoast允许您将AMP功能扩展到页面和其他WordPress页面类型。 AMP默认情况下仅更改对时间敏感的帖子，它主要用于新闻文章：
注意：如果在标签下方看到空白页，请确保更新了原始的Yoast SEO插件，并且应该对此进行了修复。
其次，Yoast提供了一些有用的方式来定制品牌，设计和配色方案：
最后，它们提供了一种放置自定义AMP风格的Analytics代码的方法。 这并不像看起来那么简单。 请注意，我必须在下面粘贴代码才能使其正常工作：
我在这里找到了用于实施Google Analytics（分析）的AMP版本； 只需为您的网站自定义您的帐户代码：
<amp-analytics type="googleanalytics" id="analytics1">
<script type="application/json">
{
"vars": {
"account": "UA-xxxxxxxx-x"
},
"triggers": {
"trackPageview": {
"on": "visible",
"request": "pageview"
}
}
}
</script>
</amp-analytics>我相信随着AMP插件功能的发展，Yoast将随着时间的推移继续更新其Glue插件。
总体而言，这很容易上手。 但事实并非如此。
调试AMP错误
安装AMP几天后，我收到了来自Google Search Console的友好电子邮件，报告有10页错误。 但是实际上，我网站上的所有AMP帖子都被破坏了。
我登录到Google Search Console来浏览有错误的页面，并看到以下内容：
我单击了以下页面之一：
然后，我单击“ 打开页面” ，然后更详细地查看了错误。 本质上，您可以通过向URL添加/amp#development=1来手动完成此操作，例如： http : //jeffreifman.com/2014/02/24/how-to-secure-your-mac-from-potential-theft / amp /＃development = 1 。 然后，在浏览器中打开JavaScript控制台：
事实证明，由于以下错误，我在JeffReifman.com上所有启用AMP的网站页面都被破坏了： 除特殊形式外，不允许使用标签“脚本” 。 但是，在PublishingwithWordPress.com上，没有错误：
在即将举行的Envato Tuts +系列中，我将介绍如何自定义JeffReifman.com以使其Google PageSpeed达到100 。 这要求使用W3 Total Cache的自定义功能将一些最小化JavaScript功能放在</body>之前的页面底部附近。 AMP不允许这样做，而WordPress AMP插件无法将其过滤掉。
<script type="text/javascript" src="http://c4.jeffreifman.com/wp-content/cache/minify/000000/68b0b/default.include-footer.952e41.js?d4992f"></script></body> 我需要做更多研究以确定W3 Total Cache是否会为某些路径（例如/amp/ （对我而言）将其关闭（或者不太可能），或者是否需要找到其他解决方案。 将这些脚本备份到<head>会破坏我的Google Page Speed。 有趣的是，我最近还发现，在我的网站上使用Google DFP广告投放也会破坏Google Page Speed。 Google是具有挑战性的搜索大师，而且很难同时使用其所有技术。
我只想知道更重要的是：Google Page Speed排名，AMP支持或我的开发和调试时间。
收盘时
坦白说，我不确定您博客的AMP页面是否会在搜索顶部附近看到亮点，或者我不确定您是否可以在不进行其他自定义的情况下成功从中赚取很多收益。 Google似乎正在为主要媒体发行商量身定制AMP，使其拥有可以最佳地优化品牌，美学和收入的资源的资源。
本质上，AMP是通往开源社区的有价值的，经过优化的网络之路，而Facebook的Instant Articles是针对“大”围墙花园的精英选择的。 我更希望看到Google用附带的脚本在HTML5中构建优先加载模型。
对我而言，AMP只会使小型出版商更难保持相关性。 我很高兴WordPress一直在努力提供帮助，我敢肯定主题设计者也会这样做，但是仍然存在许多缺点。 我认为Google在帮助最大的网络发行商之外的任何人方面都没有兑现这一标记。
相关链接
- AMP项目文档常见问题解答
- AMP WordPress插件
- Yoast SEO AMP插件的胶水
- 引入“加速的移动页面”项目，以实现更快，更开放的移动网络（Google博客）
- Google宣布加快移动网页项目，为您带来快速加载文章（TechCrunch）
- Facebook开始托管发布者的“即时文章”（TechCrunch）
翻译自: https://code.tutsplus.com/tutorials/installing-amp-in-wordpress--cms-26272
最后
以上就是故意斑马为你收集整理的在WordPress中安装AMP的全部内容，希望文章能够帮你解决在WordPress中安装AMP所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复