主题如何在Adobe AEM中应用？

问题描述：

Adobe AEM（以前称为Adobe CQ）中的客户端库（ClientLib）功能使按类别包含客户端库变得容易，每个库都可以通过依赖项引入其他库。但是，有关主题的文档有点薄。

The Client Library (ClientLib) feature in Adobe AEM (formerly Adobe CQ) makes it easy to include client libraries by category and each library can pull in other libraries through dependencies. However the documentation around "Themes" is a little thin.

此链接是我在该主题上能找到的全部内容。这是示例代码的摘录：

This link is about all I can find on the subject. Here is an excerpt of the sample code:

<%-- theme only (theme-js + css) --%>
<cq:includeClientLib theme="cq.collab.calendar, cq.security" />

如果要使用此标签，CQ将如何确定要插入的客户库？它是否寻找String []类型的主题属性？

If this tag were to be used how would CQ determine what Client Libs to pull in? Does it look for a theme property of type String[]?

还是在/ etc / designs部分中寻找某个目录结构？

Or does it look for a certain directory structure in the /etc/designs section?

还是采用传递的类别并像这样在最后添加theme-js？

Or does it take the passed in categories and add theme-js to the end like so?

cq.collab.calendar.theme-js

还是主题通过URL调用？换句话说，在这种情况下，主题一词是被替换为URL应用主题中的选择器的令牌吗？

Or is the theme invoked through the URL? In other words, the word "theme", in this case, is a token that is replaced with a selector from a URL applied theme?

答

客户端库位于cq：ClientLibraryFolder文件夹中。此文件夹具有一个名为category的属性。在下面的示例中，cq.collab.calendar和cq.security是类别：

Client Libraries reside in a cq:ClientLibraryFolder folder. This folder has a property called category. In the following example, cq.collab.calendar and cq.security are categories:

<cq:includeClientLib theme="cq.collab.calendar, cq.security" />

调用此include时，它将查找任何类别为cq.collab的cq：ClientLibraryFolder。日历或分配给它的cq.security。 使用主题属性会将位于客户端ClientLibraryFolder的主题文件夹中的clientLib的css和javascript添加。如果要查看页面源代码，则会将它们添加到它们自己的css和js文件中。例如，我在geometrixx clientLibary下创建了以下结构：

When this include is called, it is looking for any cq:ClientLibraryFolder with the category cq.collab.calendar or cq.security assigned to it. Using the theme property adds both the css and javascript of clientLibs residing in the themes folder of the parent ClientLibraryFolder. If you were to view your page source, these would be added to their own css and js files. For example, I created the following structure under the geometrixx clientLibary:

geometrixx
    clientlibs
        themes
            myTheme (clientLibray)
               css.txt
               myCSS.css
               js.txt
               myJS.js

如果在此clientlib中使用theme属性，则会在源/网络选项卡中显示myTheme.css和myTheme.js文件。

If, you use the theme property with this clientlib you would get a myTheme.css and myTheme.js file showing in your source/network tab.

主题标志是关闭和关闭主题包含的一种方法。以下cq：include将包括clientLibrary中的所有css，包括主题目录中的内容。

The themed flag is a way to shut theme inclusion on and off. The following cq:include will include all the css in the clientLibrary, including stuff in the themes directory.

<cq:includeClientLib css="apps.geometrixx-main" />

但是，如果我添加主题标志并将其设置为false，则排除主题目录下的任何内容：

However, if I add the themed flag and set it to false, anything under the theme directory is excluded:

<cq:includeClientLib css="apps.geometrixx-main" themed="false" />

因此，在这种情况下，myTheme.css将不会显示。需要注意的一件事是，主题标志仅适用于纯CSS和js包含类别和主题属性，不适用于此。

So in that case, myTheme.css would not show up. One thing to note, is that the themed flag, only works on "pure css and js includes" Categories and theme properties would not work with this.

对此的答案问题稍微解决了这个问题： currentDesign.writeCssincludes到底包含什么？

The answer to this question goes over this a bit: What exactly does currentDesign.writeCssincludes include?

主题如何在Adobe AEM中应用？

相关推荐