如何在docpad / markdown中突出显示一段代码

Question

我正在为我的博客使用docpad + markdown。我使用highlight.js plugin来格式化代码示例。格式化工作正常，关键字突出显示。现在，我想强调一些具有额外格式的代码块，例如：显示我与前一个区块相比所做的更改。

是否可以突出显示代码块的某些部分，例如

• 进行功能调用粗体
• 点击一些文字
• 制作一些文字红色

以下是Martin Fowler's blog的注意事项：

唯一的区别是我想保持关键字突出显示。

Answer 1

根据Docpad的list of Plugins，您有几个选择。我注意到下面列出的两个快速脱脂。可能还有其他我错过了。

1. Highlight.js Plugin
2. Pygments Plugin

如果你想自定义输出的外观，我怀疑你需要编辑Plugin使用的CSS。请参阅您选择的特定插件的文档。

例如，Highligh.js插件docs声明您需要单独下载样式表（这可以解释为什么OP没有使用该插件获得任何样式）。查看提供的列表和演示，并选择最适合您所需外观的样式。

下载CSS文件并保存到相应的目录。正如Docpad的docs所示，那将是src/render/styles/filename.css肯定会替换＆＃34; filename.css＆＃34;与文件的名称。正如文档所述：

  

然后，要将其包含在我们的页面中，我们会将default.html.eco布局中的样式块更新为：

<%- @getBlock("styles").add(["/styles/style.css"]).toHTML() %>

同样，请务必使用文件的实际名称。

要对所使用的颜色/样式进行任何调整，您需要编辑该CSS文件。请注意，Highlight.js提供了一个list of class names，您可以将其用于样式挂钩。找到与您想要调整的项目匹配的特定类名，并在CSS文件中查找该类的样式并进行编辑，直到您满意为止。

请注意，以上假设您使用的是默认设置和插件，如＆＃34;使用入门＆＃34; DocPad文档的页面。 YMMV。

如果您想突出显示更改，则需要创建diff更改，然后定义＆＃34;差异＆＃34;作为语言。然后，Highlight.js将使用diff突出显示器突出显示更改。不幸的是，没有办法同时突出显示语言和差异突出显示。换句话说，您可以突出显示关键字，也可以突出显示更改，而不是两者。

当然，您可以随时define使用自己的语言＆＃34;并使用Highlight.js register。但这超出了本论坛的范围。