質問

コンポーネントが <cq:include> タグなどによって含まれている場合は、生成された HTML コンポーネントの周囲に、div タグが自動的に追加されます。
この div タグは何のために使用しますか?自動作成を無効にすることはできますか?

回答、解決策

この div タグは CQ5 の編集システム(編集バー、ロールオーバーフレームなどの描画)、CQ5 のデザイナーシステム(CSS クラス名、デザイナー CSS スタイルの設定)に使用され、クライアント DOM でコンポーネントを識別するためにも使用されます。

コンポーネント定義(デザインセル ID をビルドする方法を参照)で空のプロパティ cq:cellName を指定するか、IncludeOptions.forceSameContext(true) を使用することによって、この生成された div タグを無効にすることができます。
注意:いずれの場合も、コンポーネントをさらに編集することはできません(つまり、ダイアログはありません)。

生成された div タグでは、常に少なくとも 1 つの CSS クラス名属性があり、コンポーネントの CSS のスタイル設定に使用されるコンポーネント(デザインセル ID を生成する方法を参照)のセル名から生成されます。
この CSS クラス名属性は無効にすることはできません。
コンポーネント定義のノード cq:htmlTag によってこの生成された div タグに属性を追加することができます。
このノードの各プロパティは、タグ属性として追加されます。
ノード cq:htmlTagclass プロパティを追加することで、DIV タグの CSS クラス属性名を「上書き」することができます。
この場合、セル名は自動的に追加されません。デザインダイアログボックス(生成された Designer CSS ファイルに追加済み)の CSS に関連するデザインプロパティには、影響はありません -> セル名をノード cq:htmlTag にある class プロパティに手動で追加する必要があります。

自動生成された Designer CSS ファイル(/etc/designs/<designname>.css)は、CSS 関連デザインプロパティフォームのコンポーネント DIV と同じ CSS クラス名とデザインダイアログボックスを含みます。静的 CSS ファイル(/etc/designs/<designname>/static.css)の CSS クラス名と競合しないように注意する必要があります。

CQ5.3 またはそれ以降

CQ5.3 以降では、(自動的に作成された)デコレーションタグのコントロールがしやすい新しい、専用の API が実装されています:

  • コンポーネントのタグ名を指定するためのオプション(cq:htmlTag/cq:tagName プロパティ)
  • タグをコントロールするためのオプションは、次のとおりです。IncludeOptions#setDecorationTagName
  • デフォルトのタグ名を制御するためのオプション:ComponentContext#setDefaultDecorationTagName

上記のすべてのオプションは、空の文字列に設定されている場合、装飾タグを無効にすることができます。

適用対象

CQ5.2
CQ5.3+

本作品は Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License によってライセンス許可を受けています。  Twitter™ および Facebook の投稿には、Creative Commons の規約内容は適用されません。

法律上の注意   |   プライバシーポリシー