6

レンダリングされたマークダウン コード ブロックで行番号を表示する方法、特にゴースト ブログ プラットフォームでこれを行う方法を知りたいです。言語に基づいてコードを色付けすることもできればボーナスです (GitHub や他の人が行うのと同様の方法で)。ありがとう！

4

2 に答える 2

13

この投稿では、次のことが言及されています(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 は、Google Code Prettify によって整形される次の HTML コードを生成します。

<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
于 2013-10-21T06:14:26.513 に答える
1

私はすべてを試しましたが、何もうまくいきませんでした。

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

誰にでも役立つかもしれません！

于 2014-11-06T01:43:53.760 に答える