¿Cómo evitar que los iframes incrustados carguen cookies de seguimiento antes de que los visitantes den su consentimiento? WPConsent bloquea los iframes de terceros y los reemplaza con marcadores de posición visuales que permiten a los visitantes elegir cuándo cargar el contenido. El bloqueo de contenido y los marcadores de posición le brindan control total sobre servicios incrustados como YouTube, Vimeo y Google Maps.

Tabla de contenidos

• Requisitos previos
• Comprender cómo funciona el bloqueo de contenido
• Habilitar el bloqueo de contenido
• Elegir qué servicios bloquear
• Personalizar el texto del botón marcador de posición
• Comprender cómo funcionan los marcadores de posición
• Comprender el comportamiento de clic para consentir
• Comprender cómo interactúa el bloqueo de contenido con otras funciones
• Verificar su configuración
• Preguntas frecuentes
• Conclusión

Requisitos previos

Antes de empezar, asegúrate de tener:

• WPConsent instalado y activado (consulta nuestra guía sobre cómo instalar WPConsent)
• El banner de consentimiento habilitado en WPConsent >> Ajustes
• Bloqueo de scripts activado en WPConsent >> Ajustes (el bloqueo de contenido se basa en el mismo proceso de almacenamiento en búfer de salida)
• Bloqueo de contenido activado en WPConsent >> Ajustes con al menos 1 servicio seleccionado
• Acceso de administrador a tu sitio de WordPress

Comprender cómo funciona el bloqueo de contenido

El bloqueo de contenido evita que los iframes y otros elementos incrustados se carguen hasta que el visitante consienta la categoría de cookies correspondiente. Funciona junto con el bloqueo automático de scripts, pero se centra específicamente en el contenido incrustado en lugar de las etiquetas JavaScript.

Cuando el bloqueo de contenido está activo, WPConsent realiza 3 pasos por cada solicitud de página:

1. Eliminar la fuente del iframe. Se elimina el atributo src de los iframes coincidentes para que el navegador no los cargue.
2. Mostrar un marcador de posición. Un contenedor con estilo reemplaza al iframe con una imagen en miniatura y un botón de consentimiento.
3. Restaurar el contenido al consentir. Cuando el visitante acepta la categoría de cookies relevante, se restaura la fuente original del iframe y se elimina el marcador de posición.

Este enfoque garantiza que no se envíen datos al servicio de terceros antes de que se otorgue el consentimiento. Eso lo hace esencial para el cumplimiento de GDPR, CCPA y ePrivacy.

Comparación del bloqueo de contenido y el bloqueo de scripts

El bloqueo de scripts se dirige a las etiquetas script y evita que JavaScript se ejecute. El bloqueo de contenido se dirige a los elementos iframe y a los selectores CSS para widgets integrados específicos. Ambas funciones utilizan el mismo motor de detección y sistema de categorías. El bloqueo de contenido también proporciona un marcador visual para que los visitantes entiendan que el contenido está retenido y puedan optar por cargarlo.

Puedes habilitar el bloqueo de scripts y el bloqueo de contenido de forma independiente. El bloqueo de scripts se controla mediante el interruptor Habilitar bloqueo de scripts, mientras que el bloqueo de contenido tiene su propio interruptor Bloqueo de contenido.

Habilitar el bloqueo de contenido

Para empezar:

1. Navega a WPConsent >> Ajustes en tu administrador de WordPress.
2. Desplázate hasta el interruptor Bloqueo de contenido.
3. Activa el interruptor.
4. Observa que la configuración Contenido a bloquear y Botón marcador aparecen debajo del interruptor.
5. Haz clic en Guardar Cambios.

El bloqueo de contenido requiere que el bloqueo de scripts también esté habilitado. WPConsent utiliza el mismo proceso de búfer de salida para ambas funciones. Si el bloqueo de scripts está deshabilitado, el bloqueo de contenido no tiene efecto porque el HTML de la página no se está procesando.

Elegir qué servicios bloquear

