Highlight code with Rouge

Rouge is a pure Ruby syntax highlighter. It can highlight over 200 different languages, and output HTML or ANSI 256-color text. Its HTML output is compatible with stylesheets designed for Pygments.

Rouge

Install Rouge

Gemfile
...
gem "rouge"

...

bundle

Configure Rouge in kramdown

app/helpers/application_helper.rb
module ApplicationHelper
  def render_content_from(page)
    erb_processed_content = render(inline: page.content, layout: false)
    Kramdown::Document.new(erb_processed_content, input: "GFM", syntax_highlighter: :rouge).to_html.html_safe
  end
end

Generate a CSS stylesheet

rougify style github > app/assets/stylesheets/rouge.css

Commit: Rouge

→ Optimize metadata for crawlers

← Style pages with classless CSS