Couple 使用 Prismjs 来实现代码高亮功能,你可以直接通过书写 Markdown 得到高亮代码,并且每行代码前可以显示行号。目前支持的语言列表如下:

  • Markup
  • CSS
  • clike(类似 C 语言风格)
  • Javascript
  • C
  • C#
  • C++
  • coffeescript
  • git
  • go
  • java
  • json
  • latex
  • lua
  • matlab
  • objective-c
  • php
  • python
  • R
  • sql
  • swift
  • Verilog
  • VHDL

来看些例子

没有行号的 CSS 代码

.pagination {
  display: inline-block !important;
  margin: 50px 0;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
  background-color: #555;
  border-color: #555;
}

若要得到以上效果,请在你的 Ghost 编辑器里输入:

```css
.pagination {
  display: inline-block !important;
  margin: 50px 0;
}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
  background-color: #555;
  border-color: #555;
}
```

请注意第一行和最后一行,其中的 css 就表示将该代码块作为 CSS 语言处理并高亮。

带行号的 Javascript 代码

$('a[href^="#"]').click(function(event){
    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href') ).offset().top
    }, 500);
    event.preventDefault();
});

要呈现带行号的代码块,请这样输入:

```javascript line-numbers
$('a[href^="#"]').click(function(event){
    $('html, body').animate({
        scrollTop: $( $.attr(this, 'href') ).offset().top
    }, 500);
    event.preventDefault();
});
```

注意第一行增加了 line-numbers,它表示这段代码需要展示行号。

有关每种语言应该输入什么类名请参见 Prismjs 官方维护的 Supported languages 页面。