用于WordPress的蜡笔语法突出显示在AMP页面上看起来很糟糕

Question

我有一个有关计算机科学的WordPress博客，问题是AMP页面上的蜡笔语法突出显示序列如下：

因此它们加倍。如何删除第一部分（可调整大小的部分）？我在几乎所有使用此插件的AMP网站上都看到了这个东西，我认为这是一个大问题。谢谢！

Answer 1

第一部分是语法突出显示的代码的纯文本版本，它位于textarea框/字段内部的div中，该类crayon-plain-wrap：

<div class="crayon-plain-wrap">
  <textarea wrap="soft" class="crayon-plain ..." ...>
    plain/non-formatted code here...
  </textarea>
</div>

如何禁用该框

1. 最简单的选项 ：只需访问插件设置页面（设置->蜡笔），找到“ 启用普通代码视图并显示“代码”部分下的“ em>”字段，只需取消选中选项/复选框即可。

2. 当请求是当前页面的AMP版本时，使用自定义CSS隐藏div 。

   • 如果您使用AMP插件，则可以通过编程方式添加CSS，如下所示：（将其添加到主题的functions.php文件中）

     add_action( 'amp_post_template_css', function(){
         echo '.crayon-plain-wrap { display: none; }';
     } );
     

     或仅复制CSS代码（即.crayon-plain-wrap { display: none; }）并将其放在适当的位置。

使用其他AMP插件吗？

只需尝试使用该插件实施上面的 second 选项...

但是，如果您需要进一步的帮助，请告诉我。