Classic Editor で表に画像を表示させる方法
画像を自由に配置するために表を使おうと思ったのですが「テーブル」ブロックだと画像を入れる方法が見つかりませんでした
仕方なく、クラシックエディタで表を作って並べてましたがセルの中央に揃えることが出来ずでした
「チロ猫」さんのサイトに「目から鱗」の方法が載ってたので早速実装してみた備忘録です。
プラグイン不要！ブロックエディタのテーブルに画像を入れる方法
基本的にSWELL以外のテーマでは、「個別セルを中央揃えする」という機能はありません。
そのため、HTML上で手動でタグを挿入して対応します。
ただし、この方法は「HTMLの構造上あまり美しい方法ではない」可能性があります、ご了承ください。
（＋）で「テーブル」ブロックを開く
カラム数や行数を入れ表を作成（カラム数や行数はあとからでも変更できるので適当に）
左右のセル幅が均等になるように「表のセル幅を固定」をONにする
表の画像を表示したいセルに印をつける
ここが「目から鱗」のポイント！前にもHTML編集で行けそうだと挑戦したものの
Gutenberg（ブロックエディタ）ではコードが⇩こんな状態ですよ
画像のURLをどこに入れたらいいものやら、目がチカチカしてきます
下手に入れれば表自体が崩れるし、強制修正されるだろうし、
チロ猫さんの目から鱗の裏技がこちら⇩
まさに「なるほど～」「こんな方法があったか～」です
画像を入れたいセルに印をつけておく！！です
それを「HTMLで編集」に切り替えて見てみると⇩⇩
まさに「なるほど～」「こんな方法があったか～」です
（＋）で画像ブロックを開く
入れたい画像をアップロードするかライブラリから選択するかします
画像サイズを変更する。（←こことっても大事！！）
１枚の画像でもサイズで画像のURLが違うから、先に縮小しておかないとダメなんですね
画像のブロックを「HTMLで編集」に切り替える
画像のブロック選択した状態で「HYMLで編集」に切り替えると⇩こうなります
セルの中央に表示は★印の前後に<center> </center>タグを入力する
仕上がり～～ε= ε= ε= (ノ^∇^)ノ
えっくせれんと！！びゅーてぃほー！！( ^^)／□☆□＼(^^ )ｶﾝﾊﾟｰｲ!
簡単に貼り付け位置が確認できます。その作業の繰り返しです
前後の< >とかを消さないように注意してマークした印を消します
チロ猫さん、ありがとうございました。