修复 AMP 页面错误

在 Google Search Console 的报告了，可以看到本站有一百多个 AMP 错误。主要就是 Invalid usage of AMP tags。这么多的错误，还是需要修正的。于是就做了如下的检查和修正。

在 Google Chrome 的开发者工具里的控制台内，查看这些 AMP 页面，只要网址加上 #development=1 就可以了。

看到的错误主要有四部分。

1） 在标签 a 里面，有 onclick 属性，这个是 AMP 无效属性。

2） 在标签 p 或者 span 内，有 style 属性，这同样是无效的。

3） 在标签 img 里面，有 style 属性，同样要去掉。

4） 标签 iframe， 要替换成 amp-iframe 标签。

修复的过程主要参考了这篇文章，没全部看，因为是日文的，看不懂，大概的参考了中间这一段。

在我的 AMP 模板中的写法是这样的。

    <mt:Ignore>regex_replace set the conversion list for the modifier</mt:Ignore>
    <mt:SetVarBlock name="regex1a">/img /g</mt:SetVarBlock>
    <mt:SetVarBlock name="regex1b">amp-img layout="responsive" </mt:SetVarBlock>
    <mt:SetVarBlock name="regex2a">/onclick=(.*)false"/g</mt:SetVarBlock>
    <mt:SetVarBlock name="regex2b">target="_blank"</mt:SetVarBlock>
    <mt:SetVarBlock name="regex3a">/span style(.*)">/g</mt:SetVarBlock>
    <mt:SetVarBlock name="regex3b">span></mt:SetVarBlock>
    <mt:SetVarBlock name="regex4a">/p style(.*)"></g</mt:SetVarBlock>
    <mt:SetVarBlock name="regex4b">p><</mt:SetVarBlock>
    <mt:SetVarBlock name="regex5a">/<iframe(.*)?></iframe>/g</mt:SetVarBlock>
    <mt:SetVarBlock name="regex5b"><amp-iframe layout="responsive" sandbox="allow-scripts allow-popups allow-same-origin allow-top-navigation"1></amp-iframe></mt:SetVarBlock>
     
    <mt:Ignore>EntryBody, conversion to specify the regex_replace modifier to EntryMore</mt:Ignore>
    <$mt:EntryBody regex_replace="$regex1a","$regex1b"  regex_replace="$regex2a","$regex2b" regex_replace="$regex3a","$regex3b" regex_replace="$regex4a","$regex4b" regex_replace="$regex5a","$regex5b"  replace='style="text-align: center; display: block; margin: 0 auto 20px;"',' '$>
    <$mt:EntryMore regex_replace="$regex1a","$regex1b"  regex_replace="$regex2a","$regex2b" regex_replace="$regex3a","$regex3b" regex_replace="$regex4a","$regex4b" regex_replace="$regex5a","$regex5b"  replace='style="text-align: center; display: block; margin: 0 auto 20px;"',' '$>

在上面的正则表达式的写法，可能未必是最好的，可以用 RegExr 工具来调试。

过一段时间再去看看 Google Webmaster 后台是否已经去除这些错误了。