Syntax highlighting markdown code blocks in Jekyll (without using liquid tags)

别说谁变了你拦得住时间么 提交于 2019-12-17 15:27:11

问题


It seems like syntax highlighting in Jekyll is limited to using liquid tags and pygments like so:

{% highlight bash %}
cd ~
{% endhighlight %}

But I've imported my existing blog from wordpress and it was written in markdown (using markdown code blocks) and I don't want to have to go through each post and fix the code blocks. Also, I want to keep my posts in pure markdown format in case I ever need to switch blogging platforms again.

I switched my Jekyll parser to redcarpet with the hope that I could use this markdown syntax:

```bash
cd ~
```

But it doesn't seem to work. It just wraps it in a normal code block. Any ideas?


回答1:


Fenced blocks were introduced with Redcarpet 2. Jekyll now supports Redcarpet 2.

As an aside I am using Redcarpet with Rouge until Kramdown support is available.

In addition some people prefer Nanoc to Jekyll.




回答2:


Alternate solution

Markdown allows HTML, so if you don't mind adding a bit of JS, you could do this:

## A section

Here is some Ruby code.

<pre>
  <code class="ruby">
    puts "hello"
  </code>
</pre>

Then you could use Highlight.js (documentation here) to add highlighting based on that class.

It's not an ideal solution, but it should work with any Markdown parser.




回答3:


I ended up switching to kramdown to parse markdown which comes with coderay for syntax highlighting. This has the benefit of being a pure ruby solution which works on heroku.




回答4:


Step 1. Install Redcarpet.

gem install redcarpet

Step 2. Update the build settings in your _config.yaml like this.

# Build settings
#markdown: kramdown
markdown: redcarpet



回答5:


In latest jekyll support code blocks, but if you use older version, you need to hack.

How about below? Try to add below's file as your _plugin/triple-backtick.rb

module Jekyll
  class MarkdownConverter
    alias :old_convert :convert
    def convert(content)
      content.gsub!(/(?:^|\n)```(\w*)\n(.*\n)```\n/m) do |text|
        cls = $1.empty? ? "prettyprint" : "prettyprint lang-#{$1}"
        "<pre class=\"#{cls}\"><code>#{$2}</code></pre>"
      end
      old_convert(content)
    end
  end
end



回答6:


Redcarpet is integrated integrated into Jekyll by default and code highlighting will function as expected.

For older Jekyll blogs:

  1. Install redcarpet gem:

    gem install redcarpet

  2. Update _config.yaml

    markdown: redcarpet
    

For reference and further info see:

Closed Github Issue

Updated Jekyll Codebase




回答7:


I've described 2 alternative solutions to adding properly formatted code snippets to your Jekyll driven site. http://demisx.github.io/jekyll/2014/01/13/improve-code-highlighting-in-jekyll.html. They do not rely on 3-rd party plugins and compatible with free GitHub Pages hosting.




回答8:


So I ran into this problem as well and after banging my head around a lot of places finally realised with official redcarpet2 support in Jekyll this is pretty simple. Write this in your _config.yml

# Conversion
markdown: redcarpet
highlighter: pygments
redcarpet:
  extensions: ["no_intra_emphasis", "fenced_code_blocks", "autolink", "strikethrough", "superscript"]

Make sure that you have pygments css file and it is included. THIS STEP IS IMPORTANT.

You can read my blog post http://blog.championswimmer.in/2015/10/jekyllsyntax-highlighting-in-github-favoured-markdown-codeblocks/ for details.




回答9:


You can also use the triple-tilde syntax:

~~~ruby
class Base
  def two
    1 + 1
  end
end
~~~

which is supported by Kramdown (Jekyll).



来源:https://stackoverflow.com/questions/8648390/syntax-highlighting-markdown-code-blocks-in-jekyll-without-using-liquid-tags

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!