WordPressブロックエディタの編集モードの使い方

ブロックエディタとは

WordPressブロックエディタは、WordPress 5.0から標準搭載された新しいエディタで、別名「Gutenberg(グーテンベルク)」とも呼ばれます。

主な特徴とメリットは以下の通りです。

  • 「ブロック」単位での編集: これが最大の特徴です。文章、画像、見出し、リスト、ボタンなど、記事を構成する様々な要素をそれぞれ独立した「ブロック」として扱います。これにより、それぞれのブロックを個別に編集、移動、削除、設定変更などが容易になります。
  • 直感的な操作性: HTMLやCSSの専門知識がなくても、ドラッグ&ドロップなどの直感的な操作で、複雑なレイアウトや装飾を簡単に実現できます。例えば、「左に画像、右に文章」といったカラム表示も簡単に作成可能です。
  • レイアウトのしやすさ: ブロックごとに位置調整やレイアウトの変更が簡単に行えます。カラムブロックなどを活用すれば、コンテンツ領域を複数に分割して配置することも可能です。
  • 効率的なライティング: 定型文などをブロックとして登録し、再利用できる機能も標準で備わっているため、効率的に記事作成が進められます。
  • 不要なタグの削減: ブロックごとに要素が設定されるため、従来のクラシックエディタで発生しがちだった余計なHTMLタグの挿入が減り、ページ表示速度の改善にも繋がる可能性があります。
  • カスタマイズ性: WordPressが標準で提供するブロックだけでなく、プラグインを導入することで、アコーディオン、モーダルウィンドウ、スライダーなど、より複雑な機能を持ったカスタムブロックも作成・利用できます。
  • SEOへの配慮: 見出しや特定のブロックにセクション構造を持たせることで、SEOに配慮した記事ページの制作も可能です。

従来の「クラシックエディタ」は、一般的なブログサービスの編集画面に似ており、HTMLやCSSを使った記述がしやすいという特徴がありましたが、ブロックエディタは、より視覚的に、そして直感的にコンテンツを作成・編集できることを目指して開発されました。

WordPressで記事を投稿・編集する際は、このブロックエディタが主なツールとなります。

ブロックエディタのメリット

WordPressのブロックエディタ(Gutenberg)は、WordPress 5.0から標準搭載された新しい編集機能で、多くのメリットがあります。

主なメリットは以下の通りです。

  • 直感的な操作と視覚的な編集:
    • 文章、画像、見出し、ボタンなどのコンテンツ要素を「ブロック」という単位で扱います。
    • ドラッグ&ドロップでブロックを自由に配置・移動でき、HTMLやCSSの知識がなくても直感的にレイアウトを調整できます。
    • 編集画面が公開後の表示に近い形でプレビューできるため、視覚的に確認しながら作業を進められます。
  • HTML/CSSの知識不要で高度なレイアウト:
    • 以前のクラシックエディタでは難しかった、画像とテキストの横並び(カラム表示)や、背景画像の上にテキストを配置する「カバー」ブロックなど、多彩なレイアウトを簡単に実現できます。
    • 余計なHTMLタグが自動で挿入されにくく、コードがクリーンになり、ページの表示速度向上やSEOにも良い影響を与える可能性があります。
  • 作業効率の向上:
    • 頻繁に使う定型文や特定のレイアウトを「再利用ブロック」として登録し、他の記事でも簡単に呼び出して使用できます。これにより、繰り返し作業の時間を大幅に短縮できます。
    • 各ブロックに固有の設定があり、例えば画像ブロックならサイズ調整やキャプション追加、段落ブロックなら文字寄せや色変更などが簡単に行えます。
  • 柔軟な拡張性:
    • WordPress標準のブロックだけでなく、プラグインをインストールすることでさらに多様な「カスタムブロック」を追加できます。これにより、より複雑な機能やデザインのコンテンツも簡単に組み込めます。
    • テーマによっては、ブロックエディタに対応した独自のレイアウトやデザインが用意されており、サイト全体の統一感を保ちながらコンテンツを作成できます。
  • 将来性:
    • WordPressの主要な開発はブロックエディタを中心に進められており、新しい機能や改善が継続的に追加されています。
    • 多くの新しいテーマやプラグインがブロックエディタに対応しており、今後もその傾向は続くため、長期的に見てもブロックエディタを使うメリットは大きいです。

