ページへのDynamic Mediaアセットの追加

Webサイトで使用するアセットにDynamic Media機能を追加するには、Dynamic Media​または​インタラクティブメディア​コンポーネントをページに直接追加します。 デザイン​モードに入り、Dynamic Mediaコンポーネントを有効にします。 次に、これらのコンポーネントをページに追加し、そのコンポーネントにアセットを追加できます。Dynamic Mediaとインタラクティブメディアコンポーネントはスマートで、追加する画像またはビデオの有無が判別され、それに応じて使用可能なオプションが変わります。

Adobe Experience ManagerをWCMとして使用している場合は、Dynamic Mediaアセットを直接ページに追加します。

メモ

画像マップは追加設定なしでカルーセルバナーで使用できます。

ページへのDynamic Mediaコンポーネントの追加

Dynamic Mediaまたはインタラクティブメディアコンポーネントをページに追加する操作は、任意のページにコンポーネントを追加する操作と同じです。 Dynamic Mediaとインタラクティブメディアのコンポーネントについて、以降の節で詳しく説明します。

ページにダイナミックメディアコンポーネント/ビューアを追加するには:

  1. Dynamic Media コンポーネントを追加するページを Experience Manager で開きます。

  2. 使用可能なDynamic Mediaコンポーネントがない場合は、サイドキックでルーラーを選択して、デザイン​モードに入ります。

  3. Edit parsysを選択します。

  4. Dynamic Media​を選択して、Dynamic Mediaコンポーネントを使用可能にします。

    メモ

    詳しくは、デザインモードでのコンポーネントの設定を参照してください。

  5. サイドキックの鉛筆アイコンをクリックして、編集​モードに戻ります。

  6. Dynamic Media​または​インタラクティブメディア​コンポーネントを、サイドキックの​その他​グループからページの目的の場所にドラッグします。

  7. 編集」を選択して、コンポーネントを開きます。

  8. 必要に応じてコン ポーネントを編集します。

  9. OK」を選択して、変更内容を保存します。

Dynamic Media コンポーネント

Dynamic Media のサイドキッ クで、Dynamic Mediaおよびインタラクティブメディアを利用 ​できます。インタラクティブメディア​コンポーネントは、すべてのインタラクティブアセット(インタラクティブビデオ、インタラクティブ画像、カルーセルセットなど)に使用します。その他のすべてのDynamic Mediaコンポーネントには、Dynamic Media​コンポーネントを使用します。

chlimage_1-71

メモ

これらのコンポーネントはデフォルトでは使用できないので、使用する前にデザインモードで選択する必要があります。 デザインモードで使用可能にした後は、他のExperience Managerコンポーネントと同様に、コンポーネントをページに追加できます。

Dynamic Media コンポーネント

Dynamic Mediaコンポーネントはスマートです。追加する画像が画像かビデオかに応じて、様々なオプションを使用できます。 このコンポーネントは画像プリセット、画像ベースのビューア(画像セット、スピンセット、混在メディアセットなど)およびビデオをサポートします。また、ビューアはレスポンシブです。 つまり、画面のサイズは画面のサイズに基づいて自動的に変化します。 すべてのビューアはHTML5ベースのビューアです。

メモ

Dynamic Mediaコンポーネントを追加し、Dynamic Media設定​が空白の場合や、アセットを正しく追加できない場合は、次の点を確認してください。

  • Dynamic Media を有効にしていること。Dynamic Media はデフォルトで無効になっています。
  • 画像が PTIFF(Pyramid TIFF)ファイルであること。Dynamic Mediaを有効にする前に読み込まれた画像には、PTIFF(Pyramid TIFF)ファイルはありません。

画像を操作する場合

Dynamic Mediaコンポーネントを使用して、画像セット、スピンセット、混在メディアセットなどの動的画像を追加できます。ズームイン、ズームアウトおよび必要に応じてスピンセット内の画像を回転したり、別の種類のセットから画像を選択したりできます。

また、ビューアプリセット、画像プリセット、画像形式をコンポーネント内で直接設定することもできます。画像をレスポンシブにするために、ブレークポイントの設定かレスポンシブ画像プリセットの適用のいずれかを実行できます。

chlimage_1-72

コンポーネントの「編集」をクリックし、「Dynamic Media設定」タブをクリックして、次のDynamic Media設定を編集できます。

chlimage_1-73

メモ

デフォルトでは、Dynamic Media 画像コンポーネントはアダプティブです。画像コンポーネントを固定サイズにする場合は、そのコンポーネントで、「詳細」タブの「」および「高さ」プロパティを使用してサイズを設定します。

ビューアプリセット — ドロップダウンメニューから既存のビューアプリセットを選択します。探しているビューアプリセットが表示されない場合は、表示できるように設定する必要があります。詳しくは、ビューアプリセットの管理を参照してください。画像プリセットを使用している場合は、ビューアプリセットを選択できません。逆の場合も同様です。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合にのみ使用できます。 表示されるビューアプリセットはスマートです。 つまり、関連するビューアプリセットのみが表示されます。

画像プリセット — ドロップダウンメニューから既存の画像プリセットを選択します。探している画像プリセットが表示されない場合は、表示できるように設定する必要があります。画像プリセットの管理を参照してください。画像プリセットを使用している場合は、ビューアプリセットを選択できません。逆の場合も同様です。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合には使用できません。

