適用於社群元件的Clientlibs clientlibs-for-communities-components

簡介 introduction

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

如需基本資訊,請參閱下列內容:

為何需要Clientlibs why-clientlibs-are-required

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

當存在 社群功能 就功能而言,所有必要的元件和設定(包括必要的clientlibs)都會出現在社群網站中。 只有當作者可以使用其他元件時,才能新增其他clientlibs。

當缺少必要的clientlibs時, 將Communities元件新增至頁面 可能會導致JavaScript錯誤和意外外觀。

範例:不含Clientlibs的置入稽核 example-placed-reviews-without-clientlibs

置入的評論

範例:使用Clientlibs置入的評論 example-placed-reviews-with-clientlibs

reviews-clientlibs

識別必要的Clientlibs identifying-required-clientlibs

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

此外,從AEM執行個體瀏覽至 社群元件指南 提供元件所需clientlib類別清單的存取權。

例如,在頂端的 評論頁面 列出的必要clientlibs為

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

clientlibs-reviews

新增必要的Clientlibs adding-required-clientlibs

當想要將Communities元件新增至頁面時,必須為該元件新增必要的clientlibs (如果尚未存在)。

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

若要使用為社群網站新增clientlib CRXDE Lite

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

  • 找到 clientlibslist 要新增元件的頁面節點:

    • /content/sites/sample/en/page/jcr:content/clientlibslist
  • 替換為 clientlibslist 選取的節點:

    • 找出字串[] 屬性 scg:requiredClientLibs.

    • 選取其 Value 以便存取「字串陣列」對話方塊。

      • 如有需要,向下捲動。

      • 選取+以輸入新的使用者端資源庫。

        • 重複以上步驟以新增更多使用者端程式庫。

        • 選取 確定.

    • 選取 全部儲存.

NOTE
如果網站不是社群網站,則必須探索網站所使用的使用者端程式庫的存在或位置。

使用 AEM Communities快速入門 範例,其中 site-name參與,這是新增檢閱元件時clientliblist的顯示方式:

review-component

recommendation-more-help
81e2cd9d-0789-409d-b87c-2a8ce4f28791