自适应模板渲染

自适应模板渲染提供了一种管理具有各种变体的页面的方法。 此功能最初对于为移动设备提供各种HTML输出（例如功能电话与智能电话）很有用，当需要向需要不同标记或HTML输出的不同设备提供体验时，此功能非常有用。

概述

模板通常围绕响应式网格构建，而基于这些模板创建的页面完全响应式，可根据客户端设备的视口自动调整。 使用页面编辑器中的“模拟器”工具栏，作者可以将布局目标到特定设备。

还可以设置模板以支持自适应渲染。 正确配置设备组后，当在模拟器模式中选择设备时，将在URL中使用其他选择器呈现页面。 使用选择器，可通过URL直接调用特定页面呈现。

设置设备组时请记住：

• 每个设备必须位于至少一个设备组中。
• 一个设备可以位于多个设备组中。
• 由于设备可以位于多个设备组中，因此可以组合选择器。
• 选择器组合将从上到下评估，因为它们会保留在存储库中。

配置

可以为现有设备组或您自己创建的组配置自适应呈现选择器。

对于此示例，我们将配置现有设备组​智能电话，以使其具有自适应呈现选择器，作为We.Retail中​体验页面​模板的一部分。

1. 编辑http://localhost:4502/miscadmin#/etc/mobile/groups中需要自适应选择器的设备组

   设置选项​禁用模拟器​并保存。

   

2. 选择器将可用于​Blackberry​和​iPhone 4，前提是在以下步骤中将设备组​智能电话​添加到模板和页面结构中。

   

3. 使用CRX DE Lite，通过将设备组添加到模板结构上的多值字符串属性cq:deviceGroups，允许在模板上使用设备组。

   /conf/<your-site>/settings/wcm/templates/<your-template>/structure/jcr:content

   例如，如果我们希望添加智能电话设备组：

   /conf/we-retail/settings/wcm/templates/experience-page/structure/jcr:content

   

4. 使用CRX DE Lite，通过将设备组添加到站点结构上的多值字符串属性cq:deviceGroups中，允许在您的站点上使用设备组。

   /content/<your-site>/jcr:content

   例如，如果我们要允许​智能电话​设备组：

   /content/we-retail/jcr:content

   

现在，当在页面编辑器中使用emulator时（例如，当修改布局时），您选择所配置设备组的设备时，将使用选择器呈现页面，作为URL的一部分。

在我们的示例中，当根据​体验页面​模板编辑页面并在模拟器中选择iPhone 4时，将呈现该页面，其中将选择器作为arctic-surfing-in-lofoten.smart.html而不是arctic-surfing-in-lofoten.html呈现

也可以使用此选择器直接调用页面。