A quoi sert une balise div générée automatiquement autour d’un composant

Par exemple, si un composant est inclus par la balise <cq:include>, une balise div est automatiquement ajoutée autour du composant dans le code HTML généré.
A quoi sert cette balise div et est-il possible de supprimer la création automatique de cette balise ?

Réponse, résolution

Cette balise div est utilisée pour le système de modification de CQ5 (redimensionner les barres de modification, images de survol, etc.), le système de conception de CQ5 (définition du nom de classe CSS, définition du style de CSS) et pour identifier le composant dans le DOM client.

Il est possible de supprimer cette balise div générée en spécifiant une propriété vide cq:cellName dans la définition du composant (voir la rubrique Comment sont créés les identifiants des cellules de conception) ou à l'aide de IncludeOptions.forceSameContext(true).
Remarque : dans les deux cas, vous ne pourrez plus modifier le composant (c'est-à-dire aucune boîte de dialogue).

La balise div générée comporte toujours au moins un attribut nom de classe CSS créé à partir du nom de la cellule du composant (voir la rubrique Comment sont créés les identifiants des cellules de conception) utilisé pour définir le style de CSS du composant.
Cet attribut nom de classe CSS ne peut pas être supprimé.
Il est possible d'ajouter des attributs complémentaires pour cette balise div générée, par le nœud cq:htmlTag dans la définition du composant.
Chaque propriété de ce nœud est ajoutée comme attribut de balise.
Il est également possible de remplacer l'attribut nom de classe CSS de la balise div en ajoutant la propriété classe dans le nœud cq:htmlTag.
Dans ce cas, le nom de cellule n'est plus ajouté automatiquement. Par conséquent, les propriétés de conception pertinentes du CSS de la boîte de dialogue de conception (ajoutées au fichier de conception css créé) n'ont plus aucun effet -> le nom de cellule doit être ajouté manuellement à la classe de la propriété dans le nœud cq:htmlTag.

Le fichier de conception du css généré automatiquement (/etc/designs/<designname>.css) comprend les propriétés de conception pertinentes du CSS de la boîte de dialogue de conception avec le nom de classe CSS équivalent à la balise div du composant. Vous devez vous assurer que les noms de classe CSS dans votre fichier css statique (/etc/designs/<designname>/static.css) ne sont pas en conflit avec ces noms.

CQ5.3 et versions ultérieures.

En commençant par CQ5.3, un nouveau API plus dédié à été mis en place pour offrir un meilleur contrôle des balises de décoration (créées automatiquement) :

• option permettant de spécifier le nom de balise pour un composant (cq:htmlTag/cq:tagName property)
• option permettant de contrôler la balise par inclure : IncludeOptions#setDecorationTagName
  
• option pour contrôler le nom de balise par défaut : ComponentContext#setDefaultDecorationTagName

Toutes les options ci-dessus permettent de supprimer la balise de décoration si elle est définie sur une chaîne vide.

S’applique à

CQ5.2
CQ5.3+