WPConsent mantiene una lista de servicios que admiten el bloqueo de contenido, actualizada de forma remota. La lista se obtiene automáticamente y se almacena en caché localmente durante 24 horas, por lo que podemos agregar nuevos servicios sin una actualización del plugin.

Los siguientes servicios admiten actualmente el bloqueo de contenido:

Si eliges Sin servicio, la cookie se asignará directamente a la categoría de cookies. Esto es apropiado para cookies que tu propio sitio web establece en lugar de un servicio de terceros.	Categoría	¿Qué se bloquea?
YouTube	Marketing	Incrustaciones de vídeo de YouTube (incluido youtube-nocookie.com)
Vimeo	Marketing	Incrustaciones del reproductor de vídeo de Vimeo
DailyMotion	Marketing	Incrustaciones del reproductor de vídeo de DailyMotion
Google Maps	Marketing	Iframes incrustados de Google Maps
reCAPTCHA	Marketing	Widgets de Google reCAPTCHA (el elemento .g-recaptcha)

Los 5 servicios pertenecen a la categoría de cookies de Marketing por defecto. Cuando un visitante acepta las cookies de Marketing, todas las incrustaciones bloqueadas de estos servicios se cargan inmediatamente.

Nota: reCAPTCHA es único entre los servicios admitidos. En lugar de bloquear un iframe, WPConsent se dirige al elemento HTML .g-recaptcha y le antepone un marcador. El widget en sí está oculto hasta que se otorga el consentimiento.

Cuando habilitas el bloqueo de contenido, WPConsent muestra una sección Contenido a bloquear con un interruptor individual para cada servicio admitido. Todos los servicios están habilitados por defecto.

Para cambiar los servicios que se bloquean:

1. Navega a WPConsent >> Ajustes en tu administrador de WordPress.
2. Confirma que el interruptor Bloqueo de contenido está habilitado.
3. En la sección Contenido a bloquear, activa o desactiva cada servicio.
4. Haz clic en Guardar Cambios.

Por ejemplo, si usas reCAPTCHA en un formulario de contacto y no quieres que se bloquee, desactiva el interruptor de reCAPTCHA mientras mantienes bloqueados YouTube y Vimeo.

Personalizar el texto del botón marcador de posición

Puedes cambiar el texto que se muestra en el botón de consentimiento marcador desde la página de configuración.

Para actualizar el texto del botón:

1. Navega a WPConsent >> Ajustes en tu administrador de WordPress.
2. Confirma que el interruptor Bloqueo de contenido está habilitado.
3. Busca el campo de texto Botón marcador.
4. Edita el texto a tu gusto.
5. Haz clic en Guardar Cambios.

El texto por defecto es:

Click here to accept {category} cookies and load this content

La etiqueta {category} es un marcador de posición dinámico que WPConsent reemplaza con el nombre real de la categoría de cookies. Por ejemplo, si el iframe bloqueado pertenece a la categoría de Marketing, el botón dirá: “Haga clic aquí para aceptar las cookies de Marketing y cargar este contenido”. Si tiene habilitada la configuración de Alternar Servicios, el botón también mencionará el nombre del servicio correspondiente para que los visitantes sepan exactamente qué servicio están aceptando.

Comprender cómo funcionan los marcadores de posición

Cuando WPConsent bloquea un iframe, lo reemplaza con un contenedor marcador de posición. El marcador de posición tiene 3 capas:

1. Imagen en miniatura. Una imagen de fondo que ofrece al visitante una vista previa del contenido bloqueado.
2. Contenido superpuesto. Una capa semitransparente sobre la miniatura.
3. Botón de consentimiento. Un botón en el que el visitante puede hacer clic para aceptar las cookies de esa categoría y cargar el contenido.

El marcador de posición está envuelto en un div con la clase wpconsent-iframe-placeholder. El iframe original permanece dentro del marcador de posición pero no tiene src, por lo que no se carga.

Generando imágenes de marcador de posición dinámicas

WPConsent genera imágenes en miniatura relevantes para cada incrustación bloqueada. Para servicios de vídeo como YouTube, la miniatura muestra una vista previa del vídeo específico. Para otros servicios, se muestra una imagen genérica de marcador de posición.

