• RSS

[WP]Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

以前にソースコードをハイライト表示できるプラグイン「Crayon Syntax Highlighter」について紹介させていただきましたが、今回はCrayon Syntax Highlighter で特定の行を強調して表示する方法のご紹介です。

Crayon Syntax Highlighter プラグインのインストール

管理画面のプラグイン新規追加より Crayon Syntax Highlighter を検索するか、以下のページからプラグインファイルをダウンロードします。
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

Crayon Syntax Highlighter プラグインの基本的な使い方についてはこちらのページを参考にしてみてください。


Crayon Syntax Highlighter で特定の行をハイライト

Crayon Syntax Highlighter プラグインを有効にした状態で、記事の編集画面へ進み、エディタのツールバー上の「crayon」ボタンをクリックします。
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

「Add Code」ウィンドウが開きますので、「Code」欄にソースコードを入力します。
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

ソースコードの中で、特に強調したい行については「Marked Lines」欄に行数を指定して、
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

「Add Code」ウィンドウ右上の「Add」リンクをクリックします。
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

記事本文の<pre>タグにmark:2が追加されていることを確認し、
Crayon Syntax Highlighterでコードの特定の行を強調して表示する方法

記事を公開すると、↓このように指定した行が強調されて表示されます。





  • このエントリーをはてなブックマークに追加
  • follow us in feedly

コメント

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください