Adobe Target：画像オファー機能を活用した実装とURL取得のTips
はじめに
Adobe Targetでクリエイティブを運用する際、アセットを直接管理できる「画像オファー」機能は非常に便利です。しかし、カスタムコード（VEC外の実装）でこれらの画像を利用しようとすると、URLの取得方法に少し工夫が必要です。
本記事では、画像オファーの基本設定から、開発時に役立つURLの抽出手順について解説します。
1. 事前準備：Scene7（Adobe Experience Manager Assets）の設定
画像オファーを利用するには、バックエンドでScene7（現 AEM Assets）との連携設定が完了している必要があります。
- 確認方法：
管理 > Scene7 設定メニューから、アカウント設定がされているか確認してください。 - 画像の登録：
オファー > 画像オファーからアップロードします。運用効率を上げるため、キャンペーンごと、あるいはデバイスごとにフォルダを分けて管理することをお勧めします。
2. 基本的な画像差し替え手順
Visual Experience Composer (VEC) 上で既存の画像を差し替える場合は、直感的な操作が可能です。
- 変更したい画像要素を選択。
- メニューから 「画像オファーを変更」 をクリック。
- ライブラリから対象の画像を選択して適用します。
3. カスタムコードで利用するためのURL取得テクニック
「背景画像としてCSSで指定したい」「JavaScript内で動的に画像パスを扱いたい」といった場合、画像オファーの直URLが必要になります。しかし、管理画面から直接URLをコピーする機能は提供されていません。
以下の手順で、確実に有効なURLを抽出できます。
ステップ1：一時的にVECで画像を適用する
- 適当な場所で「画像オファーを変更」を行い、URLを取得したい画像を選択します。
- 「変更のリスト」に画像変更のアクションが追加されます。
ステップ2：URLの抽出
- 追加された変更アクションのプロパティ画面を開きます。
- ソース（src）属性に記述されているURLをコピーします。
- コピーしたURLからサイズに関するパラメーターを削除します。
ステップ3：変更の破棄
URLさえ取得できれば、VEC上での変更設定は不要です。変更のリストから「変更を削除」をクリックして、元の状態に戻しておきましょう。
4. 画像URLの構造と注意点
取得できるURLは、概ね以下のようなフォーマットになっています。
https://{任意}.scene7.com/is/image/{アカウント毎のScene7パス}/{ファイル名}?fmt={形式}&hei={高さ}&wid={幅}- パラメータ：
fmt（フォーマット）は付与されていない場合があります。hei/wid（サイズ）は、VECで差し替えた画像のサイズになっているため、使用する際は削除します。削除すると画像の実サイズで配信されます。 - 重要な注意点：画像URLには規則性があるため、ファイル名部分を書き換えれば他の画像も表示できるように思えますが、Adobe Targetの仕様上、一度もエクスペリエンス上で呼び出されていない（アクティベートされていない）画像は、URLを直接叩いても404エラーになるケースがあります。
そのため、少し手間ですが、使用したい画像は一度上記の手順で「VEC上で選択」するプロセスを通しておくのが確実です。
まとめ
Adobe Targetの画像オファーは、単なるストレージではなく、動的なリサイズ機能（Scene7由来）を持つ強力なアセット管理ツールです。カスタム実装で利用する際は「一度VECを経由してURLを有効化する」というステップを忘れないようにしましょう。
次に、この手順を効率化するための「命名規則のベストプラクティス」や「一括URL取得の検証」についてもまとめてみましょうか？