SmallDeskSoftware 
Sponsor Link
ソースコード表示プラグイン
このサイトでは、ソースコード表示に Crayon Syntax Highlighter を使っていたのですが、たまに シンタックスハイライトが正常に行われないのが気になってました。
調べてみようと確認してみたところ、なんと 5 年くらい更新されていないプラグインでした。
ということで、新しいプラグインに切り替えて試してみます。
コード表示の要件
おそらく以下のプログラミング言語に対応していれば十分です。
- Swift
- Python
- Shell
- Objective-C/C/C++
あとは、コードのコピーが簡単にできるようになっていれば、より便利 くらいでしょうか。
上記の要件で探してみても 非常にたくさんあるのですが、まずは使ってみようということで1つ選んでみました。
Highlighting Code Block plugin
Highlighting Code Block という plugin を使ってみることにします。
Highlighting Code Block plugin のインストール
WordPress のダッシュボードから、”Highlighting Code Block” で検索してインストールするだけです。
Highlighting Code Block plugin の使い方
Gutenberg (グラフィカルに記事を編集できるエディタ）に対応しているらしく、Gutenberg での使い方は見つかるのですが、普通のテキストエディタでの
使い方は見つからなかったので、メモ。
タグ
コードをラップするタグは、少し長め。以下は、Swift コードを表示するためのコード
// Swift code here
struct MyStruct {
var newVar:Int
}
＜/code>＜/pre>＜/div>
# 一部タグの＜を全角文字にしてます。
言語が異なる時に変更する箇所 ２箇所
言語が異なる時に、変更すべき箇所は２箇所あります。
上記の lang-swift と Swift の箇所。
Prism というライブラリを使って、シンタックスハイライティングをしているためだと思われます。
- Swift -> lang-swift , Swift
- HTML -> lang-html, HTML
- Objective-C -> lang-objectivec, Objective-C
- Python -> lang-python, Python
表示例
先日使った、UnitTest のサンプルコードは、以下のような表示になります。
final class PomodoroModelTimerTest: XCTestCase {
func test_worktimerElapsed_workTimer_Elapsed() throws{
let fakeTimer = FakeDateProvider()
fakeTimer.timeInterval = 0
let sut = PomodoroModel(fakeTimer)
// start timer
sut.beginTimer()
// time is not fired yet
myTimer.timeInterval = 60*25 - 1 // (1)
XCTAssertFalse(sut.updateProgress()) // (2)
// 25 min should trigger
myTimer.timeInterval = 60*25 // (3)
XCTAssertTrue(sut.updateProgress()) // (4)
}
説明は以上です。
不明な点やおかしな点ありましたら、こちらまで。
関連記事:
Sponsor Link
