javascript - Line numbers in Ghost code markdown blocks

Question

I would like to know how to show line numbers in rendered markdown code blocks, and specifically how to do this for the Ghost blogging platform. Bonus if you can also have it color the code based on language (in a way similar to what GitHub and others do). Thanks!

Answer 1

这篇文章提到（2013 年 10 月 11 日）：

我刚刚意识到 Ghost 已经支持 GitHub-Markdown 扩展。

所以基本上你可以通过在 {{! Casper 的主要 JavaScript 文件}} 放入：
/content/themes/casperdefault.hbs.

<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js">    
</script>

并在 Ghost 中使用以下 GitHub 降价：

```prettyprint lang-ruby require 'redcarpet' markdown = Redcarpet.new("Hello World!") puts markdown.to_html ```

上面的 Markdown 将生成以下 HTML 代码，然后由 Google Code Prettify 美化：

<pre>
  <code class="prettyprint lang-ruby">
    require 'redcarpet' 
    markdown = Redcarpet.new("Hello World!") 
    puts markdown.to_html
  </code>
</pre> 

---

从那里，您可以在“ google-code-prettify ”中阅读更多内容，其中解释了如何添加行号：

您可以使用linenums该类打开行号。
如果您的代码不是从第 1 行开始，您可以在该类的末尾添加一个冒号和一个行号，如linenums.

但是，我还没有测试过该类是否真的在生成<code>元素的属性中。

```prettyprint lang-ruby linenumber xxxx

Answer 2

我尝试了一切，但对我没有任何效果最后我在底部添加了这些行（由 google-code 建议），一切都开始工作了

<script>
    $(document).ready(function () {            
        $("pre").each(function () {
            if (($(this).html().split(/\n/).length - 1) > 3) {
                $(this).addClass('prettyprint linenums:1');
            }
        });
    });
 </script>

也许它可以帮助任何人！