モバイルデバイス用のページのオーサリング authoring-a-page-for-mobile-devices

Adobe Experience Manager ページはレスポンシブレイアウトに基づいています。レスポンシブレイアウトは、コンテンツをターゲットデバイスに合わせて自動的に調整するので、特定のデバイス向けにコンテンツを作成しなくてもよくなります。

モバイルページをオーサリングする場合、ページはモバイルデバイスをエミュレートする方法で表示されます。ページのオーサリング時に、いくつかのエミュレーターを切り替えて、エンドユーザーがページにアクセスしたときの表示を確認できます。

デバイスは、ページをレンダリングするデバイスの機能に応じて、フィーチャー、スマート、およびタッチのカテゴリにグループ分けされます。エンドユーザーがモバイルページにアクセスするときは、AEM はデバイスを検出して、そのデバイスグループに対応する表示域を送信します。

NOTE
既存の標準サイトに基づいたモバイルサイトを作成するには、標準サイトのライブコピーを作成します。詳しくは、ライブコピーの作成を参照してください。
AEM 開発者は、新しいデバイスグループを作成できます。「デバイスグループフィルターの作成」を参照してください。

次の手順を使用して、モバイルページをオーサリングします。

  1. グローバルナビゲーションから​ サイト ​コンソールを開きます。

  2. コンテンツページを編集します。

  3. ページ上部のエミュレーターアイコンをクリックして、目的のエミュレーターに切り替えます​

    エミュレーターアイコン

  4. コンポーネントブラウザーまたはアセットブラウザーからページにコンポーネントをドラッグ&ドロップします。

  5. 選択したデバイスに応じて、ページとページコンポーネントのレスポンシブレイアウトを変更します。

ページは次のようになります。

モバイルの例

NOTE
オーサーインスタンスのページがモバイルデバイスから要求されると、エミュレーターは無効になります。
recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab