コミュニティコンポーネントの clientlib

概要

ドキュメントのこの節では、コミュニティコンポーネント用のクライアント側ライブラリ(clientlib)をページに追加する方法について説明します。

基本情報については、以下を参照してください。

clientlib が必要になる理由

コンポーネントを正しく機能させ(JavaScript)、スタイル設定する(CSS)には、clientlib が必要です。

When there exists a community function for a feature, all necessary components and configurations, including the required clientlibs, will be present in the community site. 作成者が追加のコンポーネントを使用できる場合にのみ、追加のclientlibを追加する必要があります。

必須の clientlib が欠落していると、ページにコミュニティコンポーネントを追加したときに、JavaScript エラーが発生したり、予期しない外観が生じたりする可能性があります。

例:clientlib が欠落している場合のレビューの配置

配置されたレビュー

例:clientlib が存在する場合のレビューの配置

reviews-clientlibs

必須の clientlib の識別

開発者向けの基本機能情報の中で、必須の clientlib が識別されています。

また、AEM インスタンスからコミュニティコンポーネントガイドを参照すると、コンポーネントに必須の clientlib カテゴリのリストにアクセスできます。

For example, at the very top of the Reviews page the required clientlibs listed are

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

clientlibs-reviews

必須の clientlib の追加

コミュニティコンポーネントをページに追加する場合、コンポーネントに必須の clientlib がまだ存在しなければ、追加する必要があります。

CRXDE|Lite を使用すると、コミュニティサイトページの既存の clientlibslist を変更できます。

CRXDE Liteを使用してコミュニティサイトのclientlibを追加するには:

  • Browse to https://<server>:<port>/crx/de.

  • Locate the clientlibslist node for the page on which you wish to add the component:

    • /content/sites/sample/en/page/jcr:content/clientlibslist
  • With clientlibslist node selected:

    • String[] プロパティを探し scg:requiredClientLibsます。

    • Select its Value to access the String array dialog.

      • 必要に応じて下にスクロールします。

      • 「+」を選択して、新しいクライアントライブラリを入力します。

        • さらにクライアントライブラリを追加する場合は、同じ手順を繰り返します。

        • OK」を選択します。

    • Select Save All.

メモ

コミュニティサイト以外のサイトでは、使用されているクライアントライブラリの有無や場所を調べる必要があります。

ここでは、AEM Communities 使用の手引きの例(site-nameengage)を引用し、レビューコンポーネントを追加する場合に clientliblist がどのように表示されるかを示しています。

レビューコンポーネント

このページ