Wordpress
PR

【WordPress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

susan
記事内に商品プロモーションを含む場合があります

WordPressが2018年のバージョン5.0にアップデートされた際、投稿の編集方法が大きく変化しました。

古いClassic Editorから、新しいブロックエディター、通称”Gutenberg”に切り替えられ、一部のユーザーはこの変更を歓迎しましたが、一方で新しい編集画面に戸惑う人も少なくありませんでした。

すーさん
すーさん

本記事では、このGutenbergの使い方と、なぜ一部のユーザーにとって使いにくいと感じられるのかを詳しく解説します。

WordPressを学ぶことができるおすすめのプログラミングスクール!
WordPress用のレンタルサーバーをお探しの方はこちらの記事がおすすめ

WordPressのプラグインについて

WordPressはその柔軟性で知られていますが、その柔軟性の大部分はプラグインによるものです。

プラグインはWordPressの機能を拡張するための追加ソフトウェアで、サイトのSEO最適化からソーシャルメディアの統合、画像スライダーの作成まで、あらゆる機能を追加することができます。

Gutenbergもこのプラグインの一つで、WordPressのデフォルトのエディター(編集ツール)として導入されました。

WordPressに最低限入れておきたいプラグインに関しては【WordPress】最低限インストールすべきプラグイン10選!知らなきゃ損!で詳しく解説していますので、ぜひチェックしてみてください。

あわせて読みたい
ワードプレス初心者が最低限入れておくべきプラグイン10選!インストール方法も解説
ワードプレス初心者が最低限入れておくべきプラグイン10選!インストール方法も解説

Gutenbergとは

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

Gutenbergとは、WordPressの投稿やページの編集を行える新しいエディターです。

その名前は印刷技術を革新したヨハネス・グーテンベルクから取られています。WordPress5.0から、デフォルトのエディターとしてGutenbergが採用されました

Gutenbergの特徴

このエディターの最大の特徴は、「ブロック」という概念を導入していることです。

Gutenbergでは、テキスト、画像、見出し、リストなど、すべてのコンテンツ要素が「ブロック」として扱われます

これらのブロックは個々に追加、削除、編集が可能であり、ブロックごとに配置や設定を調整することができます。これにより、直感的にページレイアウトを制作することができます。

Gutenbergの「再利用可能なブロック」概念

また、Gutenbergは「再利用可能なブロック」の概念も導入しています。

これは一度作成したブロックを保存し、他のページや投稿でも再利用することができるという機能です。

この機能により、一貫性のあるデザインと効率的な編集が可能になります。

しかし、その一方で、Gutenbergは初心者にとっては少々複雑に感じるかもしれません。

特に、Classic Editorから移行した人は、Gutenberg独特の操作方法やインターフェースに慣れるまでには時間がかかるかもしれません。

また、一部の古いテーマやプラグインとの互換性問題も報告されています。

すーさん
すーさん

それでも、Gutenbergのポテンシャルは非常に大きいです。自由度の高いレイアウトと効率的な編集が可能になるため、使いこなすことができれば、よりクリエイティブで高品質なコンテンツ制作が可能になります。

Classic Editorとの違い

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

GutenbergとClassic Editorの最大の違いは、前述の通り「ブロック」の概念です。

Classic Editorでは、全てのコンテンツは一つの大きな枠内に入力する必要があります。

一方、Gutenbergでは各コンテンツ要素が個々のブロックとして扱われ、それぞれが独立しています。

このため、Gutenbergは視覚的にコンテンツのレイアウトを調整することが簡単ですが、一方で操作が複雑になり、慣れるまで少々時間がかかる印象です。

Classic Editorの使い方に関しては【WordPressプラグイン】Classic Editorとは?使い方を徹底解説!で詳しく解説していますので、ぜひチェックしてみてください。

あわせて読みたい
【WordPressプラグイン】Classic Editorとは?使い方を徹底解説!
【WordPressプラグイン】Classic Editorとは?使い方を徹底解説!

GutenbergとClassic Editorの比較表

GutenbergClassic Editor
内容の表示ブロックベース一体型
コンテンツの自由度高い低い
ユーザビリティ初心者には難しいシンプルで直感的

Classic Editorに比べてGutenburgが使いにくい理由

Gutenbergエディタは、その新しい操作方法とブロックベースの設計により、多くのユーザーにとっては魅力的な選択肢となっています。

しかしながら、一部のユーザーにとっては使いにくいと感じる理由もあります。

Gutenburgが使いにくい理由
  • 学習曲線
  • 互換性の問題
  • パフォーマンス
  • 不必要な複雑さ

学習曲線

Gutenbergエディタの最大の障壁の一つは、新しいユーザーインターフェースとブロックベースの設計に慣れることが必要な点です。

