念念不忘
必有回响

在WordPress中使用Google的AMP技术

在上周五APMCon大会上,Google的售前工程师专门讲了一节AMP技术,之前见过这个东西,但是不明白是什么,所以就没有在意,听闻这位工程师的“洗脑”后,决定了解一下,通过搜索得知WordPress已经完全支持AMP技术了,那么如何在WordPress中使用AMP技术呢?很简单的几个步骤就可以使用高大上的技术了。

一、在WordPress中安装AMP插件

在WordPress的后台中找到插件 -> 安装插件,在搜索插件中输入amp,点击搜索。如下图所示:

请注意,插件的作者一定是Automattic

二、点击现在安装

在安装完成后点击启用,此时,你的WordPress网站已经支持AMP这个高大上的技术了。为什么作者一定是Automattic呢,因为这个插件是这个作者和Google联合开发的,权威性比较高。并且口碑也不错,第一个插件我回头新建个站点尝试一下。

三、如何确认开启amp插件后,我们的WordPress已经支持AMP了呢?

在开启插件后,如果你的WordPress站点有各种缓存,请先清理缓存。清理完成缓存后,随便点开一篇文章,点击右键查看源代码,在源代码中能够看到下面的代码就表示你的站点已经支持AMP了。

<link rel="amphtml">

完整的标签为:

<link rel="amphtml" href="https://tvzr.com/install-thrift-on-macos.html/amp" />

那么此时,你可以通过文章目录后面新增/amp的方式来访问文章了,如上面的代码中href的值。如果你的文章URL是WP默认的,那么amp的方式应该是?amp=1。效果如下图所示:

当然,AMP主要针对的是移动页面,PC端的速度并不明显。

需要注意的是:Google AMP有非常严格的语法格式规范,任何错误都不会索引页面,因此要保证AMP页面正确才可以,不过这个不用我们操心,amp这个wordpress插件会自动产生AMP页面,排除可能的语法错误,为了保证页面可以使用amp,最好手动检查一下。检查的方法是在AMP页面的后面加上#development=1,然后打开浏览器的开发者工具功能,切换到Console,如果出现Powered by AMP就表示正确。

当然也可以通过在线网址验证器「The AMP Validator」进行验证, 打开网址后,将文章的地址粘贴进去,点击VALIDATE,即可进行验证,如果是绿色的PASS,就表示该页面没有存在任何错误语法。

想了解AMP的童鞋请点击 https://www.ampproject.org/zh_cn/

赞(0) 打赏
未经允许不得转载:码农志 » 在WordPress中使用Google的AMP技术
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