Point：画像ファイルのアップロード方法や容量制限については、以下の記事を参照してください。
利用可能な画像ファイル
Studioエディタにアップロードした画像
1ファイル1GBまでの画像ファイルをアップロードしてページデザインに利用できます。
Tips: 1GB以上の画像ファイルを小さくする
無料の画像圧縮ツールなどを利用することで、画質を保ったままファイルサイズを小さくすることができます。Studioではファイルサイズを変更するツールは提供していません。
フリー画像（Unsplash、Studio.Stock）
高品質な無料の写真リソースサイト「Unsplash」と、AI生成による高解像度・高品質な写真素材を提供するサービス「Studio .Stock」の素材を利用できます。
Studio外にアップロードされている画像
URL指定をすることで、外部のストレージサービスや自身のサーバーなど、Studio外にアップロードされている画像を利用できます。
URL指定の方法は、外部サーバーに保存された画像をURLで指定するの項目をご覧ください。
画像ボックスをスクリーンに配置する
空の画像ボックス、またはアップロード済み画像・フリー画像をスクリーンに配置できます。
空の画像ボックスを配置する
画面左側のナビゲーションで[追加]アイコン
を選択し、追加パネルを開きます。[基本]タブをクリックします。
[基本]メニューから、[Image]ボックスを選択、またはドラッグ＆ドロップでスクリーンに画像ボックスを配置します。
アップロード済み画像を配置する
画面左側のナビゲーションで[アップロード]アイコン
を選択し、アップロードパネルを開きます。配置したい画像を選択、またはドラッグ＆ドロップでスクリーンに配置します。
フリー画像（Unsplash、Studio .Stock）を配置する
画面左側のナビゲーションで[ストック]アイコン
を選択し、ストックパネルを開きます。利用したいサービスに合わせて、Studio.StockまたはUnsplashタブを選びます。
画像を選択、またはドラッグ＆ドロップでページに配置します。
外部サーバーに保存された画像をURLで指定する
外部のストレージサービスなど、エディタ外に保存されている画像を使用する際は、画像をURL指定します。
画像ボックスを選択します。
右パネルで[画像]タブを選択します。
※パネルが閉じている場合は、右パネルを開いてください。
[URL]フィールドに画像URLを入力します。
配置済みの画像を変更する
詳しくは、9.【基本編】テンプレートの編集方法 > テキストや画像を差し替えるをご覧ください。
左パネルでアップロード＆置き換えパネルを開きます。
以下、いずれかの方法でパネルを開きます。
スクリーン上で対象のボックスをダブルクリック
レイヤーパネルから対象のボックスを選択し、右パネル内の[画像]タブの画像サムネイル部分をダブルクリック
※パネルが閉じている場合は、右パネルを開いてください。
変更したい画像の種類に合わせて、[アップロード]または[ストック]タブを選択し、画像を選びます。
画像ボックスを削除する
削除したい画像ボックスをダブルクリックします。
表示されたメニューで、[ボックスを削除]を選択します。
BoxモードとImgモード
画像ボックスには「Boxモード」と「Imgモード」があり、モードによって画像の扱い方や設定可能な機能が異なります。
各モードの詳細や操作方法は、画像ボックス：BoxモードとImgモードのページを参照してください。
画像に背景加工をする（Boxモードのみ）
Boxモードの画像ボックスには、エディタ上で画像にさまざまな加工を加えることができます。
詳細は、画像ボックス：画像に背景加工をするを参照してください。
画像のフィルター（明るさ、コントラスト、鮮やかさ、モノクロ、セピア、ぼかし）
背景位置の調整
背景サイズの調整
繰り返し設定
画像のalt設定（Imgモードのみ）
Imgモードの画像ボックスには、alt（代替えテキスト）が設定し、画像の内容を検索エンジンやサイトの読み上げ機能に伝えることができます。SEOの観点からもこの情報を設定することは非常に重要です。
詳しくは、画像のalt設定を参照してください。
Image AI
自然言語による指示で、Editor内で画像を編集できます。
ご自身でアップロードした画像、ストックパネルからダウンロードしたフリー画像、どちらでも利用が可能です。
編集内容の指示はテキストだけでなく、参考画像を添付して指定することもできます。
Studio内でデザインに合った画像の作成や編集が完結します。
AIで画像を編集する手順
スクリーン上に画像を配置します。
画像上部のStudioアイコン
をクリックして、テキストフィールドに画像の編集内容を入力します。参考画像がある場合には、テキストフィールド右の画像アイコン
をクリックして、画像をアップロードしてください。
image picture
イメージ 写真 素材