Integración de tipo 3 - Ejemplo: Google AdSense
También puede utilizar CCM19 para habilitar y ejecutar scripts bloqueados en el código fuente a través de Consent.
Para ello, debe asignar a sus scripts nuestro valor específico de CCM19-para el atributo type-. Gracias a este ajuste, el navegador ya no reconoce el script correspondiente como código JavaScript-que debe ejecutarse y, en un primer momento, no lo procesa.
A continuación, explicaremos paso a paso, mediante un ejemplo, cómo modificar el atributo type en su sitio web. En el ejemplo, configuramos Google Adsense para un sitio web y realizamos los ajustes necesarios en el script para que todo se configure de acuerdo con el RGPD, la TTDSG y las directrices de la IAB, así como las de Google.
1. Localizar el script
En primer lugar, debemos encontrar todos los scripts en su sitio web. A menudo, los scripts se colocan en el sitio web, ya que se cargan en todas las páginas del dominio. Sin embargo, en el caso de Google Adsense, además del script general, se obtienen otros que se integran con los anuncios individuales.
Aquí vemos el script para su integración en la página:
<script async data-ad-client="ca-pub-XXXXXXXXXXXXXXX"
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
></script>
Y aquí hay un ejemplo de un anuncio horizontal que se coloca en una ubicación fija de la página:
<script async crossorigin="anonymous"
src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXX"
></script>
<!-- Prueba de anuncio horizontal -- >
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-XXXXXXXXXXXXXXXXX"
data-ad-slot="XXXXXXXXX"
data-ad-format="auto"
data-full-width-responsive="true"></ins><script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>```
### 2. Ajustar los atributos src y type
Una vez localizados todos los scripts que queremos someter al control de CCM19, podemos añadir la siguiente parte o modificar los atributos existentes según corresponda:
Añada el atributo `type`-de la siguiente manera o actualice el valor si el atributo ya existe. El atributo se define en la etiqueta de apertura `script`-(dentro de los corchetes `<>`).
Además, no utilice el atributo `src`-para especificar la URL del script-, sino `data-ccm-loader-src`. Con este ajuste, el navegador ya no reconoce el script correspondiente como código JavaScript-ejecutable y, en un primer momento, no lo procesa.
Con este ajuste se evita de forma efectiva que el navegador cargue el recurso o el script sin consentimiento. Los scripts solo se cargan y se ejecutan una vez que se ha dado el consentimiento.
```html
<script async data-ad-client="ca-pub-XXXXXXXXXXXXXX"
data-ccm-loader-src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
type="text/x-ccm-loader"
></script>
Los saltos de línea solo sirven para facilitar la visualización; también se puede escribir todo en una sola línea. Asegúrese de que todos los atributos estén separados por un espacio.
Dado que también tenemos otros scripts, ahora hay que modificar todos los demás. En nuestro ejemplo, esto afecta también a la visualización horizontal:
<script async crossorigin="anonymous"
data-ccm-loader-src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXX"
type="text/x-ccm-loader"
></script>
<!-- Prueba de anuncio horizontal -- >
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-XXXXXXXXXXXXXXXXX"
data-ad-slot="XXXXXXXXX"
data-ad-format="auto"
data-full-width-responsive="true"></ins><script type="text/x-ccm-loader">
(adsbygoogle = window.adsbygoogle || []).push({});
</script>```
### 3. Añadir el nombre del grupo
Para que los scripts puedan activarse conjuntamente o mediante el consentimiento de los visitantes, añadimos otro atributo a los scripts:
La expresión entre comillas se puede elegir libremente. En este caso, hemos optado por «adsbygoogle».
Ahora añadimos esta parte a los scripts ya modificados, detrás del atributo «-»:
```html
<script async data-ad-client="ca-pub-XXXXXXXXXXXXXX"
data-ccm-loader-group="adsbygoogle"
data-ccm-loader-src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"
type="text/x-ccm-loader"
></script>
Y de nuevo en la visualización horizontal:
<script async crossorigin="anonymous"
data-ccm-loader-group="adsbygoogle"
data-ccm-loader-src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXX"
type="text/x-ccm-loader"
></script>
<!-- Prueba de anuncio horizontal -- >
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-XXXXXXXXXXXXXXXXX"
data-ad-slot="XXXXXXXXX"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script type="text/x<nt>-</nt>ccm<nt>-</nt>loader" data-ccm-loader-group="adsbygoogle">
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
4. Definir la agrupación en CCM19
Por el momento, la última medida aún no surte efecto, ya que CCM19 no reconoce la agrupación. Por lo tanto, vamos a la interfaz de administración de CCM19, buscamos la incrustación correspondiente y la editamos:
Aquí vemos, bastante arriba, un campo para introducir nombres de grupo. Allí introducimos el nombre del grupo que hemos definido nosotros mismos. En nuestro caso, es «adsbygoogle».
¡No olvide guardar los cambios!