时间戳

首页 > 解决方案 > 用于 WordPress 的 Crayon Syntax Highlighter 在 AMP 页面上看起来很糟糕

wordpress - 用于 WordPress 的 Crayon Syntax Highlighter 在 AMP 页面上看起来很糟糕

问题描述

我有一个关于计算机科学的 WordPress 博客，问题是蜡笔语法荧光笔序列在 AMP 页面上看起来像这样：

在此处输入图像描述

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

标签： wordpresssyntax-highlightingamp-html

解决方案

第一部分是您要突出显示语法的代码的普通版本，它位于带有类的 a内的textarea框/字段中：divcrayon-plain-wrap

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

如何禁用该框

  1. 最简单的选项：只需访问插件设置页面（设置 -> Crayon），在该页面的常规 -> 代码部分下找到“启用纯代码视图和显示”字段，然后取消选中选项/复选框。

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

    • 如果您使用AMP插件，您可以像这样以编程方式添加 CSS：（将其添加到主题functions.php文件中）

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

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

使用其他 AMP 插件？

只需尝试使用该插件实现上面的第二个选项...

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

推荐阅读