これらのメリットにより、WordPressブロックエディタは、特にHTMLやCSSの専門知識がないユーザーでも、より自由で表現豊かなコンテンツを効率的に作成できるようになっています。

ブロックエディタのデメリット

WordPressブロックエディタ(Gutenberg)は、WordPressのコンテンツ作成方法を大きく変革しましたが、その一方でいくつかのデメリットも存在します。主なデメリットは以下の通りです。

1. 学習曲線:

  • 慣れるまでに時間がかかる: 従来のクラシックエディタに慣れていたユーザーにとっては、ブロックという新しい概念やインターフェースに慣れるまでに時間がかかります。特に、WordPressの初心者にとっては、ブロックの種類や設定項目が多く、混乱しやすい場合があります。
  • 直感性に欠ける場合がある: 一部のユーザーは、ブロックの配置や設定が直感的ではないと感じることがあります。特に複雑なレイアウトを作成しようとすると、目的のブロックを見つけたり、適切に設定したりするのに手間取ることがあります。

2. 互換性の問題:

  • 既存テーマやプラグインとの競合: 古いテーマやプラグインの中には、ブロックエディタに完全に対応していないものがあります。これにより、レイアウトの崩れ、機能の不具合、またはエディタが正常に動作しないといった問題が発生する可能性があります。
  • 移行の難しさ: クラシックエディタで作成された既存のコンテンツをブロックエディタで編集しようとすると、意図しない表示になったり、手動での調整が必要になったりすることがあります。

3. 柔軟性の制限(一部のケースで):

  • 細かなデザイン調整の限界: ブロックエディタは、あらかじめ用意されたブロックと設定を組み合わせるのが基本です。そのため、非常に細かく、自由なデザインを追求しようとすると、CSSなどの知識が必要になったり、カスタムブロックの開発が必要になったりする場合があります。クラシックエディタでHTMLを直接編集する感覚とは異なります。
  • 特定のレイアウトの実現: 複雑なグリッドレイアウトや、特定のカスタムレイアウトをWYSIWYG(見たままを編集)で実現しようとすると、思ったようにいかない場合があります。この場合、パターンや再利用ブロックの活用、あるいは外部のページビルダープラグインの併用を検討する必要が出てきます。

4. 動作の重さ・パフォーマンス:

  • 複雑なページでの動作遅延: 多数のブロックを使用したり、画像などのメディアファイルを多く挿入したりすると、エディタの動作が重くなり、ページの読み込みに時間がかかることがあります。これは、ブロックエディタがJavaScriptを多用しているため、ブラウザのリソースを消費しやすいことが原因の一つです。
  • サーバー負荷の増加: エディタの動作やプレビュー生成のために、サーバーへのリクエストが増えることがあり、共有ホスティング環境などではパフォーマンスに影響を与える可能性があります。

5. 機能の重複・複雑性:

  • 多数のブロックの種類: WordPressコア、テーマ、プラグインから提供されるブロックの種類が非常に多く、ユーザーはどのブロックを使えば良いか迷うことがあります。
  • 設定項目の多さ: 各ブロックには多くの設定項目があり、使いこなすまでに時間がかかります。これにより、シンプルにコンテンツを作成したいユーザーにとっては、かえって複雑に感じられることがあります。

これらのデメリットは、ブロックエディタの進化や、ユーザー側の慣れによって徐々に解消されつつあります。しかし、現状ではこれらの点がユーザーにとっての課題となる場合があります。

WordPressは使いやすい

WordPressは、一般的に使いやすいと言えます。

