タイトル : Gatsby 画像の横並び 2026/02
更新日 : 2026-02-22
カテゴリ : プログラミング
タグ :
Gatsbyの画像の並びが一つづつ縦になってしまうので横にしたい
gatsby-remark-images-gridを使う方法にする
npm install gatsby-remark-images-gridgatsby-config.js の書き換え
{
resolve: `gatsby-transformer-remark`,
options: {
plugins: [
`gatsby-remark-images-grid`, // 書く
{
resolve: `gatsby-remark-images`,
options: { maxWidth: 800 },
},
],
},
}マークダウンでの書き方
```grid|2|ここにキャプション（任意）
__```