この記事はSANGOカスタマイズガイドの「SANGOでブロックエディタ（Gutenberg）を使う方法と注意点」を転載したものです。
Gutenbergとは？
Gutenberg（グーテンベルク）とは、WordPress5.0より標準となった新エディターです。note.muやMediumなどのエディターに似ており、直感的に記事を書くことができます。「ブロックエディター」と呼ばれることもあります。
SANGOでGutenbergを利用する
以下の点をご確認のうえ、プラグインを導入してください。
- こちらのプラグインは、SANGOおよびWordPressの最新バージョンとの互換性のみを考慮して開発されます。Ver1.6以下では使用できないことにご注意ください。
- Gutenbergにはテーマに関わらず利用できるWordPress標準のスタイルが多く含まれています。SANGOでは、これらの標準スタイルはそのまま活かしていく方針です。これらの機能についてバグ報告や改善要望をいただいても対応できませんのでご了承ください。
- Gutenbergという名前のプラグインがありますが、このプラグインをインストールする必要はありません。
- Gutenbergの中でカスタムエディターを呼び出した場合、SANGOのスタイルがエディター上で反映されない部分があります。
- SANGO 3.0以上をご利用の方は不要です。逆に不具合の原因にもなりますのでインストールしないでください。
はじめて導入する場合は、以下のボタンよりSANGO Gutenbergプラグイン（zipファイル）をダウンロードしてください。
ただし、SANGO 3.0以上をご利用の方は不要です。逆に不具合の原因にもなりますのでインストールしないでください。
（ライセンス：GPL）
zipファイルは解凍せずに、WordPressダッシュボードの「プラグイン⇒新規追加⇒プラグインのアップロード」より選択してください。アップロード成功後、有効化をクリックしてください。
アップデートの方法
他のプラグインと同様に、ダッシュボード⇒プラグインより、自動更新することができます（上のような表示が出ていたら「更新」をクリックしてください）。テーマファイルをアップロードし直す必要はありません。
SANGO Gutenbergの機能
ここでは「SANGO Gutenberg」プラグインの機能をいくつか紹介します。
エディターにSANGOデフォルトのスタイルが反映される
見出し、引用、リストなどを挿入すると、SANGO標準のスタイルと同じ装飾でエディター上に表示されます。テーマカスタマイザーで選択しているメインカラーやアクセントカラーがこれらのスタイルに反映されます。
見出しブロック
Gutenberg専用のオリジナル見出しを用意しています。エディター上で⊕をクリックし「SANGO見出し」というブロックを選択することで、挿入できます。見出しのスタイルは、エディター右側のサイドバー（右上のをクリックして表示）で変更できます。
ボックス・ブロック
「タイトル付ボックス」という名前のSANGOオリジナルのブロックを使用することができます。ボックスの種類はエディター右側のサイドバー（右上のをクリックして表示）で変更できます。
アコーディオン・ブロック
アコーディオンとはクリックすると開く機能のことです。SANGO Gutenbergでは一切専門知識がなくとも、アコーディオンを配置することができます。クリックすると開きます
ここに文章や画像、ブロックなどを自由に書くことができます。
タイムライン・ブロック
ここにタイムラインの文章を書きます。
タイムラインの項目は必要な数だけ増やすことができます。
- リストや画像などを配置することもできます
- ブロックを使用するのに、専門知識は必要ありません
吹き出しブロック
吹き出しのブロックも用意されています
右から吹き出しを出すことも、背景や文字の色を変えることもできます
記事一覧ブロック
文章の途中に記事一覧を差し込むことができます。カテゴリーやタグで絞り込んで表示することも可能です。 ショートコードでも記事一覧は差し込めるのですが、どのような表示結果になるかリアルタイムで確認できるぶん、ブロックを使った方が作業がはかどります。
タブブロック
文章の途中にタブをクリックすることでコンテンツを切り替えて表示するためのブロックを挿入することができます。
ここにタブ1のコンテンツが入ります
ここにタブ2のコンテンツが入ります
レビューボックスブロック
下のような評価テーブルを簡単に作成することができます。
参考ブロック
URLを入力するだけで簡単に参考リンクを作成できるブロック
関連ブロック
内部リンクを検索してカード形式で表示できるブロック
WordPressテーマ「SANGO」30の魅力 メッセージブロック
以下の様な注意事項や補足説明に利用できるブロック
このように補足メモを記事内に簡単に挿入することができます。
ここに注意事項が入ります
ボックスブロック
内容を囲って強調したい場合に利用できるブロック
ここに内容が入ります。
ボタンブロック
全18種類のボタンスタイルから選んで表示することができるブロック。アフィリエイトの計測タグも入力することができます。
リストブロック
全12種類のリストスタイルから選んで表示することができるブロック。
- リスト1
- リスト2
- リスト3
線ブロック
区切り線を入れるのに便利なブロック。
蛍光ペンやラベル装飾
段落やリストなどの好きなテキストを「蛍光ペン風」や「ラベル風」に装飾できます。
デフォルトブロックでもSANGOのスタイルが使用可能
「ボタン」や「画像」、「表」などのWordPress標準のブロックに対してもSANGO独自のスタイルバリエーションを追加しています。
テーブルブロックやリストブロックを選んだ状態で、ツールバーの［高度な設定］→［追加CSSクラス］に以下のクラス名を挿入すると、ブロック内のフォントサイズを変更できます
※ v1.5.2から対応
- font-small: フォントサイズを小さく
- font-smaller: フォントサイズをやや小さく
- font-larger: フォントサイズをやや大きく
- font-large: フォントサイズを大きく