次の方法で新しい画像や動画を追加できます。
- [アセットをインポート] コマンドを使用する
- パソコンのファイル システム ブラウザからアセットをドラッグする
- スタジオ アセット ライブラリにアクセスする
- 画像要素や動画要素を作成してソースを指定する
- 既存の画像を置き換える
Google Web Designer で使用するローカルの画像や動画は、サポートされているタイプであればライブラリに自動的に追加されるため、ドキュメントで簡単に再利用できます。
SVG 画像
画像またはインライン コードとして SVG ファイルをインポートできます。
画像と AMP HTML 広告
AMP HTML 広告では、img タグの代わりに amp-img タグが使用されます。デザインビューで画像を追加すると、Google Web Designer が自動で適切なタグを使用します。
動画とイベント（インタラクティブ動画）
動画でイベントを使用する場合は、要素ツールを使用して動画要素を追加するのではなく、動画コンポーネントを使用してください。
動画広告
動画広告内の画像や動画はメディア クリップとして使用できます。
新しい画像や動画の追加
画像や動画のインポート
- [ファイル] メニューで [アセットをインポート] を選択するか、キーボード ショートカット Ctrl+Shift+i（Windows の場合）または ⌘+Shift+i（Mac の場合）を使用します。
- ダイアログで、インポートするファイルを選択します。
選択したアセットが、ドキュメント ワークスペースとライブラリに表示されます。
パソコンから画像や動画をドラッグして追加する
- パソコンのファイル システム ブラウザを使用して、追加する画像や動画を選択します。複数のファイルを選択できます。
- 画像や動画を Google Web Designer のドキュメント ワークスペースにドラッグします。
スタジオ アセット ライブラリから画像や動画を追加する
- ライブラリの上部にあるプルダウンから [スタジオ] を選択します。
- [起動] ボタンをクリックしてスタジオ アセット ライブラリに接続します。
- ログインしていない場合は、スタジオ アカウントに関連付けられている Google アカウントにログインするよう求められます。
- 使用するアセットをフォルダ構造内で探します。
- アセットをライブラリから目的のドキュメント ワークスペースにドラッグします。
アセットのコピーが studio フォルダ内のローカル ライブラリに追加されます。
ドキュメント内の画像の置き換え
「画像の入れ替え」機能を使用すると、画像を別の画像で置き換えることができます。この機能は、テンプレートのストック画像を置き換えるときに便利です。
- 置き換える画像を右クリックします。
- ポップアップ メニューから [画像を入れ替える] を選択します。
- ダイアログで、ライブラリから画像を選択するか、「アセットをインポート」アイコン
をクリックしてパソコンから画像をインポートします。
- [OK] をクリックします。
をクリックしてパソコンから画像をインポートします。[画像を入れ替える] コマンドが表示されない場合は、画像を選択していること、また親要素や他の要素が画像に重なっていないことを確認します。どの要素が選択されているかは、[アウトライナー] パネルで簡単に確認できます。
要素ツールを使用して画像や動画を追加する
- ツールバーで要素ツール
を選択します。
- ツール オプション バーで画像要素
または動画要素
を選択します。
- ワークスペース内をクリックしてドラッグすることにより、目的のサイズの要素を作成します。
- [プロパティ] パネルで画像または動画のソースを設定します。
画像のサイズやアスペクト比は、作成した要素のサイズに合わせて変更されます。動画のアスペクト比は変更されず、作成した要素のサイズに収まる最大サイズで表示されます。
ローカル ライブラリの画像や動画の使用
ドキュメントに追加した画像や動画は、[ライブラリ] パネルで確認できます。
- [ライブラリ] で、画像や動画のアセット名をクリックして選択します。
- アセットを使用するワークスペースにドラッグします。
ローカル ライブラリのアセット ファイルのコピーは、パソコンのファイル システムの Google Web Designer プロジェクト フォルダ内にある assets サブフォルダに保存されます。
画像や動画のサイズ変更
画像や動画を追加したら、サイズの変更やスケーリングの調整ができます。
動画のプレビュー
動画コンポーネントや動画広告に含まれる動画は、Google Web Designer のインターフェース内でプレビューできます。
動画がプロジェクトでどのように表示されるかを確認するには、右上隅にある [プレビュー] ボタンをクリックし、お使いのブラウザでドキュメントをプレビューします。このオプションは動画広告では使用できません。