特に、以下のような点で評価されています。

  • 直感的な操作性: プログラミングの知識がなくても、見たままの操作で記事の作成や画像の挿入、レイアウト調整などがしやすいように設計されています。
  • 豊富な情報とコミュニティ: 世界中で最も使われているCMS(コンテンツ管理システム)の一つであるため、使い方に関する情報がインターネット上に豊富にあり、困ったときも解決策を見つけやすいです。
  • カスタマイズの自由度: 「テーマ」と呼ばれるテンプレートや、「プラグイン」という機能拡張のためのプログラムが豊富に用意されており、デザインや機能を追加・変更しやすいです。
  • 複数人での管理のしやすさ: ユーザー権限を設定することで、複数の担当者で分担してウェブサイトの更新・運用が可能です。

ただし、デメリットとして、以下のような側面もあります。

  • 初期設定の手間: サーバーやドメインの契約、WordPressのインストールなど、ブログサービスなどと比べると初期設定に手間がかかる場合があります。
  • セキュリティ対策の必要性: 世界的なシェアが高いため、攻撃の対象になりやすく、自身でセキュリティ対策(定期的なアップデートなど)を行う必要があります。
  • カスタマイズには知識が必要な場合も: 高度なデザインの変更や、特定の機能を実現するためには、HTML/CSSなどの専門知識が必要になることもあります。

コンテンツ(記事など)の更新が中心であれば、初心者の方でも比較的容易に始められるツールだと言えるでしょう。

有料WordPressテーマは使いやすい

有料のWordPressテーマは、一般的に使いやすいと言えます。

特に初心者の方にとっては、無料テーマよりも効率よく、質の高いサイトを構築しやすいというメリットが多くあります。

使いやすさに関連する主なメリットは以下の通りです。

  • プロが作ったデザインテンプレート: おしゃれで洗練されたデザインが最初から用意されており、手間をかけずに見た目の良いサイトが作れます。
  • 豊富な機能とカスタマイズ性:
    • SEO対策や高速表示など、サイト運営に重要な機能が標準で搭載されていることが多いです。
    • コードの知識がなくても、管理画面から直感的にデザインやレイアウトのカスタマイズができるテーマが多いです。
  • サポート体制の充実:
    • 初心者向けのマニュアルが充実していたり、購入者専用のサポートフォーラムやメールサポートが用意されていることが多く、困った時に安心です。
  • アップデートの保証: セキュリティ対策や新機能への対応など、テーマの定期的なアップデートが保証されているため、長く安心して使い続けられます。

ただし、有料テーマでも高機能ゆえに設定項目が多く、最初はどこから手を付けていいか戸惑う可能性もあります。

購入前にデモサイトマニュアルの充実度サポート体制などを確認し、ご自身の目的やスキルレベルに合ったテーマを選ぶことが重要です。

テーマ名主な特徴・強み適したサイト
ザ・トール (THE THOR)国内最高クラスのSEO最適化高速表示
プロ仕様の美しいデザインを簡単に実現(着せ替え機能あり)
アフィリエイトに役立つランキング作成機能CTAが充実<記事装飾機能が豊富で、読みやすいコンテンツ作成を支援
アフィリエイトブログ本格的なメディアサイト集客を重視するビジネスサイト
エマノン (Emanon)Web集客・ビジネス利用に特化した機能が豊富
CTA(行動喚起)、LP(ランディングページ)、メルマガ専用ページなどを簡単に作成
企業サイト、オウンドメディアに適したデザイン
WooCommerce対応でネットショップにも利用可能(Premium)
コーポレートサイト企業ブログオウンドメディアリード獲得を目的としたビジネスサイト
ストークSE (STORK SE)「誰が使っても美しいデザイン」を追求したモバイルファースト設計
シングルカラム(1カラム)レイアウトに特化し、コンテンツへの集中度が高い
ブロックエディタに最適化され、直感的な操作が可能
シンプルかつ洗練されたデザインで、汎用性が高い
商品・サービスのブランディングサイト、ミニマルな企業サイトシンプルで美しいブログ
リキッドプレス (LIQUID PRESS)用途別に豊富なテーマ(マガジン、コーポレートなど)が用意されている
高いSEO対策と構造化データ対応
多言語対応機能(LIQUID CORPORATEなど)
カスタマイザーでの直感的な編集が可能
メディアサイト(ブログ)、多言語対応が必要な企業サイト目的に合わせたテーマを選びたいサイト
有料WordPressテーマ