特に、Classic Editorに慣れているユーザーにとっては、Gutenbergの操作方法を覚えるのは時間と労力を必要とするでしょう。

互換性の問題

古いテーマやプラグインとの互換性が完全には保証されていないため、Gutenbergを使用すると問題が発生する可能性があります。

これは、サイトの見た目や機能に影響を与える可能性があります。

パフォーマンス

Gutenbergはその高度な機能と自由度のために、Classic Editorよりもやや重いと感じることがあります

これは、特にスペックの低いデバイスやインターネット接続が遅い場合に問題となる可能性があります。

不必要な複雑さ

Gutenbergは多機能である反面、シンプルなブログ記事を書くだけであれば、ブロックを配置したり設定を調整したりすることは不必要な複雑さをもたらすと感じるユーザーもいます。

すーさん
すーさん

以上の理由から、一部のユーザーはGutenbergエディタを使いにくいと感じています。ただし、これらの問題点は使い方に慣れたり、適切なテーマやプラグインを選んだりすれば克服できます。また、WordPressの開発チームはこれらの問題を改善するためのアップデートを続けています。

ブロックエディタとクラシックエディタの違いについて詳しく知りたい方は【WordPress】ブロックエディタとクラシックエディタの違いを徹底比較!で具体的な解説していますので、ぜひチェックしてみてください。

あわせて読みたい
【WordPress】ブロックエディタとクラシックエディタの違いを徹底比較!
【WordPress】ブロックエディタとクラシックエディタの違いを徹底比較!

Gutenbergのメリット・デメリット

公式サイト
公式サイト

Gutenbergには主に以下のメリット・デメリットがあります。

Gutenbergのメリット

メリット
  • 自由度の高いレイアウト
  • 再利用可能なブロック
  • 直感的なビジュアルエディター

自由度の高いレイアウト

Gutenbergのブロックエディタは、テキスト、画像、動画、引用、リストなど、さまざまな種類のブロックを使用して自由にコンテンツをレイアウトできます。

これにより、ユーザーは技術的な知識がなくても、自由度の高いデザインのWebページを作成することができます

再利用可能なブロック

Gutenbergでは、特定のブロックを保存し、他の投稿やページで再利用することができます

これにより、一貫したデザインの維持と、コンテンツ作成の効率化が可能になります。

直感的なビジュアルエディター

Gutenbergのビジュアルエディタは、ブロックをドラッグ&ドロップで移動させることができ、また、ブロックの外観をリアルタイムでプレビューすることができます

これにより、エディタ上での操作が直感的でわかりやすくなります。

Gutenbergのデメリット

デメリット
  • 操作の複雑性
  • 互換性の問題
  • パフォーマンス

操作の複雑性

Gutenbergの操作は、特に初めてのユーザーやClassic Editorから移行するユーザーにとっては少々複雑に感じられるかもしれません。

ブロックの追加、移動、編集など、多くの新しい概念と操作方法を理解する必要があります。

互換性の問題

一部の古いテーマやプラグインはGutenbergと完全には互換性がなく、バグを引き起こす可能性があります。

この問題を避けるためには、テーマやプラグインを最新のGutenbergに対応したものに更新する必要があります。

パフォーマンス

Gutenbergエディタは、その機能性と柔軟性のために、Classic Editorに比べてやや重たいです。

これは、特にスペックが低いデバイスで作業する際に、パフォーマンスの低下を引き起こす可能性があります。

Gutenbergを使う前の注意点

Gutenbergを使用する前に考慮すべきいくつかの点があります。

注意点
  • 学習カーブ
  • 互換性
  • バックアップ
  • ブロックエディター
  • クラシックエディター

学習カーブ

Gutenbergエディターは、従来のWordPressのエディターとは異なる操作性とインターフェースを持っています。

操作方法を学ぶためには時間と練習が必要かもしれません。

互換性

古いテーマやプラグインがGutenbergと完全に互換性があるわけではないため、更新する前に必ず互換性を確認してください。

互換性のないテーマやプラグインを使用している場合、サイトの表示や機能に問題が生じる可能性があります。

バックアップ

Gutenbergへの移行前に、WordPressのウェブサイトのバックアップを作成することが重要です。

何か問題が発生した場合、バックアップから元の状態に戻すことができます。

ブロックエディター

Gutenbergはブロックベースのエディターであり、これによりユーザーはページや投稿をブロックと呼ばれる単位で構築します。

これらのブロックは、段落、見出し、画像、リストなど、さまざまな種類のコンテンツを表現します。

このブロックベースのアプローチに慣れるまでには時間がかかるかもしれません。

クラシックエディター

