前提・実現したいこと
redcarpet、coderayを使ったマークダウン記法の導入
発生している問題・エラーメッセージ
マークダウンの実装はできたが、マークダウン記法で投稿してみると、ソースコードの部分のみ色がついていない
該当のソースコード
application_helper.rb
ruby
1module ApplicationHelper 2 require "redcarpet" 3 require "coderay" 4 5 # 言語での記述(シンタックスハイライト)の導入(coderay) 6 7 class HTMLwithCoderay < Redcarpet::Render::HTML 8 def block_code(code, language) 9 language = language.split(':')[0] 10 11 case language.to_s 12 when 'rb' # rbもrubyで認識 13 lang = 'ruby' 14 when 'yml' 15 lang = 'yaml' 16 when 'css' 17 lang = 'css' 18 when 'html' 19 lang = 'html' 20 when '' 21 lang = 'md' 22 else 23 lang = language 24 end 25 26 CodeRay.scan(code, lang).div 27 end 28 end 29 30 # マークダウン形式の導入(redcarpet) 31 def markdown(text) 32 options = { 33 filter_html: true, # htmlを出力しない 34 hard_wrap: true, # マークダウン中の空行をhtmlに置き換え 35 space_after_headers: true, # # と文字の間にスペースを要求 36 } 37 38 extensions = { 39 autolink: true, # <>で囲まれてなくてもリンクを認識 40 no_intra_emphasis: true, # 単語中の強調を認識しない 41 fenced_code_blocks: true, # フェンスのあるコードブロックを認識 42 strikethrough: true, # ~ 2つで取り消し線 43 superscript: true, # ^ の後ろが上付き文字 44 tables: true, # テーブルを認識 45 underline: true, # 斜線(* *) 46 highlight: true, # ハイライト(== ==) 47 quote: true, # 引用符(" ") 48 footnotes: true, # 脚注( ^[1] ) 49 50 # 今回は不使用なので、間違ってるかも。こんなんもあるらしい程度。(詳細は、https://github.com/vmg/redcarpet) 51 xhtml: true, # xhtml タグ出力(Render::XHTMLでは常に有効) 52 lax_html_blocks: true, # HTMLブロックの上下の空行を不要にする 53 lax_spacing: true, # HTMLブロックの空行を不要にする 54 no_images: true, # img 要素を無効化 55 no_links: true, # a 要素を無効化 56 no_styles: true, # style 要素を無効化 57 safe_links_only: true, # 安全なリンクだけ出力 58 disable_indented_code_blocks: true, # 通常のマークダウンを認識しない。(行の先頭にある4つのスペースを持つテキストのコードブロックへの変換を無効化( fencedcode_blocks: true と一緒の使用推奨)) 59 escape_html: true, # HTMLタグをエスケープ。最優先され、:no_styles、:no_links、:no_images、:filter_html などは、削除ではなく、エスケープされる。 60 with_toc_data: true, # リンクの許可のため、出力HTMLのヘッダーにHTMLアンカー追加する 61 prettify: true, # prettyprintクラスを<code>google-code-prettifyタグに追加。 62 link_attributes: true, # リンクに追加する追加属性のハッシュ。 63 } 64 65 renderer = Redcarpet::Render::HTML.new(options) 66 markdown = Redcarpet::Markdown.new(renderer, extensions) 67 68 markdown.render(text).html_safe 69 end 70end 71
show.html.erb
ruby
1<h1><%= @post.title %></h1> 2<div>記事URL:<%= @post.public_uid %></div> 3<div><%= markdown(@post.content).html_safe %></div> 4<br> 5<%= link_to '一覧に戻る', posts_path %> 6
補足情報(FW/ツールのバージョンなど)
参考サイト:https://qiita.com/kaino5454/items/8b810ebc2d5236b8f812
参考サイト:https://qiita.com/hkengo/items/978ea1874cf7e07cdbfc
他に使っているgem
ruby
1gem 'rails-i18n' 2gem 'public_uid' 3gem 'redcarpet', '~> 2.3.0' 4gem 'coderay'
あなたの回答
tips
プレビュー