山形を拠点に活動するフリーランスWEBデザイナーのサイト兼備忘録です

新時代のGutenbergエディタの機能を解説!画像関連編

複数画像もきれいに並べるギャラリー

ところで、さっきから画像がきれいに並んでるの、気になりません?

画像の紹介のところできれいに横に2つずつ並んだ画像がありましたね?こちらが、新機能の「ギャラリー」です。

4つとかでも行けるんですよ。そして、

右側の「カラム」を設定することによって

ご覧のように4つの画像の並びを変更できました。

キャプションはちょっとおしゃれに

さらにキャプションも画像同様に入れられるのですが、画像と違って下の部分に黒の半透明グラデーションをかぶせて、白い字で字幕を入れてくれます。ちょっとおしゃれですね。

まだまだ課題も

ただ、カラム落ちは画像の個数が偶数でないと現状うまくいかない感じもあります。奇数だと、一つだけ大きい画像になってしまったり…

また、カラムを4などに設定しても、スマートフォンサイズにしてしまうとカラム2と同じようになってしまったりと、レスポンシブへの柔軟な対応自体もこれから、という感じがします。

ここら辺はこれから変わっていくんでしょうかね?

投稿日時:


コメント

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

※コメントは承認制となっています。管理人の承認を得て初めて掲載されます。
※コメントには以下の HTML タグと属性のみ使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください