質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

RubyGems

RubyGemsはRubyによるプログラミングのためのパッケージマネジメントツールです。ユーザはこれを使用することで、Rubyライブラリのダウンロードやアップデートや、依存関係の自動解決が可能になります。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

Q&A

0回答

1791閲覧

rails6でMarkdown記法のシンタックスハイライトが効かない(redcarpet、coderay)

退会済みユーザー

退会済みユーザー

総合スコア0

Ruby

Rubyはプログラミング言語のひとつで、オープンソース、オブジェクト指向のプログラミング開発に対応しています。

Ruby on Rails 6

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

RubyGems

RubyGemsはRubyによるプログラミングのためのパッケージマネジメントツールです。ユーザはこれを使用することで、Rubyライブラリのダウンロードやアップデートや、依存関係の自動解決が可能になります。

Ruby on Rails

Ruby on Railsは、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。

0グッド

0クリップ

投稿2020/12/17 01:45

編集2020/12/17 01:50

前提・実現したいこと

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'

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問