Acerca de la obsolescencia de Checkout Extensibility en Shopify: Probablemente ya sepas que los scripts de Checkout Extensibility en Shopify están quedando obsoletos. Como resultado, el banner de consentimiento ya no aparecerá durante el proceso de pago. Sin embargo, si implementas el modo de consentimiento de Shopify tal y como se describe en nuestros documentos de ayuda, Shopify gestionará el consentimiento por ti de forma fluida. Tenga la seguridad de que, si sigue nuestras directrices, todo funcionará a la perfección. Para obtener instrucciones detalladas, siga leyendo.
Nota: La siguiente descripción solo es válida para el código de bloqueo manual. Si deseas utilizar el bloqueo automático de código, asegúrate de que el código CMP se inserte directamente después del <head> elemento del código de su sitio web.
API de privacidad del cliente de Shopify
Para activar de forma segura determinados plugins dentro de Shopify, es necesario llamar a la API de privacidad del cliente de Shopify. El CMP lo hará automáticamente si sigues cuidadosamente los pasos de integración que se describen a continuación.
Vídeo de integración
Integración paso a paso
Para integrar el código CMP en una tienda de Shopify, sigue estos pasos:
- En tu cuenta de ConsentManager, ve a Menú > CMP > Integraciones y activa el modo de consentimiento de Shopify.
- Asegúrate, en Menú > CMP > Finalidades, de que tienes suficientes finalidades activas en tu CMP
- (opcional) Si se utiliza el bloqueo automático, recomendamos desactivar el bloqueo automático de URL desconocidas:
- Ve a Menú > CMP > Proveedores y asegúrate de que tienes los proveedores denominados «Shopify International Limited …» (ID s971, s2789, s2790, s2791, s2697) en tu lista de proveedores
(Nota: no todos estos proveedores son necesarios en todos los casos) - En tu lista de proveedores, asegúrate de que todos los proveedores de Shopify estén asignados a la finalidad correspondiente.
- Ve a Menú > CMP > Obtener códigos para… Sitio web y copia el código CMP
- Inicia sesión en tu cuenta de Shopify
- En el menú, haz clic en tu Tienda online > Temas y edita el código del tema actual:
- Abre el archivo theme.liquid, busca
<body ...>(si quieres usar el código de bloqueo manual) o<head ...>(si quieres usar el código de bloqueo automático) e inserta el código CMP justo después:
- Pulsa Guardar y vuelve a la página de inicio de la tienda
- Haz clic en Ajustes > Privacidad del cliente y desactiva el banner de cookies (si el banner de cookies de Shopify está activado; de lo contrario, omite este paso).
Nota: Si Shopify no te muestra el banner de cookies del menú > Más acciones > Desactivar banner de cookies, asegúrate primero de eliminar todos los demás plugins de banners de cookies a través de Ajustes > Aplicaciones y canales de venta > … > Desinstalar). En algunos casos, también ayuda habilitar el banner de cookies propio de Shopify y luego desactivarlo de nuevo.
Nota: En algunas versiones de Shopify, la opción dice «Eliminar banner de cookies» en lugar de «Desactivar banner de cookies»:
- Vuelve a Ajustes > Privacidad del cliente y haz clic en Banner de cookies y, a continuación, en Más acciones > Usar banner
de cookies personalizado Nota: En algunas versiones de Shopify esta opción no está presente; en su lugar, deberías ver las siguientes pantallas:
La advertencia que muestra Shopify aquí se puede ignorar, ya que has insertado manualmente el código en la plantilla.
- Al habilitar el banner de cookies personalizado (o si ya está habilitado en Ajustes > Privacidad del cliente > Banner de cookies > Regiones > Editar), asegúrate de que todas las regiones estén seleccionadas y, a continuación, haz clic en Confirmar.
Importante: Asegúrate siempre de haber desactivado todos los demás plugins de banners de cookies y de modo de consentimiento en tu tienda de Shopify, en Ajustes > Aplicaciones y canales de venta:
Problemas habituales
Problema: las propias estadísticas de Shopify ya no cuentan / cuentan menos
En algunos casos, el bloqueo automático también podría bloquear el propio sistema de seguimiento interno de Shopify. Para evitarlo, inicia sesión en tu cuenta de ConsentManager, ve a Menú > CMP > Otros y desactiva la opción «Bloquear scripts en línea»:
Problema: el modo de consentimiento de Google está configurado por defecto en «concedido».
Por desgracia, el propio sistema de seguimiento de Shopify establece el estado de consentimiento del Modo de Consentimiento de Google en granted por defecto. Para evitarlo, añade el siguiente código a tu tema:
- En el menú, haz clic en tu Tienda online > Temas y edita el código del tema actual:
- Abre el archivo theme.liquid, busca
<head> - Justo después de <head>, inserta el siguiente código (después de <head> y antes de cualquier otro código):
<script>
//Prevent Shopify from writing default consent mode before consentmanager loaded
window.dataLayer = window.dataLayer || [];
function gtag ()
{
if (!('cmploaded' in this))
{this.cmploaded = false;}
if (arguments.length > 1 && arguments[0] == 'consent' && arguments[1] == 'default' && !this.cmploaded)
{ return; }
if (arguments.length > 1 && arguments[0] == 'set' && arguments[1] == 'developer_id.dMzk4MW')
{this.cmploaded = true;}
dataLayer.push(arguments);
}
window.dataLayer.push(['consent', 'default', {
'ad_storage': 'denied',
'analytics_storage': 'denied',
'ad_user_data': 'denied',
'ad_personalization': 'denied',
'wait_for_update': 500
}]);
</script>Problema: la capa de consentimiento de Consentmanager no es visible
Algunos temas de Shopify tienen estilos CSS añadidos que ocultan los elementos DIV vacíos. Si has activado la opción WCAG en tu diseño (Menú > Diseños > Editar diseño > Configuración de cuadros), el CMP se coloca en una raíz de sombra, por lo que el DIV padre parece estar vacío y queda oculto por el CSS de Shopify. Para solucionar esto, debes añadir una regla personalizada para no ocultar los DIV vacíos:
- En tu panel de administración de Shopify, ve a Tienda online > Temas
- Haz clic en «Personalizar».
- Haz clic en «Configuración del tema».
- Haz clic en «CSS personalizado».
- Añade una nueva regla CSS y pulsa Guardar:
div#cmpwrapper {display: block;}