Las miniaturas se obtienen de la API de marcadores de posición de WPConsent y luego se guardan localmente en su servidor en el directorio wp-content/uploads/wpconsent/thumbnails/. Esto significa:

• Sin solicitudes externas al cargar la página. Una vez descargada la miniatura, se sirve directamente desde su servidor.
• Cumple con la privacidad. Los navegadores de los visitantes nunca contactan con la API de WPConsent. La descarga se realiza en el lado del servidor.
• Caché por URL. Cada URL de incrustación única obtiene su propio archivo de miniatura, nombrado usando el nombre del servicio y un hash MD5 de la URL.

Si la miniatura no se puede obtener (por ejemplo, debido a un error de red), WPConsent recurre a una imagen de marcador de posición predeterminada incluida con el plugin.

Estilizando el botón de marcador de posición

El botón de consentimiento del marcador de posición hereda los colores del botón de aceptación de su banner. WPConsent aplica las mismas variables CSS utilizadas por su banner de consentimiento (--wpconsent-accept-bg y --wpconsent-accept-color) al botón del marcador de posición. Esto garantiza que el botón coincida con el diseño de su banner sin ninguna configuración adicional.

Comprender el comportamiento de clic para consentir

Cuando un visitante hace clic en el botón de consentimiento de un marcador de posición, WPConsent realiza lo siguiente:

1. Guarda el consentimiento para la categoría. Las preferencias del visitante se actualizan para incluir la categoría de cookies relevante (por ejemplo, Marketing). Si la configuración de Alternar Servicios está habilitada, también se acepta el servicio específico.
2. Restaura el iframe. El atributo data-wpconsent-src se mueve de nuevo a src, y el iframe se carga.
3. Elimina el marcador de posición. Se eliminan la miniatura y la superposición, y se elimina la clase wpconsent-iframe-placeholder del contenedor.
4. Actualiza todo el contenido coincidente. Todos los demás iframes y marcadores de posición bloqueados en la misma categoría también se desbloquean en la página.
5. Oculta el banner. Si el banner de consentimiento está visible, se oculta después de guardar las preferencias.

Esto significa que hacer clic en 1 botón de marcador de posición de YouTube también desbloquea cualquier otro embed de YouTube, Vimeo, Google Maps o DailyMotion en la misma página, ya que todos comparten la categoría de Marketing.

Si el visitante ha otorgado previamente el consentimiento a través del banner, los marcadores de posición nunca se muestran. WPConsent verifica las preferencias existentes al cargar la página y restaura automáticamente todos los iframes coincidentes.

Comprender cómo interactúa el bloqueo de contenido con otras funciones

Bloqueo de scripts

El bloqueo de contenido y el bloqueo de scripts funcionan juntos. Algunos servicios como reCAPTCHA tienen tanto scripts como elementos bloqueados. Cuando el bloqueo de contenido está habilitado para reCAPTCHA, WPConsent bloquea los scripts de reCAPTCHA y oculta el widget .g-recaptcha con un marcador de posición. Cuando el visitante da su consentimiento, tanto los scripts como el widget se restauran.

Modo de consentimiento de Google

Si tienes activado el Modo de Consentimiento de Google, no afecta al bloqueo de contenido. El Modo de Consentimiento de Google solo se aplica a los scripts de Google Analytics, Google Ads y Google Tag Manager. Los iframes de Google Maps siguen bloqueándose y reemplazándose por marcadores de posición como de costumbre.

Modo de permiso predeterminado (exclusión voluntaria)

Cuando Permitir por defecto está activado en configuración general, todo el contenido se desbloquea por defecto. Los iframes se cargan inmediatamente y no se muestran marcadores de posición. Si un visitante rechaza una categoría, la página se recarga y el contenido se bloquea.

Escáner de sitios web

El escáner del sitio web detecta contenido incrustado en tu sitio y te ayuda a identificar qué servicios necesitas gestionar. Ejecutar un escaneo antes de habilitar el bloqueo de contenido es una buena práctica para asegurar que todos tus servicios estén correctamente categorizados.

