Para cada diseño puedes añadir código HTML personalizado. El código HTML se puede utilizar para personalizar aún más el diseño de la capa de consentimiento añadiéndole nuevo contenido. Un ejemplo habitual de esto es el consentimiento en vista dividida:

En el ejemplo anterior, la parte izquierda de la capa es la capa de consentimiento original. La parte derecha de la capa es código HTML personalizado añadido a este diseño.

Cómo se inserta el código HTML en la capa de consentimiento

La capa de consentimiento suele consistir en un <div> elemento para la capa exterior (clase CSS cmpbox) y  <div> elemento para la parte interior de la capa (clase CSS cmpboxinner). Si se utiliza código HTML personalizado, el CMP creará otro <div> dentro de la capa exterior y colocará en él tanto la capa interior como el código HTML personalizado.

Coloca el contenido uno al lado del otro

Para colocar la capa interna junto a tu HTML personalizado, puedes utilizar CSS display:flex en el <div> con la clase CSS cmpboxcontainer. Aquí puedes ver una configuración muy sencilla para una capa de consentimiento con contenido a la izquierda/derecha:

Añadir un botón de aceptación personalizado

Si lo único que necesitas es un botón de aceptar/rechazar que no acepte ni rechace a todos los proveedores, puedes hacerlo utilizando variables de configuración del lado del cliente. El ejemplo siguiente añade un botón «Aceptar sin publicidad basada en el comportamiento» a la primera capa. Al hacer clic en el botón, solo se habilitarán los fines 1, 2, 7, 8 y 10 del TCF de la IAB (sin habilitar los fines 3, 4, 5, 6 y 9, que están destinados a la personalización).

 <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>