はじめに
プログラミングスクールに通いながら、未経験でITエンジニア転職を目指しているごんにんごんです。
Ruby on Railsを用いてWebアプリケーションの実装を行なっているのですが、理解を深めるためにValidation
を深掘りしたいと思います。
・・・と、ここまで記載していて驚きの事実に気がつきました。
Validationに関するソースコードを載せたいんだけど、markdown方式のコードブロックを入れる書き方(コード部分を“`rubyで囲む)をしても、rubyの書式にならない。むしろちょっと装飾されて表示されてしまいます。
これは、追加CSSで<code>タグ
にエフェクトが入るようにしてしまったことが原因のようです。
markdown方式では、“で囲った部分を強調できるのですが、ソースコードのブロックを表示する“`rubyも、この“と同じだと認識されるのですね。
このままでは、ソースコードを入れれば入れるほど視認性が悪くなっていく・・・。
ということで、今回はキレイなソースコードを載せる方法について、紹介したいと思います。
こんなソースコードを載せたい
validates :title, presence: true
背景白だとこんな感じで載せたいです。
背景Darkもカッコいいですね。
こういった書式で表示できるプラグインを紹介します。
プラグイン<Highlighting Code Block>
今回使用したプラグインはこちらです。
Highlighting Code Block
`
https://ja.wordpress.org/plugins/highlighting-code-block/
簡単な使い方
まずWordPress管理画面からプラグインの新規追加を行いましょう。
プラグインを有効化した後、クラシックエディタの場合、上部のCode Block
プルダウンから入れたい言語を選びます。
例えばRubyを選択すると、ソースコードの入力欄が記事内に入ります。こちらのボックスにコードを入力します。これだけです。
validates :completed, inclusion: { in: [true, false] }
このプラグインを使ってやりたいこと
これでキレイなソースコードを差し込むことができるようになりました。
お次は、記述の途中だったValidationについて、ソースコードをモリモリ入れて書きたいと思います。
それでは、また。