こんにちは。がんちゃんです。
先日、こちらのサイトにお問い合わせフォームを作成するために、WordPress5.0の新エディタ「Gutenberg」のHTML編集機能を使ってみました。
やはり、新エディタということもあり、いろいろ戸惑うところがありました。そこで、今日は「Gutenberg」でHTMLを編集する方法について紹介します。
新エディタ「Gutenberg」については、ポンちゃんがこちらで紹介しています。
GutenbergでHTML編集するには・・・「HTMLとして編集」
ページの一部でHTMLの編集を行う・追加するのであれば、当該ブロックをHTMLとして編集という形で編集します。
【手順】
(1)編集したいブロックを選択

(2)「詳細設定」-「HTMLとして編集」をクリック
これで当該ブロックのHTML編集ができます。
GutenbergでHTML入力するには・・・「コードエディタ」
ページ全体を編集したい場合には、「コードエディタ」を利用します。Gutenbergでは、デフォルトでビジュアルエディタが開きます。その他にHTML編集用に用意されているエディタが「コードエディタ」です。
コードエディタの開き方は次の2通りがあります。

・画面右上の「・・・」-「コードエディタ」を選択
・ ショートカットキー「Ctrl+Shift+Alt+M」
コードエディタを開かなくても、HTMLを挿入すれば、自動的にコードエディタが開きます。
編集が終わったら、右上の「コードエディターを終了」を押せば、元の画面に戻ります。
旧Verで作成した記事の編集ならプラグインの方が良いかも
「Gutenberg」のコードエディタを使って、作成中の記事を開いてみると「<!– wp:html –>」など、旧Verでは見なかったタグが出てきます。
やはり、旧Verで作成された記事は、「 Classic Editor 」というプラグインをインストールして編集するのが安心かと思います。
まとめ
ワードプレス5.0で「Gutenberg」を使ったHTML編集について紹介しました。お問い合わせ・アンケートフォームなど、ちょっと複雑なものを作成する場合に使うHTML編集機能。
こちらも少しずつ慣れていきましょう。
ポンちゃん、補足説明よろしくお願いします!
補足

ども!ポンちゃんです!
…特に補足するとこないです~!
Gutenberg はリリースされたばかりなので、今後は細かく改善される面も出てくるんでしょうね。
ということで、記事アップしちゃいます。