※当サイトはアフィリエイト広告を利用しています

WordPressのコードブロックでインデントが詰められてしまう問題の解決方法

2022年4月15日IT

WordPressのコードブロックでインデントがきかない

コードブロック

上記のようにWordpressの記事作成画面でコードブロックを作成し、
インデントをちゃんと入力した状態で記事を作成します。

記事画面

記事を作成するとなぜかインデントが詰められてしまう問題が発生しました。

WordPressのコードブロック以外でも同じ現象が発生します。
Luxeritasテーマで使用可能なシンタックスハイライター
・Wordpressプラグイン「Highlighting Code Block」 

上記2つもソースコードのインデント・余白が詰められます。

NG:コードブロックでインデントがきかない問題の解決法

追記&訂正


Luxeritasの作者様からコメントを頂きました。
Luxeritas側でタブやインデントを詰める処理は入っていないとのことです。


コメントを頂いた後、プラグインを調査した結果、
あるプラグインが原因と判明しました。

間違っている解説

WordPressの設定でHTML圧縮をしているのであれば、
それを解除することでインデントが回復します。

使用しているテーマによって設定箇所が異なるので、
僕が使用しているLuxeritasの例を解説します。

管理画面 → Luxeritas → カスタマイズ → 圧縮・最適化 と進んでいき、
HTMLの圧縮率を「圧縮しない」に設定すればOKです。

ちなみにLuxeritasの高速化一括設定の推奨設定ボタンを押下すると自動的にHTMLの圧縮設定が入るので注意してください。

Luxeritas → 高速化一括設定 → 推奨設定 を押下するとHTML圧縮されます

コードブロックでインデントがきかない問題の原因と解決策

原因

AddFunc Head & Footer Code というプラグインを有効にした状態で、
LuxeritasのHTML圧縮を行うとインデントが崩れるようです。

解決策

AddFunc Head & Footer Code を無効にしたらHTML圧縮設定をしてもインデントが機能しました。

AddFunc Head & Footer Codeはヘッダーやフッターにコードを挿入できるプラグインです。
Luxeritasの場合、自前でその機能があるのでAddFunc Head & Footer Codeを入れる必要はなさそうです。

解決策は「AddFunc Head & Footer Codeを無効にする」でOKでした。

まとめ

WordPressのコードブロックやシンタックスハイライターでインデント・余白が機能しなくなったら、
AddFunc Head & Footer Codeというプラグインが入っている状態で、
HTML圧縮しているかどうか確認するとよいです。

2022年4月15日IT

Posted by raishin