Communities元件的Clientlibs

簡介

本檔案的本節說明如何將用戶端程式庫(clientlibs)新增至Communities元件的頁面。

如需基本資訊，請造訪：

• 使用用戶端程式 庫（提供使用情況詳細資訊及除錯工具）
• SCF的客戶端 庫，在定制SCF元件時提供有用的資訊
• 部落格：AEM用戶端程式庫（由範例說明）

為何需要Clientlibs

元件的正常運作(JavaScript)和樣式(CSS)需要Clientlibs。

當功能有社群函式時，所有必要的元件和設定（包括必要的clientlib）都會出現在社群網站中。 只有當作者能使用其他元件時，才需要新增其他clientlib。

當缺少所需的clientlib時，將Communities元件新增至頁面可能會導致javascript錯誤以及意外的外觀。

範例：未使用Clientlibs的置入評論

範例：使用Clientlibs進行置入的審核

標識所需的Clientlibs

開發人員的基本功能資訊可識別所需的用戶端。

此外，從AEM實例瀏覽到Community Components Guide，可以訪問元件所需的clientlib類別清單。

例如，在「檢閱」頁面的最上方，列出必要的clientlib

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

新增必要的Clientlibs

需要將Communities元件新增至頁面時，必須為元件新增所需的clientlib（如果尚未出現）。

使用CRXDE|Lite修改社群網站頁面的現有clientlibslist。

要使用CRXDE Lite為社區站點添加clientlib，請執行以下操作：

• 瀏覽至https://<server>:<port>/crx/de

• 找出您要新增元件之頁面的clientlibslist節點

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

• 已選擇clientlibslist節點

  • 找到String[]屬性scg:requiredClientLibs

  • 選擇其Value以訪問字串陣列對話框

    • 如有必要，向下捲動

    • 選擇+以輸入新的客戶端庫

      • 重複以添加更多客戶端庫

    • 選擇​OK

  • 選擇​保存全部

使用AEM Communities快速入門範例（其中site-name為​engage），新增審核元件時，clientliblist會如下所示：