WordPress5.5からエディタのプレビューが大きく変わりました。
デスクトップ、タブレット、モバイルの切り替えもできます。
エディタをそのままプレビュー画面に
WordPress5.5で新しく追加されたプレビューは、エディタをそのままプレビュー表示します。
デスクトップ、タブレット、モバイルの３つのデバイスサイズで表示することができます。
というかエディタ内のコンテンツエリアのサイズを小さくしたり大きくしたりするだけですが。
『プレビュー』ボタンを押すと、デバイスのメニューが出るので選びます。
また公式フィールドガイドでは、中～大画面しか機能しないと言っています。
The new preview options currently only work on medium to large screens (>= 600px). In the future, there may be a way to preview large screens on a phone.
新しいプレビューオプションは今のところ、中～大画面（≧600px）でしか機能しません。将来的には、携帯電話で大画面をプレビューする方法があるかもしれません。
筆者訳
WP5.5ではタブレット、モバイルが表示されない
ボクの環境で、タブレット、モバイルのプレビューは、エディタのコンテンツエリアの高さが0になって表示されませんでした。
WordPress5.5.1にアップデートしたら修正されてます。
（バグだったらしい。）
使うテーマによっては同じことが起きるかも知れません。
ショートコードは意味がない
エディタをそのままプレビュー表示は、公開ページと同じ見栄えじゃないと使えません。
GutenbergのCSSに、公開サイトと同じCSSを当ててできなくもないですが、ショートコードはコードしか表示されません。
このプレビューは、凝ったコンテンツには向かないと思います。
既存のプレビューの変更
これまでのプレビューは、『プレビュー』ボタンを押すと新しいタブに表示されてました。
WordPress5.5からは『プレビュー』->『新しいタブでプレビュー』に変わっています。
自動更新は無くなった
これまでのプレビューは『下書き保存』や『自動保存』『更新』でリロードされ、つねに最新のコンテンツを表示するようになってました。
プレビューページをスクロールしながら確認して、修正したら勝手にリロードされページのスクロールがトップに戻っているのが面倒でした。
これがWordPress5.5では廃止されてます。
（ブラウザのリロード（更新）を使って手動で行う。）
ブラウザのリロードでは、プレビューページのスクロールを維持するのでうっとうしさが解消されてます。
ブロックスタイルの編集
エディタGutenbergのコンテンツはブロックの集まりです。エディタでブロックにレスポンシブなスタイルを付ける方法が用意されています。
#start-resizable-editor-section {
display: none;
}
/* レスポンシブのスタイルをここに書く。
#end-resizable-editor-section {
display: none;
}2つのマーカー（#start-resizable-editor-section, end-resizable-editor-section）の間に書かれたスタイルはエディタが検出します。
（マーカーのdisplay: noneはそういう決まり。）
今のところ、テーマエディタのスタイルは未対応です。
