Pour chaque modèle, vous pouvez ajouter du code HTML personnalisé. Ce code HTML peut être utilisé pour personnaliser davantage l'apparence de la couche de consentement en y ajoutant du nouveau contenu. Un exemple courant est le consentement en mode split-view :

Dans l'exemple ci-dessus, la partie gauche de la couche correspond à la couche de consentement d'origine. La partie droite de la couche correspond au code HTML personnalisé ajouté à ce design.

Comment le code HTML est-il inséré dans la couche de consentement ?

La couche de consentement se compose généralement d'un <div> élément pour la couche externe (classe CSS cmpbox) et d’un  <div> élément pour la partie interne de la couche (classe CSS cmpboxinner). Si du code HTML personnalisé est utilisé, le CMP créera un autre <div> à l'intérieur de la couche externe et y placera à la fois la couche interne et le code HTML personnalisé.

Placer le contenu côte à côte

Pour placer la couche interne à côté de votre code HTML personnalisé, vous pouvez utiliser du CSS display:flex sur l' <div> avec la classe CSS cmpboxcontainer. Vous trouverez ici une configuration très simple pour une couche de consentement avec du contenu à gauche/à droite :

Ajouter un bouton d'acceptation personnalisé

Si vous avez simplement besoin d'un bouton « Accepter/Refuser » qui n'accepte ni ne refuse tous les fournisseurs, vous pouvez le faire en utilisant des variables de configuration côté client. L'exemple ci-dessous ajoute un bouton « Accepter sans publicité comportementale » au premier niveau. Cliquer sur ce bouton n'activera que les finalités 1, 2, 7, 8 et 10 du TCF de l'IAB (sans activer les finalités 3, 4, 5, 6 et 9, qui sont destinées à la personnalisation).

 <script>
  window.cmp_custombutton = true;
  window.cmp_custombutton_name = 'Accept without Behavorial Advertising';
  window.cmp_custombutton_pos = 1;
  window.cmp_custombutton_purposes = [1,2,7,8,10];
 </script>