适用于社区组件的Clientlibs

简介

文档的此部分介绍如何将客户端库(clientlibs)添加到社区组件的页面。

有关基本信息，请访问：

为何需要Clientlibs

组件正常运行(JavaScript)和样式(CSS)需要Clientlibs。

当某个功能存在社区函数时，所有必需的组件和配置（包括所需的clientlib）都将出现在社区站点中。 只有当其他组件可供作者使用时，才需要添加其他clientlib。

当缺少所需的clientlib时， 将社区组件添加到页面可能会导致javascript错误以及意外外观。

示例：未使用Clientlibs进行审阅

置入审阅

示例：使用Clientlibs进行审阅

reviews-clientlibs

确定所需的Clientlib

面向开发人员的基本功能信息可识别所需的客户端库。

此外，从AEM实例浏览到社区组件指南可访问组件所需的clientlib类别列表。

例如，在Reviews页面的最顶部列出了所需的clientlib

  • cq.ckeditor
  • cq.social.hbs.reviews

clientlibs reviews

添加必需的Clientlibs

当需要向页面添加社区组件时，如果组件尚不存在，则需要为该组件添加所需的clientlib。

使用CRXDE|Lite修改社区站点页面的现有clientlibslist。

要使用CRXDE Lite为社区站点添加clientlib，请执行以下操作：

  • 浏览到https://<server>:<port>/crx/de。

  • 在要添加组件的页面上找到clientlibslist节点：

    • /content/sites/sample/en/page/jcr:content/clientlibslist

  • 选择clientlibslist节点后：

    • 找到字符串[]属性scg:requiredClientLibs。

    • 选择其Value以访问字符串数组对话框。

      • 根据需要向下滚动。

      • 选择+以输入新的客户端库。

        • 重复以添加更多客户端库。

        • 选择​确定。

    • 选择​全部保存。

注意

如果网站不是社区网站，则需要发现网站正在使用的客户端库的存在或位置。

使用AEM Communities快速入门示例（其中site-name为​engage），添加reviews组件时，clientliblist的显示方式如下：

审阅组件

在此页面上