Gutenbergが好みに合わない場合や、既存のプラグインやテーマとの互換性に問題がある場合、クラシックエディターへの切り替えも可能です。

これにより、WordPressの旧式のエディターインターフェースを利用することができます。

以上の点を考慮しながら、Gutenbergを活用すれば、より直感的で柔軟性のあるコンテンツ作成をすることができます。

Classic Editorの使い方に関してはこちら

WordPressを学ぶことができるおすすめのプログラミングスクール!

Gutenbergのインストール方法

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

WordPress 5.0以降では、Gutenbergエディタはデフォルトとして組み込まれていますので、特別なインストールは必要ありません

しかし、Classic Editorを使用していたり、古いバージョンのWordPressを使用している場合は、以下の手順でGutenbergをインストールできます。

インストール手順
  1. WordPressのダッシュボードにログインします。
  2. 左側のメニューバーから「プラグイン」を選びます。
  3. 「新規追加」をクリックします。
  4. 上部の検索バーに「Gutenberg」と入力します。
  5. Gutenbergプラグインが表示されたら、「今すぐインストール」をクリックします。
  6. インストールが完了すると、「有効化」ボタンが表示されますので、それをクリックします。

これでGutenbergがインストールされ、有効化されます。

新たに投稿やページを作成する際、または既存の投稿やページを編集する際に、新しいGutenbergエディタが使用できるようになります。

ただし、一部の既存のテーマやプラグインがGutenbergと完全に互換性があるわけではないため、インストール後は適切に動作するかどうかを確認してください。

問題がある場合は、テーマやプラグインをGutenberg対応のものに更新するか、必要に応じてClassic Editorに戻すことも可能です。

Gutenbergの使い方

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

以下、Gutenbergの基本的な操作方法です。

基本的な操作方法

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?
基本操作
  • 新規投稿またはページの作成
  • タイトルの追加
  • ブロックの追加

新規投稿またはページの作成

WordPressダッシュボードの左側のメニューから、「投稿」または「ページ」を選び、「新規追加」をクリックします。

するとGutenbergエディタが開きます。

タイトルの追加

ページ上部の「タイトルを入力」欄に、投稿またはページのタイトルを入力します。

ブロックの追加

ページ上部の「+」アイコンをクリックすると、ブロックのライブラリが開きます。ここから、追加したいブロックを選びます。

ブロックはテキスト、見出し、画像、リスト、引用、ギャラリーなど、多岐にわたります。

ブロックの追加・編集方法

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

ブロックの追加

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

ブロックライブラリから適当なブロックを選んでクリックすると、そのブロックがページに追加されます。

また、ブロック間の「+」アイコンをクリックしても新しいブロックを追加することができます。

ブロックの移動

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

追加したブロックは、上下の矢印アイコンをクリックして位置を調整することができます。

ブロックの編集

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

追加したブロックをクリックすると、ブロック設定が右側のサイドバーに表示されます。

ここで、ブロックの設定を調整することができます。例えば、テキストブロックの場合、フォントの大きさや色、背景色などを設定できます。

ブロックの削除

wordpress-plugin, wordpress - 【Wordpress】Gutenberg(ブロックエディタ)の使い方。使いにくい理由とは?

ブロックを削除するには、ブロックを選択して右上の「・・・」アイコンをクリックし、開かれたメニューから「ブロックの削除」を選択します。

このように、Gutenbergエディタは直感的にブロックを操作してページレイアウトを作成できます。

ブロックの設定を調整することで、様々なスタイルの投稿やページを作ることが可能です。

ただし、その操作は初めてのユーザーにとっては少々複雑に感じるかもしれません。

慣れるまでに時間がかかるかもしれませんが、使いこなすと非常に便利なツールとなるでしょう。

まとめ

GutenbergはWordPressの新世代エディターであり、その自由度の高さが評価されていますが、その自由度が逆に操作を複雑にしてしまい、一部のユーザーにとっては使いにくいと感じることもあります。

しかし、その特性を理解し、適切に使いこなすことで、より自由でクリエイティブなページレイアウトを作成することが可能です。

Gutenbergの可能性を最大限に引き出すためには、継続的な学習と練習が必要です。

WordPressを学ぶことができるおすすめのプログラミングスクール!
WordPress用のレンタルサーバーをお探しの方はこちらの記事がおすすめ
Twitterからの読者コメントをお待ちしています。
ブログ更新の励みになります!
ABOUT ME
すーさん
すーさん
webデザイナー/webエンジニア
30代web業界未経験 →オーストラリアにIT留学 →現地インターンを1年半経験 →フリーランスwebデザイナー・エンジニアとして活動 →月収80万円達成!
記事URLをコピーしました