​
メディアライブラリ

左側パネルの「メディア」タブから、アップロード済みの画像を管理できます。

​
画像のアップロード

1

メディアタブを開く

左サイドバーの「メディア」アイコンをクリック
2

アップロード

「画像をアップロード」ボタンまたはドラッグ&ドロップ
3

画像を選択

アップロードした画像をクリックして選択

​
サポートされる形式

画像

JPEG, PNG, WebP, SVG, GIF, AVIF

動画

MP4, WebM, OGG

最大サイズ

10MB まで

​
Unsplash統合

100万枚以上の無料画像を直接検索・利用できます。
使い方
メディアタブで「Unsplash検索」をクリック
→ キーワードを入力（例: "coffee", "nature"）
→ 気に入った画像をクリックして挿入

​
画像の最適化

アップロードされた画像は自動的に最適化されます。
大きすぎる画像は自動的に適切なサイズにリサイズされます
WebPやAVIFなど、ブラウザに応じた最適なフォーマットで配信
スクロールに応じて画像を読み込み、ページ速度を改善

​
Altテキストとアクセシビリティ

  • 画像を選択し、右側パネルの「Altテキスト」に説明文を入力
  • 連続するデコレーション画像は alt="" にしてスクリーンリーダーでのノイズを防止
  • 重要な情報は必ずテキストでも提供する

​
画像編集ワークフロー

1

下書き

生成直後の画像はドラフトタグが付きます。差し替え予定のものはタグで管理。
2

調整

サイドパネルの「編集」からクロップ、回転、フィルターを適用。編集履歴は自動で保存。
3

最終化

「公開に使用」をONにすると、CDNキャッシュが更新されサイトに反映。

​
ファイル構造とバージョニング

  • 物理ファイルは /var/www/grav/user/pages/u-xxxx.site-name/images/ に保存
  • ファイル名には自動でハッシュが付与され、CDN上での競合を防止
  • 履歴を保持したい場合はファイルをダウンロードし、GitやS3に保管
API経由で管理する場合は /api/media と /api/upload-media を利用してください。

​
トラブルシューティング

拡張子と容量を確認。VPN越しの場合はLargeファイルがタイムアウトすることがあるため、5MB以下に圧縮してください。
ブラウザが低解像度版を選択している可能性があります。srcset のブレークポイントを調整するか、元画像をより大きいサイズで用意してください。