X
    Categories: WordPress

β版Gutenbergを使ってみた!大事な準備と実際の記事投稿のポイントを徹底解説

近々、WordPress 5.0がリリースされると言われています。
大きく変わるのが新しいエディターGutenbergの登場です。
実際にどうやって使ったらいいのか、使い初めて迷ったことと対応、Gutenbergを導入する前の準備と、実際の使用感をレポートします。

グーテンベルク(リリース版)を使ってみた!旧エディタでの記事との連携は?

今すぐやること(Gutenbergを使う前に)

現状ではGutenbergをプラグインとしてテストできますが、WordPress5.0のリリース後はGutenbergがデフォルトのエディタになります。

Gutenbergリリース後に、なんの問題もなく新エディタを使えるのが理想的です。
しかし、どんなにテストを繰り返しても、世界中で新エディタを使い始めたら予想できないエラーが起こることも考えられます。

なにか不足の事態が起きたときに慌てないで済むように、Gutenbergのリリース後にも現行のエディタを使えるようにしておきましょう。

2018年10月現在、WordPressの最新バージョンは 4.9.8 です。
WordPress 4.9.8 を使っている方は、WordPress管理画面の「旧エディターをインストール」ボタンから、「Classic Editor」プラグインをインストールできます。

これで安心してWordPress 5.0のリリースを待てますね。

注意!本番環境では使えません

2018年10月現在、Gutenbergはベータ版なので本番環境では使えません。
試してみるのはテスト環境のみにしましょう。

インストール

WordPress管理画面 > ダッシュボード > 「Gutenbergをインストール」ボタンをクリックしてインストール・有効化します。

または

WordPress管理画面 > プラグイン > 新規追加
「Gutenberg」を検索してインストール・有効化します。

現行のエディタとの違い

大きく変わりましたね、考え方から何から。
私はまだ記事が少ないので抵抗がありませんが、何百記事も書いてきた方には、なかなかの大変更で受け入れるのが大変かもしれません。

しかしここは、いい面に目を向けましょう。
記事全体で大体の流れが決まっているなら、ブロックを組み立てていく、という記事の書き方は、馴染みやすいと思います。

投稿を新規追加する

「Classic Editor」プラグインを停止しておきます。

WordPress管理画面 > 投稿 > 新規追加

シンプルで、嫌いじゃないです。

パーマリンクの編集方法

まずはタイトルを記入して…、って、パーマリンクが変えられへんやん。涙

パーマリンクは、一度記事を保存してからでないと変更できないようです。
非公開で保存すると、

このように編集ボタンが表示されます。
気を取り直して、次はリードの文章とMOREタグと目次を挿入しましょう。

せっかくなんで、初ブロックで。

「+ ブロックの追加」をクリックします。

「段落」を選択して、

文章を入力しました。
次のブロックで、MOREタグ「続きを読む」を挿入します。

ブロック > レイアウト要素 > 「続きを読む」を選択します。

ほー、簡単。

次は、見出しを挿入したら目次を設定してみましょう。
と思ったら、目次は誰かがプラグインを作ってくれるのを待つしかないみたいですね。

Related Post

AddQuicktagは使えないのか

GutenbergではAddQuicktagやTinyMCEが使えない、と言われています。
AddQuicktagを試してみましょう。

クラシック・ブロックを挿入します。

表示を切り替えて、Quicktagを表示します。

全部使えますね。
class指定のあるものも表示されます。文中に挿入もできます。

クラシック・ブロックの中ではAddQuicktagを使えますが、それ以外では使えません。
移行期間は一時的にこの方法で乗り切ろうかと思います。

という訳で、オリジナルで作ったボタンやコードは、新たなプラグインが開発されない限り新エディタでは使えなさそうです。

再利用可能ブロックは同じ内容を表示するための機能

最初から用意されているブロックのほかに、自分でオリジナルのブロックを「再利用可能ブロック」として登録することができます。

再利用可能ブロックは、全く同じ内容を表示するための機能です。

再利用可能ブロックを変更すると、変更した記事だけでなく、挿入しているすべてのページのブロックを一括で変更します。

フォーマットを作っておいて、各ページで部分的に編集して使う、ということはできません。

投稿のフォーマットを作ってコピーして記事を書く

私が記事を書くときは、大体のフォーマットが決まっています。

毎回同じようにブロックを挿入していくのは面倒なので、記事の雛形を作り、それをコビーして使うことにしています。

フォーマットの例

項目 ブロック
リード文 段落
ヘッダー1 見出し H2
本文1 段落
ヘッダー2 見出し H2
本文2 段落
ヘッダー3 見出し H2
本文3 段落
ヘッダーまとめ 見出し H2
まとめ 段落

以下の手順でコピーします。

「すべてのコンテンツをコピー」をクリックします。

WordPress管理画面 > 投稿 > 投稿一覧
投稿 > 新規追加 > Gutenberg

Gutenbergで新規追加します。

ブロックにコピーしたコンテンツを貼り付けます。

既存の投稿をGutenbergで編集するとどうなるか

Gutenbergでは既存の記事をクラシック・ブロックとして扱います。
クラシック・ブロックは新エディタのブロックにペーストできます。

しかし、ペーストしたコンテンツはCSSクラスやDIV等が自動的に削除されます。
これを知らずにペーストすると、記事を表示したときに「思ってたんと違う」レイアウトになってしまいます。

うっかり既存の記事をGutenbergで編集しないために

「Disable Gutenberg」はGutenbergを無効にしてくれるスーパー・シンプルなプラグインです。

オプションとして、

  • グーテンベルクをすべての投稿タイプで完全に無効にする
  • 任意の記事のみ無効にする
  • 任意のユーザーロールに対して無効にする

という設定もできます。

私はうっかり者の慌てん坊なので、Gutenbergの本格運用開始後にこのプラグインを導入するつもりです。

プラグインを待つ機能

  • 目次(「Table of Contents Plus」プラグインの機能はGutenbergで投稿しても有効です)
  • AddQuicktagやTinyMCEのような編集補助機能
  • Markdown

他力本願も大概にしないと。。。

まとめ

本格的な導入に向けて、徐々に慣れていきたいと思います。

これは便利と思う機能や使い方を見つけたら、順次追記していきます。

マネージャー: