1

我对 AEM 和 Sightly 有点陌生。我编写了一个“页面”组件来容纳我的页面内容。我有许多具有不同 CSS 的设备，/etc/designs/myapp如下所示：

/etc/designs/myapp

- /128/style.css
- /240/style.css

等等等等。

回到我的页面组件中，我有许多不同的 HTML 文件，用于通过 Sling 选择器触发正确的 CSS。例如：

/apps/myapp/components/page

- 128.html
- 240.html

这些文件的目的是将<head>带有 CSS 的 HTML 部分作为内联样式包含在内（由于设备限制，无法链接到外部 CSS）。

我遇到的问题是，如果我将 128/style.css 放在组件本身内，则包含工作。如果我有它/etc/designs/myapp，我无法正确包含它。我尝试过使用${currentDesign.path @ appendPath='/128/style.css'}并且我尝试过明确引用整个路径。

下面是 128.html 的示例，在页面组件下：

<html>
<head><!--/*
    */--><div data-sly-include="/libs/wcm/core/components/init/init.jsp" data-sly-unwrap></div><!--/*
    */-->

    <title>${currentPage.title}</title>
        <div data-sly-unwrap data-sly-include="/etc/designs/myapp/128/style.css"></div>
</head>
<body class="main" role="document" data-sly-include="body.html"></body>
</html>

我意识到我需要一个<style></style>包含任何 CSS 的部分，但是现在，我只是想从/etc/designs.

任何帮助将不胜感激。

4

1 回答 1

0

从 data-sly-include 的定义：https ://docs.adobe.com/docs/en/aem/6-1/develop/sightly/block-statements.html#include

data-sly-include：当它被相应的模板引擎处理时，将宿主元素的内容替换为由指示的 HTML 模板文件（Sightly、JSP、ESP 等）生成的标记。包含文件的渲染上下文将不包含当前的 Sightly 上下文（包含文件的上下文）；因此，为了包含 Sightly 文件，当前的 data-sly-use 必须在包含的文件中重复（在这种情况下，通常最好使用 data-sly-template 和 data-sly-call）

它不适用于您尝试执行的包含类型，因为您没有调用任何渲染器。我认为您应该使用客户端库并仅包含您的 CSS 文件，这是有关此的文档：http: //blogs.adobe.com/experiencedelivers/experience-management/sightly-clientlibs/

您应该为每种样式定义一个客户端库类别，并在需要时调用正确的客户端库<meta data-sly-call="${clientLib.css @ categories='category.style.128'}" data-sly-unwrap></meta>

希望这可以帮助。

于 2016-01-04T20:23:32.347 回答