広告 WordPress関連

WordPress5.4.1・Gutenbergトラブル顛末記

スポンサーリンク

 

Gutenberg

Gutenberg

使い難さから、Gutenbergエディタを使うことを敬遠し、今までWordpress4.9.10を使っていました。 管理画面のWordpress5.4.1に更新を促す表示が気になり、「Classic Editorプラグイン」を使えば従来通りのクラシックエディターとGutenbergのブロックエディターが切替えられるので、Wordpressバージョンを更新することにしました。 

いざGutenbergを使って見た所やはり使い難く、特にクラシックブロックで、文字がコピペできない致命的問題に気づきました。 1日以上費やし原因を調べたら「OnePress Image Elevator」プラグインに原因があることが分かりました。 その他、使用所感とその対応について紹介したいと思います。 なお「Classic Editorプラグイン」のサポート予定が2021年末までになっており、このページは慣れるためにGutenbergで記述しました。

­

スポンサーリンク

 

 

当ブログのWordpress環境

  • WordPress:5.4.1
  • テーマ:AFFINGER5 バージョン20200414
  • 主要プラグイン
    • 「OnePress Image Elevator」は停止(理由は後述)
    • 「TinyMCE Advanced」バージョン 5.4.0 (段落ブロック等で文章の部分選択で文字色の変更ができるようになっています
    • 「Classic Editor」バージョン 1.5
    • 「Gutenberg 用ブロックプラグイン」バージョン 20200113 (AFFINGER5用のプラグインです)

Gutenbergトラブル顛末

トラブル1.クラシックブロックで文字コピペできない

注意ポイント

Gutenbergエディターから従来のクラシックエディターに切り替えれば、文字のコピペは可能です。 Gutenbergエディターのクラシックブロックだけの事象です。

原因


  • step.1 全プラグインの停止を行う

    ペースト出来ないのは若しかするとプラグインが原因か?を疑い、試しに全プラグインを停止してみると、クラシックブロックで文字ペーストができる様になり、プラグインのどれか?に原因があることが判明


  • step.2 問題プラグインの特定

    今度は、順次プラグインを有効化して虱潰しに調べたところ理由は不明ながら「OnePress Image Elevator」プラグインが原因であることが判明。 このプラグインを停止させると正常にクラシックブロック中に文字のペーストが可能になりました。

    なお「OnePress Image Elevator」プラグインは、画像をコピーして簡単に投稿記事内にペーストでき非常に便利なプラグインの一つでした。 もし、このプラグインを停止すると、画像をアップロード作業が必要になってしまいます。


OnePress Image Elevator代替え対応策

対策ポイント

貼り付けたい画像をコピーした後、Gutenbergの画像ブロックを開きこのブロッグにCMD+V(Windowsの場合はCont+V)のショートカットを実行すると、なんと画像のペーストが行える様になっていました!! この画像ペーストで、メディア・ライブラリーに画像がエントリーされていますので、クラシックブロック内でも画像の使い回しができる様になります。

トラブル2.Jetpack by WordPress.comプラグインの連携 NG

ポイント

前記で、全プラグインの停止を行った後、Jetpackプラグインを有効化したらJetpakとの連携が出来なくなっていました。 アカウントのパスワードを求められ正しいと思われるパスワードを入れても連携NG。 仕方がないので、再度「新たにアカウント作成」を行ったところ、今まで通りJetpakとの連携ができました。 (新しいメールアドレスを設定する必要があり)

Gutenbergを使ってみて

今回、Gutenbergエディターを使用して気になった点と対応について以下に列挙します。

  • 画像の回り込みの解除ができない
    画像ブロックと段落ブロックで簡単に記事の回り込みはできるものの、回り込みの解除指定ができません。 この指定を行うには、まず関係するブロックをグループ化して、「高度な設定」で追加CSSにAFFINGER5のCSSクラス 「clearfix」を入力すればOKになります。
  • 段落ブロックでHTMLコードをペーストできない
    例えば 「HTMLとして編集」状態で<div>をコピーして、段落ブロックへのペーストが出来ません。 クラシックブロックはOKです。
  • 表ブロックの幅指定ができない(表の機能が少なすぎる)
    クラシックブロックの表を使う方がベターで更にAFFINGER5の書式タブで、横スクロールもできます。

  • カラムブロックの機能が少ない
    クラシックブロックでAFFINGER5のタグのレイアウトを使う方がベター

  • リストブロックの先頭の”点”の装飾機能が貧弱
    クラシックブロックでAFFINGER5の書式タブのリスト機能を使う方がベター

  • ブロック内でドラッグ・アンド・ドロップ(文章移動)ができない。
    文章を移動させるためには、一度カットしてからペーストする必要があります。

以上の様に、Gutenbergでは、ブロック内の制限事項が多々ある様です。 探し方が悪いかもしれませんが、ネットで調べても制限事項一覧など見当たりません。 Gutenbergの改善に期待したいところです。

また、Gutenbergを使ってみた所感として、
Gutenbergは色々な使いやすい機能があるものの、未だまだ、AFFINGER5の使いやすさ、機能の豊富さには敵わないと思いました。 Gutenbergを使うならクラシックブロックを多用して、AFFINGER5の機能を利用することになりそうです。

Gutenbergの良いところ

Goodポイント

投稿する前に「HTMLエラーチェッカー」(Chromeの拡張機能にインストール)で、HTMLタグに誤りが無いかを確認しています。 Gutenbergエディターで「H 見出し」ブロックで区切り、その後にクラシックブロックを使えば、もしエラーがあった場合、クラシックブロック毎に調べることが出来ますのでHTMLエラーを見つけ易くなります。

なお現在、Chrome ウェブストア「HTMLエラーチェッカー」のページに不具合が発生して404ページになっているようです。

以上、Gutenbergトラブル顛末記でした。 今後どのようにGutenbergが改善されて行くか見守って行きたいと思います。。

 

スポンサーリンク

 

スポンサーリンク

 

t