このレッスンでは、Webflowでの画像の差し替え方法とアセットの管理について学びました。ヒーローセクションなどに配置された画像を新しいものに置き換える操作を中心に解説します。

画像の差し替え手順

画像を変更する際は、まず対象の画像をクリックし「Element Settingsパネル」で「Choose Image」を選択します。するとアセットパネルが開き、プロジェクト内のすべての画像やファイルを管理できます。新しい画像は「Upload」ボタンから追加し、一覧から選択するだけでページ上の画像と差し替えられます。

クラスと画像の違い

重要なポイントは、画像の内容はクラスとは別で管理されるということです。同じクラスを複数の画像要素に適用しても、画像そのものは共有されません。クラスは影や角丸といったスタイルを定義するだけで、表示する画像は個別に指定する必要があります。

まとめ

画像の差し替えは「アップロード → 選択」のシンプルな流れで行えます。さらに、クラスはスタイル用であり、画像の内容は独立している点を理解しておきましょう。次回はCMSを使った動的コンテンツについて学びます。