【WordPress】行間が詰まらない!安全なクラシックエディタの外し方

8月 7, 2019

WordPressのブロックエディタ(Gutenberg)は、使ってみるとなかなか快適。

そこで、当ブログもブロックエディタに変更しようと思ったのですが、一つ問題が。


クラシックエディタを停止してしまうと、過去の記事を更新した時に行間が詰まってしまうんですね。

そこで今回は、行間の詰まらないクラシックエディタの安全な外し方を紹介します。

ブロックエディタで行間が詰まる理由

クラシックエディタでは、行間に (non-break-space)を入れて改行しています。

コピペするときは の&を半角文字に変えてください
うさぎ

ところが、クラシクエディタからブロックエディタに変換すると は消えてしまうんです。

なので、ヘタをすると全記事の行間を空ける作業を強いられることになってしまいます。

ブロックエディタを導入する前に行間を維持する対策を施しましょう!

行間を維持するには、全記事に入っている をブロックエディターの行間の書き方に変更すれば大丈夫です。

全記事を変えるのは大変だと思うかも知れませんが、プラグイン「Search Regex」を使えば、一瞬で全記事を変更してくれます。

Search Regex の使い方

注意

「Search Regex」は古いプラグインです。

万が一に備え、必ずバックアップを取っておいてください。

バックアップ用プラグインのオススメは「All-in-One WP Migration」です。

Search Regexのインストール

まず「Search Regex」をインストールして有効化します。

プラグインのインストール方法が分からない方は、下の記事を参考にしてみてください。

Search Regexで置き換え

有効化までできたら、WordPressのメニューの「ツール」 から「Search Regex」をクリックします。

設定は不要なので、次の項目を2箇所入力してください。コードは下に貼っておくのでコピペしてください。

Search pattern

  (&は半角文字に変えてください)

Replace pattern

<div style="height:40px" aria-hidden="true" class="wp-block-spacer"></div>

入力完了後、「Replace & Save」をクリックすると、あっという間にデータの書き変えが終わります。

念のため、投稿ページを確認してみてください。

下の画像のように&nbsp;がコードに置き換わっていれば成功です。

これでクラシックエディターを停止しても行間は詰まりません。

行間の調整

クラシックエディターを停止した後、行間を確認します。

適切な行間は各サイトの文字サイズによって違うので、必要な場合は調整してください。

「Search Regex」に入力したコードの40pxの部分が行間の高さになります。

調整するときは、上記の40pxコードを「Search pattern」に入力し、60pxなどにコードを変更して「Replace pattern」に入れます。

このとき60pxだけではなく、必ず全てのコードを入力してください。

調整が済んだら、プラグイン「Search Regex」を外しても大丈夫です
うさぎ

まとめ

今回は、クラシックエディターの安全な外し方を紹介しました。

僕もブロックエディターに変えて、最初はいろいろと戸惑いましたがすぐに慣れました。


クラシックエディターは無くなることが分かっています。

ブロックエディターにしようか迷っている方は、早めに慣れてしまったほうが得だと思います!

プラグインの記事一覧