キーボード、ワードプレスと書かれた紙

【ブログ初心者必見】ワードプレスでスタイル変更が表示されない時の対処法

どうも、おとさんです。


WordPress(ワードプレス)5.xから標準となったGutenberg(ブロックエディタ)ですが最近ブログを始めたばかりの私は違和感なく使えています。しかしネットで使用方法を調べたりする時に思うのが自分の使っているエディタと違う!ということです。ちなみに私は「THE THOR」を使用しています。

ブロックエディターではスタイル変更などは使えない

調べてみるとネットで私が見たのは旧エディタのもので今だと基本的には使えないようです。したがってそのままでは文字装飾があまり使えません。それだと寂しいので調べてみると次のような方法がありました。

  • 旧エディタに戻す(プラグイン「Classic Editor」を使用)
  • エディタの機能を拡張(プラグイン「Advanced Editor Tools (previously Tiny MCE Advanced)」を使用
  • ブロックの追加でクラシックを使用する

「Classic Editor」を使用する

旧エディタに戻すのは私的にはあまりメリットがありません。せっかくブロックエディタの使い方を少しだけ覚えたのに。さらに旧エディタのサポート期間は2021年までとなっています。別のプラグインを使用することで2021年以降も使用することができるようですが。

「Advanced Editor Tools (previously Tiny MCE Advanced)」を使用する

次に「Advanced Editor Tools (previously Tiny MCE Advanced)」を使用する場合です。これだとブロックタイプまたはスタイルの変更の項目にクラシックを追加でき、より簡単に使用することが出来ます。またデフォルトでクラシックを選択できるようになります。「Classic Editor」でも同じことですがあちらだとブロックエディタとの併用はできません。

問題は「Advanced Editor Tools (previously Tiny MCE Advanced)」が「THE THOR」とは相性が悪いプラグインとされていることです。あとで削除するとなるとあまり使いたくはありません。

ただきちんと導入できるまでかなり迷ったので手順を公開したいと思います。必要な方は参考にして下さい。(あくまで自分が成功した方法なので正しいかはわかりません)

「Advanced Editor Tools (previously Tiny MCE Advanced)」を追加

プラグインの新規追加で「Advanced Editor Tools (previously Tiny MCE Advanced)」をダウンロード、有効化します。(画像が小さいですが全てクリックで拡大します)

プラグイン画面

各種設定

設定から「Advanced Editor Tools (previously Tiny MCE Advanced)」を選びスタイルコマンドをエディタメニューにドラッグアンドドロップで追加します。

設定画面

設定画面2

ブロックエディタタグの方で実行してください。サイトによっては旧エディタタグにて実行するようになっていますがそれだと反映されませんでした。

各種チェックボックスはデフォルトのままでよかったと思います。他にフォントサイズ、フォントファミリーもメニューに追加した方がよいと思います。なぜサイトによって違うのかわかりませんが私はこのくだりで3日ほどなやみました(´;ω;`)

ブロックの追加でクラシックを使用する

文章など追加する際に左上のブロックの追加を選択し、さらにメニューが開くのでその中のクラシックを選択します。そうすると旧エディタのメニューが開きます。しっかりとスタイルコマンドが存在します。

ブロックの追加ボタン
ブロックの追加の内容

クラシックメニュー

このやり方の問題はブロックエディタで書き始めたものを途中からクラシックに変更することができないことです。またブロックへの変換を選択してしまうと元には戻せません(もしかしたら自分ができないだけかもしれません)エディタ上では装飾はすべて消えますがサイト上では残っています。

まとめ

いずれにしても現時点で「THE THOR」における新旧エディタの使い分けは少しめんどうなようです。しかし豊富な文字装飾が使える事を考えればしょうがないですかね。さらなるアップデートに期待したいです。

余談ですが私はプラグインの相性の悪さを知らず「Advanced Editor Tools (previously Tiny MCE Advanced)」を使用してスタイルコマンドを出すことに時間をかけ成功したものの最後にガッカリするという悲しい体験をしてしまいました。

間違いがあったり他に良い方法がありましたら教えて下さい。
最後まで読んでいただきありがとうございました。

スポンサーリンク
キーボード、ワードプレスと書かれた紙
最新情報をチェックしよう!
>40代挑戦ブログ

40代挑戦ブログ