画像の修飾子 — 追加の画像コマンドを指定して、画像エフェクトを変更できます。これらのコマンドについては、画像プリセットの管理およびコマンドリファレンスで説明します。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合には使用できません。

ブレークポイント — レスポンシブサイトでこのアセットを使用する場合は、ページのブレークポイントを追加する必要があります。画像のブレークポイントはコンマ(,)で区切ります。 このオプションを使用できるのは、画像プリセットで高さまたは幅が定義されていないときです。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合には使用できません。

コンポーネント内の「編集」をクリックして、次の「詳細設定」を編集できます。

タイトル - 画像のタイトルを変更します。

代替テキスト - グラフィックの表示をオフにしているユーザー向けのタイトルを画像に追加します。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合には使用できません。

URL、次のウィンドウで開く — からアセットを設定して、リンクを開くことができます。URL​と​Open in​を設定して、同じウィンドウで開くか、新しいウィンドウで開くかを指定します。

このオプションは、画像セット、スピンセットまたは混在メディアセットを表示している場合には使用できません。

幅と高さ — 画像を固定サイズで表示する場合は、値をピクセル単位で入力します。これらの値を空にすると、アダプティブなアセットになります。

ビデオを操作する場合

Dynamic Media​コンポーネントを使用して、Webページにダイナミックビデオを追加します。コンポーネントの編集時に、ページ上でビデオを再生するための定義済みのビデオビューアプリセットを使用するように選択できます。

chlimage_1-74

コンポーネントの「編集」をクリックして、次のDynamic Media設定を編集できます。

メモ

デフォルトでは、Dynamic Media ビデオコンポーネントはアダプティブです。ビデオコンポーネントを固定サイズにする場合は、そのコンポーネントで、「詳細」タブの「」と「高さ」を使用してサイズを設定します。

ビューアプリセット — ドロップダウンメニューから既存のビデオビューアプリセットを選択します。探しているビューアプリセットが表示されない場合は、表示できるように設定する必要があります。詳しくは、ビューアプリセットの管理を参照してください。

コンポーネントの「編集」をクリックして、次の「詳細」設定を編集できます。

タイトル - ビデオのタイトルを変更します。

幅と高さ — ビデオを固定サイズで表示する場合は、値をピクセル単位で入力します。これらの値を空にすると、アダプティブな画像になります。

セキュアビデオの配信

Experience Manager6.2では、FP-13480をインストールする際に、ビデオを安全なSSL接続(HTTPS)と安全でない接続(HTTP)のどちらで配信するかを制御できます。 デフォルトでは、ビデオ配信プロトコルは、埋め込み Web ページのプロトコルから自動的に継承されます。Web ページが HTTPS で読み込まれる場合、ビデオも HTTPS で配信されます。逆に、WebページがHTTP上にある場合、ビデオはHTTP経由で配信されます。 通常、このデフォルトの動作は問題なく、設定を変更する必要はありません。 ただし、このデフォルトの動作を上書きすることはできます。 URLパスの末尾または埋め込みコードスニペット内の他のビューア設定パラメータのリストにVideoPlayer.ssl=onを追加します。 どちらのアクションでも、ビデオの安全な配信が強制されます。

ビデオのセキュア配信、および URL パスの VideoPlayer.ssl 設定属性の使用について詳しくは、『ビューアリファレンスガイド』の「ビデオのセキュア配信」を参照してください。ビデオビューアの他に、混在メディアビューアおよびインタラクティブビデオビューアでセキュアなビデオ配信を使用できます。

インタラクティブメディアコンポーネント

インタラクティブメディアコンポーネントは、インタラクティビティ(ホットスポットまたは画像マップ)を含むアセット用です。インタラクティブ画像、インタラクティブビデオまたはカルーセルバナーがある場合は、インタラクティブメディア​コンポーネントを使用します。

インタラクティブメディアコンポーネントはスマートです。追加するメディアが画像かビデオかに応じて、様々なオプションを使用できます。 また、ビューアはレスポンシブです。 つまり、画面のサイズは画面のサイズに基づいて自動的に変化します。 すべてのビューアはHTML5ベースのビューアです。

chlimage_1-75

コンポーネントの「編集」をクリックして、次の​一般​設定を編集できます。

ビューアプリセット — ドロップダウンメニューから既存のビューアプリセットを選択します。探しているビューアプリセットが表示されない場合は、表示できるように設定する必要があります。ビューアプリセットを使用するには、あらかじめ公開する必要があります。ビューアプリセットの管理を参照してください。

タイトル - ビデオのタイトルを変更します。

幅と高さ — ビデオを固定サイズで表示する場合は、値をピクセル単位で入力します。これらの値を空にすると、アダプティブな画像になります。

コンポーネントの「編集」をクリックして、次の​買い物かごに追加​設定を編集できます。

製品アセットを表示 - デフォルトでは、この値が選択されています。製品アセットには、コマースモジュールで定義された製品の画像が表示されます。製品アセットを表示しない場合はチェックマークをオフにします。

製品価格を表示 - デフォルトでは、この値が選択されています。製品価格には、コマースモジュールで定義されたアイテムの価格が表示されます。製品価格を表示しない場合はチェックマークをオフにします。

製品フォームを表示 - デフォルトでは、この値は選択されていません。製品フォームには、サイズや色など製品のバリエーションが含まれます。製品のバリエーションを表示しない場合はチェックマークをオフにします。

このページ