Show Menu
トピック×

モバイルデバイス用サイトの作成

単一ページアプリケーションフレームワークを基にしたクライアント側レンダリング(React など)が必要なプロジェクトでは、SPA エディターを使用することをお勧めします。 詳細情報 を参照してください。
モバイルサイトの作成は標準サイトの作成と同様ですが、この処理にはテンプレートとコンポーネントの作成も含まれます。テンプレートとコンポーネントの作成について詳しくは、 テンプレート コンポーネント および AEM Sites の開発の手引き を参照してください。主な違いは、サイト内での AEM の組み込みのモバイル機能の有効化です。そのためには、モバイルページコンポーネントを使用するテンプレートを作成します。
また、 レスポンシブデザイン を使用して、複数の画面サイズに対応する単一のサイトを作成することも検討してください。
作業を開始する際は、AEM で使用可能な We.Retail モバイルデモサイト ​を確認できます。
モバイルサイトを作成するには、次の手順を実行します。
  1. ページコンポーネントを作成します。
    • Set the sling:resourceSuperType property to wcm/mobile/components/page This way the component relies on the mobile page component.
    • プロジェクトに特有のロジックを使用して body.jsp を作成します。
  2. ページテンプレートを作成します。
    • Set the sling:resourceType property to the newly created page component.
    • Set the allowedPaths property.
  3. サイト用のデザインページを作成します。
  4. Create the site root page below the /content node:
    • Set the cq:allowedTemplates property.
    • Set the cq:designPath property.
  5. サイトのルートページのページプロパティの「 モバイル 」タブで、デバイスグループを設定します。
  6. 新しいテンプレートを使用してサイトページを作成します。
モバイルページコンポーネ /libs/wcm/mobile/components/page ント():
  • ページプロパティダイアログに「 モバイル 」タブを追加します。
  • Through its head.jsp , it retrieves the current mobile device group from the request and if a device group is found, uses the group's drawHead() method to include the device group's associated emulator init component (only in author mode) and the device group's rendering CSS.
モバイルサイトのルートページはノード階層のレベル 1 に位置する必要があります。また、このページを /content ノードの下に配置することをお勧めします。

マルチサイトマネージャーによるモバイルサイトの作成

Use Multi Site Manager (MSM) to create a mobile live copy from a standard site. The standard site is automatically transformed into a mobile site: the mobile site has all the features of the mobile sites (e.g. edition within an emulator) and can be managed in sync with the standard site. Refer to the section Creating a Live Copy for different Channels in the Multi Site Manager page.

サーバー側のモバイル API

モバイルクラスを格納する Java パッケージを次に示します。

モバイルコンポーネント

The We.Retail Mobile Demo Site uses the following mobile components which are located below /libs/foundation/components :
名前 グループ 特徴
mobilefooter hidden - フッター
mobileimage モバイル - image 基盤コンポーネントに基づく ​- 画像をレンダリングする(デバイスが対応している場合)
mobilelist モバイル - list 基盤コンポーネントに基づく ​- listitem_teaser.jsp が画像をレンダリングする(デバイスが対応している場合)
mobilelogo hidden - logo 基盤コンポーネントに基づく ​- 画像をレンダリングする(デバイスが対応している場合)
mobilereference モバイル
— 参照基礎コンポーネントに類似
- textimage コンポーネントを mobiletextimage コンポーネントにマップし、image コンポーネントを mobileimage コンポーネントにマップする
mobiletextimage モバイル - textimage 基盤コンポーネントに基づく ​- 画像をレンダリングする(デバイスが対応している場合)
mobiletopnav hidden
- topnav foundationコンポーネントに基づく
- テキストのみをレンダリングする

モバイルコンポーネントの作成