Verificar su configuración

Después de habilitar el bloqueo de contenido, prueba tu sitio para confirmar que todo funciona correctamente:

1. Abre tu sitio web en una ventana de navegador privada/incógnita.
2. Busca contenedores de marcadores de posición donde normalmente aparece el contenido incrustado (vídeos de YouTube, Google Maps, etc.).
3. Confirma que cada marcador de posición muestra una imagen en miniatura y un botón de consentimiento.
4. Haz clic en el botón de consentimiento de un marcador de posición y verifica que el contenido incrustado se carga.
5. Confirma que todos los demás marcadores de posición en la misma categoría de cookies también se desbloquean.
6. Abre las herramientas de desarrollador de tu navegador (pulsa F12) y revisa la pestaña Elementos para verificar que los iframes bloqueados tengan data-wpconsent-src en lugar de src.

Preguntas frecuentes

¿Por qué no aparecen mis marcadores de posición?

Asegúrate de que tanto Habilitar bloqueo de scripts como Bloqueo de contenido estén activados en WPConsent >> Ajustes. El bloqueo de contenido depende del almacenamiento en búfer de salida iniciado por el bloqueo de scripts.

¿Por qué mis miniaturas muestran una imagen genérica en lugar de una vista previa del vídeo?

Es probable que la miniatura específica no se pueda obtener de la API de WPConsent. Verifica que tu servidor pueda realizar solicitudes HTTP salientes. Las miniaturas se almacenan en wp-content/uploads/wpconsent/thumbnails/. Puedes eliminar archivos allí para forzar una nueva descarga en la próxima carga de página.

¿Por qué mi contenido incrustado se carga antes de que el visitante dé su consentimiento?

Borra cualquier caché de página en tu sitio. WPConsent modifica el HTML mediante el almacenamiento en búfer de salida, que se ejecuta antes de que la mayoría de las capas de caché almacenen su instantánea. Si se creó una versión en caché de la página antes de habilitar el bloqueo de contenido, los iframes aún conservan sus atributos src originales.

¿Por qué mis formularios reCAPTCHA no funcionan después de habilitar el bloqueo de contenido?

Si bloqueas reCAPTCHA, los visitantes deben hacer clic en el botón de consentimiento antes de que aparezca el widget reCAPTCHA. Esto significa que los formularios protegidos por reCAPTCHA no se pueden enviar hasta que se otorgue el consentimiento. Si esto es un problema, puedes deshabilitar reCAPTCHA en la lista Contenido a Bloquear mientras mantienes bloqueados otros servicios.

¿Por qué no se bloquea un iframe en mi página?

El bloqueo de contenido solo funciona para los iframes que están presentes en el HTML de la página cuando se carga por primera vez. Si un iframe es inyectado por JavaScript después de que la página se carga, WPConsent no puede interceptarlo con esta función porque el HTML ya ha sido procesado. Esto es bastante común con widgets y elementos incrustados que se cargan dinámicamente. En esos casos, el manejo del consentimiento puede requerir código personalizado específico para el plugin o tema que crea el iframe, o el uso de una integración de terceros como la API de Consentimiento de WP si el plugin lo admite.

¿Puedo agregar reglas personalizadas de bloqueo de contenido para servicios que no están en la lista predeterminada?

Sí, pero solo en la versión de pago. La versión de pago te permite agregar reglas personalizadas de bloqueo de scripts e iframes para cualquier servicio. Consulta nuestra guía sobre reglas de bloqueo de scripts personalizados para obtener instrucciones.

Conclusión

El bloqueo de contenido garantiza que los iframes de terceros y los widgets incrustados no se carguen hasta que los visitantes den su consentimiento. Con marcadores de posición visuales, vistas previas en miniatura y un botón de clic para consentir, tus visitantes siempre entienden qué contenido se retiene y pueden optar por cargarlo en sus términos.

Para aprender cómo WPConsent maneja los scripts de seguimiento basados en JavaScript junto con el bloqueo de contenido, lee nuestra guía sobre bloqueo automático de scripts.