AIで画像を生成する.
イベント告知用の写真が必要なのに手元にない場合は、説明文を書けばAIがページのImageエレメント内に作成します。画像はアップロードと同様に自サイトに保存されます。適切な写真がない場合に使います。すでにある写真の変更はAIで写真を変更するをご覧ください。動画ではOpen Day告知の横にある空のImageエレメントを埋めています。
始める前に
- AIはオンで、Enable image generationとEnable page creation assistantにチェックが入っています。詳しくはDXPR BuilderでAIをオンにするをご覧ください。
- ページにImageエレメントがあります。写真なしの新しいImageエレメントで構いません。
セットアップ
- Imageエレメントを指してコントロールバーのMoreをクリックします。
- 選択するのはEdit with AIです。
- ボックス内で画像を説明します(例: "Students chatting on a sunny university lawn in autumn, natural light, photo")。
- 対象はImage size:で、Landscapeを選びます。
- クリックするのはGenerate Imageです。
- ビルダーツールバーのSaveをクリックします。
画像の内容、スタイル(写真、イラスト、水彩)、光、構図を伝えます。ボックス下のEnhance promptは短い説明を詳細版に変換します。
背景画像
セクション、ロー、カラム、ほとんどのエレメントには生成画像の背景も設定できます。
- エレメントの設定をMore > Settingsで開き、Styleを開きます。
- 対象はBackground image配下で、AI Image Generationをクリックします。
- 背景を説明し、Image size:を選んでGenerate Imageをクリックします。
- ダイアログのSaveをクリックします。
表示内容
エレメントにはAIの処理中(1分ほどかかる場合があります)"Generating image..."と表示され、その後新しい画像が表示されます。自サイトにWebP画像として保存され、説明文を名前にしてメディアライブラリーに追加されます。説明文は画像のAlt attributeにもなります。エレメントのSEO設定でプレーンな説明に短縮します。詳しくはAIに代替テキストを書かせるをご覧ください。
同じ画像でEdit with AIを再度開くと、ボックスには前回の説明が残っています。Edit existing imageが選択されているため、Edit ImageをクリックするとAIはこの写真を変更します。代わりに新規作成するにはGenerate new imageを選び、単語を変更してGenerate Imageをクリックします。
設定
| 画像サイズ | ピクセル数 |
|---|---|
| Auto | モデルが選択 |
| Square | 1024 × 1024 |
| Landscape | 1536 × 1024 |
| Portrait | 1024 × 1536 |
新しい画像が表示されない場合
- ImageエレメントのMoreメニューにEdit with AIがありません。 Enable image generationまたはEnable page creation assistantがオフです。両方を
/admin/dxpr_studio/dxpr_builder/ai_settingsでチェックします。 - Edit with AIがグレーアウトしています。AIプロバイダーが設定されていません。DXPR BuilderでAIをオンにするの手順に従います。
- エレメントに"Image generation failed. Please try again."と表示される。DXPRは画像を作成できませんでした。例えばアカウントのクレジット切れや、コンテンツルールに抵触する説明が原因です。クリックするのはRetryです。またはCancelして説明を変更します。
- ページの再読み込み後に画像が消えています。ページが保存されていませんでした。再度生成し、ビルダーツールバーのSaveをクリックします。
次のステップ
- AIで写真を変更する：写真の光、背景、スタイルを調整する。
- AIに代替テキストを書かせる：スクリーンリーダー向けに画像を説明する。
- AIでページを下書きする：周辺のページをAIに書かせる。