しばらくブログのメンテをしていなかったので気付かなかったのですが、古い記事をスマホ等で見ると画像が縮小されずに飛び出てしまっていました。
ブロックエディタで変換した記事はスマホで表示がおかしい
調べてみるとクラシックエディタで編集したものはすべてそうなっているようです。ブロックエディタに変更したのは2019年からなので過去のをすべて直すとなると大変な時間がかかりそうです。そこで一部だけブロックエディタへ変換してみることにしました。

対象はアクセス数が多い記事と「たべてみた」の記事にすることにしました。最初は「ブロックへ変換」をクリックするだけだろうと思っていたのです。

するとインライン画像に変換されて、横幅を指定することになります。そうすると画像サイズが固定されてしまうので大きいサイズにしてしまうと、やはりスマホからだと画像が飛び出てしまいます。
仕方がないのでHTMLに変換し、ひとつひとつ画像と段階に分けて編集したのですがものすごく時間がかかってしまいます。なんとかならないのだろうか…
おかしいのはTwenty Twenty Twoだった
画像処理がおかしかったのはTwenty Twenty Twoのテーマが原因でした。テーマをCocoonに変えたらスマホでも画像が問題なく表示されるのを確認しました。
コメント