AEM モバイルフレームワークを使用すると、要求を発行するデバイスを感知するコンポーネントを開発できます。以降の節のコード例は、コンポーネントの jsp で AEM モバイル API を使用する方法を示しています。具体的には、次に示す処理の方法を示します。
  • 要求からデバイスを取得します。 Device device = slingRequest.adaptTo(Device.class);
  • デバイス・グループの取得: DeviceGroup deviceGroup = device.getDeviceGroup();
  • デバイス・グループの機能を取得します。 Collection<DeviceCapability> capabilities = deviceGroup.getCapabilities();
  • デバイス属性(WURFLデータベースから生の機能キー/値)を取得します。 Map<String,String> deviceAttributes = device.getAttributes();
  • デバイスのユーザーエージェントを取得します。 String userAgent = device.getUserAgent();
  • 現在のページから、デバイスグループリスト(作成者によってサイトに割り当てられたデバイスグループ)を取得します。 DeviceGroupList deviceGroupList = currentPage.adaptTo(DeviceGroupList.class);
  • デバイスグループが画像をサポートしているかどうかを確認します if (deviceGroup.hasCapability(DeviceCapability.CAPABILITY_IMAGES)) { ... または if MobileUtil.hasCapability(request, DeviceCapability.CAPABILITY_IMAGES) { ...
In a jsp, slingRequest is available through the <sling:defineObjects> tag and currentPage through the <cq:defineObjects> tag.

エミュレーター

エミュレータベースのオーサリングでは、作成者はモバイルクライアント向けのコンテンツページを作成できます。モバイルコンテンツのオーサリングは、インプレースWYSIWYGの編集と同じ原則に従います。作成者がモバイルデバイス上でページの外観を認識できるように、モバイルコンテンツページはデバイスエミュレーターを使用して編集されます。
モバイルデバイスエミュレーターは汎用のエミュレーターフレームワークに基づいています。詳しくは、 エミュレーター を参照してください。
デバイスエミュレーターのページには、モバイルデバイスが表示されます。一方、通常の編集(parsys、コンポーネント)は、デバイスの画面内でおこなわれます。デバイスエミュレーターは、サイト用に設定されるデバイスグループに依存します。1 つのデバイスグループに複数のエミュレーターを割り当てることができます。これにより、すべてのエミュレーターをコンテンツページで使用できるようになります。デフォルトで表示されるのは、サイトに割り当てた最初のデバイスグループに割り当てられた最初のエミュレーターです。ページ上部にあるエミュレーターのカルーセルまたはサイドキックの編集ボタンを使用してエミュレーターを切り替えることができます。
エミュレーターの作成
エミュレーターを作成するには、汎用エミュレーターに関するページの カスタムモバイルエミュレーターの作成 を参照してください。
モバイルエミュレーターの主な特徴
  • デバイス・グループは、次のエミュレータの1つで構成されます。デバイス・グループ構成ページ(例:/etc/mobile/groups/touch。ノードの下にプロパティ emulators が含まれ jcr:content ます。 注意:同じエミュレータが複数のデバイスグループに属している可能性はありますが、あまり意味がありません。
  • Via the device group's configuration dialog, the emulators property is set with the path of the desired emulator(s). For example: /libs/wcm/mobile/components/emulators/iPhone4 .
  • エミュレータコンポーネント(例: /libs/wcm/mobile/components/emulators/iPhone4 )ベースモバイルエミュレータコンポーネント( /libs/wcm/mobile/components/emulators/base )を拡張します。
  • 基本のモバイルエミュレーターを拡張する各コンポーネントは、デバイスグループの設定時に選択できます。これにより、カスタムエミュレーターを簡単に作成または拡張できます。
  • 編集モードでの要求時には、エミュレーターの実装を使用してページをレンダリングします。
  • ページのテンプレートでモバイルページコンポーネントを使用する場合は、エミュレーターの機能が(モバイルページコンポーネントの head.jsp を使用して)自動的にページに統合されます。

Device Groups

モバイルデバイスグループを使用すると、デバイスの機能に基づくモバイルデバイスのセグメント化が可能になります。デバイスグループは、オーサーインスタンスでのエミュレーターベースのオーサリングおよびパブリッシュインスタンスに適したコンテンツのレンダリングに必要な情報を提供します。作成者がモバイルページにコンテンツを追加して公開すると、そのページをパブリッシュインスタンスで要求できます。その場合、エミュレーターの編集ビューではなく、設定済みのいずれかのデバイスグループを使用してコンテンツページがレンダリングされます。デバイスグループの選択は モバイルデバイスの検出 に基づいておこなわれます。一致するデバイスグループが必要なスタイル設定情報を提供します。
Device groups are defined as content pages below /etc/mobile/devices and use the Mobile Device Group template. デバイスグループテンプレートは、コンテンツページのフォームでデバイスグループ定義用の設定テンプレートとして機能します。このダイアログの主な特徴を次に示します。
  • 場所: /libs/wcm/mobile/templates/devicegroup
  • 許可されたパス: /etc/mobile/groups/*
  • ページコンポーネント: wcm/mobile/components/devicegroup

サイトへのデバイスグループの割り当て

モバイルサイトを作成する場合は、デバイスグループをサイトに割り当てる必要があります。AEM には、デバイスの HTML および JavaScript のレンダリング機能に対応した 3 つのデバイスグループが用意されています。
  • フィーチャー ​フォン:Sony Ericsson W800 などのフィーチャーデバイス用。基本的な HTML はサポートされますが、画像と JavaScript はサポートされません。
  • スマート フォン、基本HTMLと画像はサポートするが、JavaScriptはサポートしないBlackberryなどのデバイス用。
  • タッチ ​フォン:iPad などのデバイス用。HTML、画像、JavaScript およびデバイスの回転が完全にサポートされます。
As emulators can be associated with a device group (see the section Creating a Device Group ), assigning a device group to a site enables authors to select between the emulators that are associated with the device group to edit the page.
デバイスグループをサイトに割り当てるには:
  1. ブラウザーで、 サイト管理者コンソール ​に移動します。
  2. Web サイト 」の下にあるモバイルサイトのルートページを開きます。
  3. ページプロパティを開きます。
  4. モバイル 」タブを選択します。
    • デバイスグループを定義します。
    • OK 」をクリックします。
サイト用のデバイスグループが定義済みの場合は、そのグループがサイトのすべてのページによって継承されます。

デバイスグループフィルター

デバイスグループフィルターは、デバイスがグループに属するかどうかを指定するための、機能に基づく条件を定義します。デバイスグループの作成時には、デバイスの評価に使用するフィルターを選択できます。
実行時に AEM がデバイスから HTTP 要求を受信すると、グループに関連付けられている各フィルターはデバイスの機能を特定の条件と比較します。フィルターが要求するすべての機能を備えたデバイスは、グループに属していると見なされます。機能は WURFL™ データベースから取得されます。
デバイスグループでは、0 個以上のフィルターを使用して機能を検出できます。また、複数のデバイスグループで 1 つのフィルターを使用することもできます。AEM には、グループ用に選択された機能がデバイスにあるかどうかを判断するデフォルトのフィルターが用意されています。
  • CSS
  • JPG 画像と PNG 画像
  • JavaScript
  • デバイスの回転
デバイスグループでフィルターを使用しない場合、デバイスが要求するのは、グループ用に設定された選択済みの機能のみです。
詳しくは、 デバイスグループフィルターの作成 を参照してください。

デバイスグループの作成

AEM がインストールするグループが要件を満たさない場合は、デバイスグループを作成します。
  1. ブラウザーで、 ツール ​コンソールに移動します。
  2. Create a new page below Tools > Mobile > Device Groups . In the Create Page dialog:
    • As Title enter Special Phones .
    • As Name enter special .
    • モバイルデバイスグループテンプレート 」を選択します。
    • 作成 」をクリックします。
  3. In CRXDE, add a static.css file containing the styles for the device group below the /etc/mobile/groups/special node.
  4. Open the Special Phones page.
  5. デバイスグループを設定するには、「 設定 」の横にある「 編集 」ボタンをクリックします。「 一般 」タブで、次の設定をおこないます。
    • タイトル :モバイルデバイスグループの名前。
    • 説明 :グループの説明
    • ユーザーエージェント :デバイスを照合するユーザーエージェント文字列。省略可能です。正規表現を使用できます。例: BlackBerryZ10
    • 機能 :グループで画像、CSS、JavaScript またはデバイスの回転を処理できるかどうかを定義します。
    • 画面の最小の幅 」と「 画面の最小の高さ
    • エミュレーターを無効にする :コンテンツの編集時にエミュレーターを有効または無効にします。
    エミュレーター 」タブで、次の設定をおこないます。
    • エミュレーター :デバイスグループに割り当てられたエミュレーターを選択します。
    フィルター 」タブで、次の設定をおこないます。
    • フィルターを追加するには、「項目を追加」をクリックして、ドロップダウンリストからフィルターを選択します。
    • フィルターは表示順に評価されます。デバイスがフィルターの条件を満たしていない場合、リスト内の後続のフィルターは評価されません。
  6. 「OK」をクリックします。
モバイルデバイスグループ設定ダイアログを次に示します。

デバイスグループ別のカスタム CSS

前述のとおり、デザインページの CSS と同様に、カスタム CSS をデバイスグループページに関連付けることができます。この CSS はオーサーインスタンスおよびパブリッシュインスタンスでページコンテンツのデバイスグループ固有のレンダリングに影響を与えるために使用されます。この CSS は次のページに自動的にインクルードされます。
  • このデバイスグループで使用する各エミュレーターのオーサーインスタンスのページ
  • パブリッシュインスタンスのページ(要求のユーザーエージェントがこの特定のデバイスグループ内のモバイルデバイスに一致する場合)

サーバー側のデバイス検出

HTTP 要求を実行するデバイスの機能を特定するには、フィルターおよびデバイス仕様のライブラリを使用します。

デバイスグループフィルターの開発

デバイスグループフィルターを作成して、一連のデバイスの機能の要件を定義します。デバイスの機能の必要なグループをターゲットとして指定するのに必要な数のフィルターを作成してください。
フィルターを組み合わせて機能のグループを定義できるようにフィルターを設計します。通常、異なるデバイスグループの機能は重複します。そのため、一部のフィルターを複数のデバイスグループ定義と共に使用できます。
作成したフィルターはグループ設定で使用できます。
詳しくは、 デバイスグループフィルターの作成 を参照してください。

WURFL™ データベースの使用

AEM uses a truncated version of the WURFL ™ database to query device capabilities, such as screen resolution or javascript support, based on the device's User-Agent.
The XML code of the WURFL™ database is represented as nodes below /var/mobile/devicespecs by parsing the wurfl.xml file at /libs/wcm/mobile/devicespecs/wurfl.xml. The expansion to nodes occurs the first time that the cq-mobile-core bundle is started.
デバイスの機能はノードプロパティとして格納されます。ノードはデバイスのモデルを表します。クエリを使用して、デバイスまたはユーザーエージェントの機能を取得できます。
WURFL™ データベースは進化しているので、データベースのカスタマイズまたは置き換えが必要になる場合があります。モバイルデバイスデータベースを更新するためのオプションは次のとおりです。
  • この使用方法を許可するライセンスを所有している場合は、ファイルを最新バージョンに置き換えます。別の WURFL データベースのインストールを参照してください。
  • Use the version that is available in AEM and configure a regexp that matches your User-Agent strings and points to an existing WURFL™ device. See Adding a regexp-based User-Agent Matching .

WURFL™ の機能へのユーザーエージェントのマッピングのテスト

デバイスがモバイルサイトにアクセスすると、AEM はそのデバイスを検出し、機能に従ってデバイスグループにマップします。また、デバイスグループに対応するページのビューを送信します。一致するデバイスグループが必要なスタイル設定情報を提供します。マッピングは、モバイルユーザーエージェントテストページでテストできます。
https://localhost:4502/etc/mobile/useragent-test.html

別の WURFL™ データベースのインストール

AEM と共にインストールされた WURFL™ データベースのうち、サポート対象外になるのは、2011 年 8 月 30 日以前のリリースです。 WURFL のバージョンが 2011 年 8 月 30 日以降にリリースされたものである場合は、使用方法がライセンスに適合していることを確認してください。
WURFL™ データベースをインストールするには:
  1. In CRXDE Lite, create the following folder: /apps/wcm/mobile/devicespecs
  2. WURFL™ ファイルをそのフォルダーにコピーします。
  3. Rename the file as wurfl.xml .
AEM automatically parses the wurfl.xml file and updates the nodes below /var/mobile/devicespecs .
WURFL™ データベース全体が有効な場合は、解析とアクティブ化に数分かかることがあります。進行状況の情報については、ログで確認できます。

正規表現に基づくユーザーエージェント照合の追加

既存のWURFL™デバイスタイプを指すように、user-agentを正規表現として/apps/wcm/mobile/devices/wurfl/regexpの下に追加します。
  1. CRXDE Lite で、/apps/wcm/mobile/devicespecs/regexp の下にノード(例:apple_ipad_ver1)を作成します。
  2. このノードに次のプロパティを追加します。
    • regexp :ユーザーエージェントを定義する正規表現。例:.*Mozilla.*iPad.*AppleWebKit. Safari.
    • deviceId :wurfl.xmlで定義されるデバイスID。例:apple_ipad_ver1
上記の設定により、User-Agentが指定された正規表現と一致するデバイスが、apple_ipad_ver1 WURFL™デバイスID(存在する場合)にマップされます。

クライアント側のデバイス検出

この節では、ページレンダリングを最適化するため、または代替のWebサイトバージョンをクライアントに提供するために、AEMのデバイスクライアント側検出を使用する方法について説明します。
AEMは、に基づくデバイスのクライアント側検出をサポートしま BrowserMap す。 BrowserMap は、AEMにクライアントライブラリとして、の下に出荷されま /etc/clientlibs/browsermap す。
BrowserMap には、代替Webサイトをクライアントに提供するために使用できる3つの方法が用意されています。これらの方法は、次の順序で使用されます。
クライアントライブラリの統合について詳しくは、 クライアント側 HTML ライブラリの使用 を参照してください。

デバイスグループ専用の URL の定義

代替リンクを使用しない場合は、各 DeviceGroup にグローバル URL を設定できます。クライアントライブラリを埋め込む独自のクライアントライブラリを作成し、デバ browsermap.standard イスグループを再定義することをお勧めします。
は、カスタマイズされたクライアントライブラリから同名の新しいデバイスグループを作成して BrowserMap BrowserMap オブジェクトに追加することで、デバイスグループ定義を上書きできるように設計されます。
詳しくは、 カスタマイズされた BrowserMap に関する節を参照してください。

セレクターベースの URL の定義

BrowserMap 用の代替サイトを指定するために以前のメカニズムを採用していない場合は、 DeviceGroups の名前を使用するセレクターが URL に追加されます。この場合、要求を処理する独自のサーブレットを指定する必要があります。
For example a device browsing www.example.com/index.html identified as smartphone by BrowserMap is forwarded to www.example.com/index.smartphone.html.

ページでの BrowserMap の使用

In order to use the standard BrowserMap client library in a page, you have to include the /libs/wcm/core/browsermap/browsermap.jsp file using a cq:include tag in your page's head section.
<cq:include script="/libs/wcm/core/browsermap/browsermap.jsp" />

Besides adding the BrowserMap client library in your JSP files, you also have to add a cq:deviceIdentificationMode String property set to client-side to the jcr:content node below the root of your web site.

BrowserMap のデフォルトの動作の上書き

BrowserMap を上書きするか、またはプローブを追加して) DeviceGroups をカスタマイズする場合は、 browsermap.standard クライアント側ライブラリを埋め込む独自のクライアント側ライブラリを作成する必要があります。
Furthermore, you have to manually call the BrowserMap.forwardRequest() method in your JavaScript code.
クライアントライブラリの統合について詳しくは、 クライアント側 HTML ライブラリの使用 を参照してください。
カスタマイズされた BrowserMap クライアントライブラリの作成が完了したら、次の手順を実行することをお勧めします。
  1. アプリケーションで browsermap.jsp ファイルを作成します。
    <%@include file="/libs/foundation/global.jsp" %>
    <%@ taglib prefix="c" uri="https://java.sun.com/jsp/jstl/core" %>
    <%@ page import="
        com.day.cq.wcm.api.variants.PageVariant,
        com.day.cq.wcm.api.variants.PageVariantsProvider,
        com.day.cq.wcm.api.devicedetection.DeviceIdentificationMode,
        com.day.cq.wcm.api.WCMMode"
    %>
    <%
        final PageVariantsProvider p = sling.getService(PageVariantsProvider.class);
        if(p == null) {
            throw new IllegalStateException("Missing PageVariantsProvider service");
        }
        for(PageVariant v : p.getVariants(currentPage, slingRequest)) {
            final String curVar = v.getAttributes().get("data-current-variant");
            String media = v.getAttributes().get("media");
            if (media != null) {
                media = media.replaceAll(" ", "");
            }
    %>
        <link
            rel="alternate"
            data-cq-role="site.variant"
            title="<%= xssAPI.encodeForHTMLAttr(v.getTitle()) %>"
            hreflang="<%= xssAPI.encodeForHTMLAttr(v.getAttributes().get("hreflang")) %>"
            media="<%= xssAPI.encodeForHTMLAttr(media) %>"
            href="<%= xssAPI.getValidHref(v.getURL()) %>"
            <% if(curVar != null) { %> data-current-variant="<%= curVar %>"<% } %>
        />
    <%
        }
        Boolean browserMapEnabled = true;
        final DeviceIdentificationMode dim = sling.getService(DeviceIdentificationMode.class);
        String[] selectors  = slingRequest.getRequestPathInfo().getSelectors();
        boolean isPortletRequest = false;
        for (int i = 0; i < selectors.length; i++) {
            if ("portlet".equals(selectors[i])) {
                isPortletRequest = true;
                break;
            }
        }
        if (isPortletRequest) {
            log.debug("Request was made by a portlet container - BrowserMap will not be embedded");
        } else {
            final WCMMode wcmMode = WCMMode.fromRequest(slingRequest);
            boolean shouldIncludeClientLib = false;
            if (WCMMode.EDIT != wcmMode && WCMMode.PREVIEW != wcmMode && WCMMode.DESIGN != wcmMode) {
                if (dim != null) {
                    final String mode = dim.getDeviceIdentificationModeForPage(currentPage);
                    shouldIncludeClientLib = DeviceIdentificationMode.CLIENT_SIDE.equals(mode);
                    if (shouldIncludeClientLib) {
                        browserMapEnabled = (Boolean) request.getAttribute("browsermap.enabled");
                        if (browserMapEnabled == null) {
                            browserMapEnabled = true;
                        }
                    }
                }
            }
    %>
            <c:if test="<%= !browserMapEnabled %>">
                <meta name="browsermap.enabled" content="false">
            </c:if>
            <c:if test="<%= shouldIncludeClientLib %>">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <cq:includeClientLib categories="browsermap.custom"/>
            </c:if>
    <%
        }
    %>
    
    
  2. head セクションに broswermap.jsp ファイルをインクルードします。
    <cq:include script="browsermap.jsp" />
    
    

特定のページからの BrowserMap の除外

クライアント検出が不要な一部のページから BrowserMap ライブラリを除外する場合は、request 属性を追加できます。
<%
request.setAttribute("browsermap.enabled", false);
%>

This will make the /libs/wcm/core/browsermap/browsermap.jsp script to add a meta tag to the page that will make BrowserMap to not perform any detection:
<meta name="browsermap.enabled" content="false">

特定のバージョンの Web サイトのテスト

通常、BrowserMap スクリプトは常に訪問者を最適なバージョンの Web サイト(デスクトップ、または必要に応じてモバイルサイト)にリダイレクトします。
特定のバージョンの Web サイトをテストするために、 device パラメーターを URL に追加して、要求のデバイスを強制することができます。次の URL は、モバイルバージョンの Geometrixx Outdoors Web サイトをレンダリングします。
https://localhost:4502/content/geometrixx-outdoors/en.html?wcmmode=disabled&device=smartphone
パブリッシュインスタンスの動作をシミュレートするために、 wcmmode パラメーターは disabled に設定されます。
上書きされた の値は Cookie に格納されるので、 device device パラメーターを各 URL に追加せずに Web サイトを閲覧できます。
その結果、デスクトップバージョンの Web サイトに戻るには、 URL device に設定された同じ browser を呼び出す必要があります。
BrowserMap は、上書きされた device の値を BMAP_device という Cookie に格納します。この Cookie を削除すると、CQ は現在のデバイス(デスクトップまたはモバイル)に従って適切なバージョンの Web サイトを提供します。

モバイルの要求の処理

AEM は、タッチデバイスグループに属するモバイルデバイスが発行した要求を次のように処理します。
  1. An iPad sends a request to the AEM publish instance, e.g. https://localhost:4503/content/geometrixx_mobile/en/products.html
  2. AEM determines whether the site of the requested page is a mobile site (by checking whether the first level page /content/geometrixx_mobile extends the mobile page component). 該当する場合:
  3. AEMは、リクエストヘッダー内のUser-Agentに基づいてデバイスの機能を調べます。
  4. AEM maps the device capabilities to the device group and sets touch as the device group selector.
  5. AEMはリクエストを https://localhost:4503/content/geometrixx_mobile/en/products.touch.html.
  6. AEMは応答をiPadに送信します。
    • products.touch.html は通常の方法でレンダリングされます。このページはキャッシュ可能です。
    • レンダリングコンポーネントでは、セレクターを使用してプレゼンテーションを変更します。
    • AEMは、モバイルセレクターをページ内のすべての内部リンクに自動的に追加します。

統計

モバイルデバイスによってAEMサーバーに対して行われた要求の数に関する統計をいくつか取得できます。リクエストの数は次のように分類できます。
  • デバイスグループ別およびデバイス別
  • 年別、月別、日別
統計を表示するには:
  1. ツール ​コンソールに移動します。
  2. ツール モバイル ​から​ デバイスの統計 ​ページを開きます。
  3. リンクをクリックして、特定の年、月または日の統計を表示します。
統計 ​ページを次に示します。
The Statistics page is created the first time a mobile device accesses AEM and is detected. Before that, it is not available.
統計内にエントリを生成する必要がある場合は、次の手順を実行できます。
  1. モバイルデバイスまたはエミュレーターを使用します(例:https://chrispederick.com/work/user-agent-switcher/ on Firefox)。
  2. オーサリングモードを無効にして、オーサーインスタンスのモバイルページをリクエストします。例: https://localhost:4502/content/geometrixx_mobile/en/products.html?wcmmode=disabled
これで、 統計 ​ページを使用できるようになります。