ブロックエディターハンドブック

日本語版の情報については末尾を参照してください。

こんにちは 👋 ブロックエディターハンドブックへようこそ。

ブロックエディターは、WordPress のサイト構築と公開のためのモダンな最新パラダイムです。コンテンツの構成とフォーマットにブロックによるモジュラーシステムを採用し、ウェブサイトやデジタル製品用のリッチでフレキシブルなレイアウトを作成できるようにデザインしました。

エディターは下図に示すいくつかの主要な要素で構成されています。

ブロックエディターの外観

図中にハイライトされている要素は、

  1. インサーター: コンテンツキャンバス内にブロックを挿入するためのパネル
  2. コンテンツキャンバス: コンテンツエディター。ブロックで作成されたコンテンツを保持
  3. 設定サイドバー: ブロックの設定を構成するサイドバーパネルなど

ブロックエディターではブロックを使用して、モジュール的にコンテンツを作成します。すぐに使用できる多くのコアブロックがあり、自分でもオリジナルのブロックを作成できます。

ブロックは、段落、見出し、メディア要素、埋め込みなどの個別の要素です。各ブロックは独立した要素として扱われ、個別の編集や書式の制御が可能です。これらの要素をすべてつなぎ合わせてコンテンツとなり、WordPress のデータベースに保存されます

ブロックエディターは、WordPress の編集体験に革命を起こすことを目的とした Gutenberg プロジェクトで行われた作業の成果です。

ブロックエディターはビジュアルコンテンツ作成ツールを介して、拡張された編集体験を提供するだけでなく、豊富な API 機能セットによって、さまざまな方法で操作、拡張できる強力な開発者プラットフォームです。

ハンドブックの歩き方

このハンドブックはブロック開発に焦点を当てています。5つのセクションに分かれていて、それぞれに異なる目的があります。

はじめに

これからブロック開発を始める方はこのセクションで開発環境をセットアップし、ブロック開発の基礎を学習できます。また、用語集や よくある質問では、頻出の質問に対する答えを得られます。

開発ガイド

「はじめに」のセクションで学んだことをベースに、開発中に出会うさまざまな問題の解決方法を学びます。またチュートリアルや再利用可能なサンプルコードも取得できます。例えば、フル機能のブロックの作成WordPress のデータの操作など。さらに、ブロックエディターでJavaScriptを使用する方法も学べます。

リファレンスガイド

このセクションがこのハンドブックの心臓部です。作業中あるいは調査中に細かな部分まで調べたり、特定の API の詳細を調べる際に利用できます。ブロック API リファレンス は、ブロックで実行したいほぼすべてのトピックをカバーしています。また、各 コンポーネント と パッケージ もここでドキュメント化されています。なおコンポーネントは、Storybook経由でもドキュメント化されています。

概説

このセクションではさらに深く、ブロックエディターアーキテクチャの理論的な理解により、実践的な知識を強化できます。

コントリビュータガイド

Gutenbergはオープンソースソフトウェアであり、誰でもこのプロジェクトに貢献できます。このセクションでは、どの領域に貢献するかを選択できるよう、コードデザインドキュメント、その他の貢献方法を詳しく説明します。

Top ↑

その他のリソース

このハンドブックは、ブロック開発に関連するすべての情報の正規のリソースです。しかし、他にも参考になる資料があります。

Top ↑

正しいハンドブックを観ていますか ?

このハンドブックはブロックエディター関連の開発を目指す方を対象としています。developer.wordpress.org にはこの他にもいくつかの WordPress 開発者向けのハンドブックがあります。


Top ↑

ブロックエディターハンドブック日本語版

Top ↑

問い合わせ先

ブロックエディターハンドブックの内容やサンプルへのコメント、問題報告は Gutenberg GitHub リポジトリ へお願いします。

日本語訳については 日本語版リポジトリ、または WordPress の 日本語 Slack 内の #docs チャンネルへお願いします。

Top ↑

参照

Top ↑

ブロックエディターハンドブック日本語版翻訳者

GitHub UsernameWordPress.org Username
@naokomc@nao
@ixkaito@ixkaito
@ryo-utsunomiya
@mypacecreator@mypacecreator
@takepo@taisuke
@atachibana@atachibana
@miminari@mimitips
@shizumi@Shizumi
@arm-band@armband
@kurudrive@kurudrive
@t-hamano@wildworks
@tecking@tecking
@s56bouya@s56bouya

Top ↑

主な変更

2023/12/2

2023/11/21

2023/11/11

2023/11/4

2023/11/2

2023/10/8

2023/9/19

2023/9/4

2023/8/14

2023/7/29

2023/6/24

2023/6/4

2023/05/23

2023/05/03

2023/03/25

2022/11/4

以前の変更履歴

原文

最終更新日: