WordPressのコードプレビュープラグイン「Highlighting Code Block」をDiverというテーマで使うと、下記の画像のようにデザインが意図せず書き換えられてしまう。
本来右上に表示されるはずの言語名も出ないし、なんか色も変で見にくい。
後日確認したら直ってた。意味わからん。
console.log('hoge');
対処法
あきらめて「Code Snippets」という類似プラグインを使う
Code Snippets
たぶん、CSSがテーマとぶつかっていることが原因と思われる。
Code Snippetsの使い方
インストールして有効化
投稿画面で、
[code lang="言語名"
]
コード
[/code
]
のように書けば、ハイライト(色)付でコードがプレビューされる。
例
[code lang="php"
]
<?php
echo “Aho”;
?>
[/code
]
ショートコードとして登録
AddQuicktagをインストールして、ショートコードとして登録すると便利
AddQuicktag
設定>AddQuicktag を開く。
画像のように設定する。
「並び順」は、数字が小さい順に並ぶので、よく使うものを若い数字にしておくと便利。
投稿画面を見ると、エディターに追加されているはず。
うまくいかない場合
もし出なかったら、Diver側で制限がかかっているので、この記事を見て。
もし、大なりなどの記号が勝手に「&gt;」とかの意味不明な文字列に置き換えられる場合は、この記事見て。