Documentación de WPConsent

Documentación, materiales de referencia y tutoriales para WPConsent

Scripts personalizados e iframes

¿Necesitas bloquear un script o iframe de terceros que WPConsent no reconoce automáticamente? Con los scripts personalizados, puedes añadir reglas de bloqueo para cualquier código de seguimiento o contenido incrustado, de modo que solo se cargue después de que los visitantes den su consentimiento a la categoría de cookies correcta. Los scripts y iframes personalizados te dan un control total sobre los recursos de terceros que no figuran en la lista de bloqueo integrada.

Función Pro: Esta función requiere WPConsent Pro.

Índice

Requisitos previos

Antes de comenzar, asegúrese de tener:

  • WPConsent Pro instalado y activado
  • Bloqueo de scripts habilitado en WPConsent >> Configuración >> Pestaña Configuración
  • Al menos 1 servicio creado en la categoría de cookies de estadísticas o marketing (puede añadir servicios desde la pestaña Cookies o utilizar la biblioteca de servicios).

Comprender cuándo utilizar scripts personalizados

Necesitarás una regla de script personalizada cuando:

  • Tu sitio web carga un píxel de seguimiento o un script de análisis que WPConsent no bloquea automáticamente.
  • Incrustas widgets de terceros (chat, mapas, feeds sociales) utilizando iframes que establecen cookies.
  • Utilizas un servicio de marketing de nicho o de análisis que no está incluido en la lista de bloqueo integrada.
  • Puedes añadir un código de seguimiento personalizado a través de un plugin de fragmentos de código o del área de código personalizado de tu tema.

Si no estás seguro de si un script ya está bloqueado, ejecuta primero el escáner del sitio web. El escáner detecta los scripts y los iframes activos en tu sitio y te informa de cuáles ya gestiona WPConsent.

  1. Ve a WPConsent >> Configuración en tu administrador de WordPress.
  2. Seleccione la pestaña Avanzado.
  3. Desplácese hacia abajo hasta la sección «Iframes/Scripts personalizados ».

Esta sección muestra un acordeón con dos categorías: Scripts de estadísticas y Scripts de marketing. Para ver las entradas existentes, haz clic en la flecha situada junto al nombre de una categoría para expandirla.

Lista de scripts personalizados organizada por categoría con columnas de servicio, tipo y script.

Cada entrada de script muestra las siguientes columnas:

ColumnaDescripción
ServicioEl servicio al que pertenece este script
TipoYa sea Script o iFrame
GuionLa cadena identificadora utilizada para hacer coincidir el script o el iframe.
Elementos bloqueadosPalabras clave adicionales (para scripts) o selectores CSS (para iframes)
AccionesBotones para editar y eliminar

Añadir un nuevo script personalizado o iframe

  1. Haga clic en el botón Añadir iFrame/Script personalizado situado debajo de los acordeones de categorías. Se abrirá la ventana modal Añadir nuevo script o iFrame.
El modal Añadir nuevo script o iFrame con todos los campos del formulario
  1. Selecciona una categoría. Elige entre Estadísticas o Marketing según el propósito del script. La categoría determina qué control de consentimiento controla el script en el panel de preferencias del visitante.
Selección de categoría y servicio en el modal de script personalizado
  1. Selecciona un servicio. El menú desplegable de servicios se actualiza en función de la categoría seleccionada y muestra todos los servicios que has creado en esa categoría. Si el menú desplegable está vacío, ve a la pestaña Cookies y crea primero un servicio.
  2. Elija un tipo. Seleccione Script para el código de seguimiento de JavaScript o iFrame para contenido incrustado. Los campos del formulario a continuación cambian según su selección.

Rellenar campos de tipo script

Al seleccionar Script, aparecen dos campos:

  • Etiqueta de script: Introduzca una cadena única que identifique el script que desea bloquear. Normalmente, forma parte de la URL del script. Por ejemplo, para bloquear el píxel de Facebook, introduciría connect.facebook.net/en_US/fbevents.js. WPConsent compara esta cadena con script etiquetas en el HTML de la página.
  • Palabras clave del guion: Introduzca los nombres de las funciones JavaScript que dependen del script principal, separados por comas. Por ejemplo, fbq, fbq.pushWPConsent bloquea los scripts en línea que hacen referencia a estos nombres de funciones. Esto evita errores de scripts bloqueados y garantiza que no se envíen datos antes de obtener el consentimiento.

Rellenar campos de tipo iframe

Al seleccionar iFrame, aparecen dos campos:

  • Etiqueta iFrame: Introduzca una cadena única que identifique la fuente del iframe que desea bloquear. Por ejemplo, youtube.com/embed. WPConsent compara esta cadena con la src atributo de iframe elementos.
  • Elementos bloqueados: Introduzca los selectores CSS para los elementos HTML que desea ocultar y sustituir por un marcador de posición hasta que se dé el consentimiento, separados por comas. Por ejemplo, #my-chat-widget, .social-embedEsto resulta útil cuando un widget de terceros muestra elementos HTML visibles junto con su iframe.
  1. Haga clic en Guardar. El nuevo script aparecerá inmediatamente en la categoría correspondiente.

Edición de un script existente

  1. En primer lugar, expanda el acordeón de categorías que contiene el script.
  2. Haga clic en el icono de edición (lápiz) en la columna Acciones.
  3. El modal se abre con los valores actuales prellenados. Realice los cambios que desee.
  4. Haga clic en Guardar.

La entrada del script se actualiza en la lista sin necesidad de recargar la página.

Eliminación de un script

  1. En primer lugar, expanda el acordeón de categorías que contiene el script.
  2. Haga clic en el icono de eliminar (papelera) en la columna Acciones.
  3. Confirma la eliminación en el cuadro de diálogo del navegador.

El script se elimina inmediatamente de la lista.

Comprender cómo se bloquean los scripts personalizados

Los scripts personalizados se integran directamente con el mismo motor de bloqueo que gestiona los servicios integrados. Cuando guardas un script personalizado, WPConsent lo añade a la lista interna de scripts bloqueados. En la siguiente carga de la página:

Para tipos de script: WPConsent busca en el HTML de la página script etiquetas que contienen la cadena que ha introducido en Etiqueta de script. Los scripts coincidentes tienen su type atributo cambiado a text/plain y sus src se mudó a data-wpconsent-src, lo que impide que el navegador los ejecute. Si proporcionaste Palabras clave del guion, los scripts en línea que contienen esos nombres de funciones también se bloquean.

Para tipos de iFrame: WPConsent busca iframe elementos cuyos src El atributo contiene la cadena que introdujo en Etiqueta iFrame. El src se elimina y se almacena en data-wpconsent-src. Si usted proporcionó Elementos bloqueados, esos selectores CSS ocultan elementos adicionales y muestran un marcador de posición de consentimiento.

Cuando el visitante acepta la categoría de cookies correspondiente (Estadísticas o Marketing), WPConsent restaura los scripts y los iframes bloqueados para que se carguen y ejecuten con normalidad.

Trabajar con ejemplos prácticos

Bloqueo de un píxel de análisis personalizado

Si su equipo de marketing ha añadido un servicio de análisis de nicho que carga un script desde tracker.example.com/pixel.js:

  1. Abre el modal Añadir nuevo script o iFrame.
  2. Establezca la categoría en Estadísticas.
  3. Seleccione el servicio correspondiente (o cree uno primero en la pestaña Cookies ).
  4. Establezca el tipo en Script.
  5. Entrar tracker.example.com/pixel.js en Etiqueta de script.
  6. Si el script define una función global como trackEvent, introduzca trackEvent en Palabras clave del guion.
  7. Haga clic en Guardar.

Bloqueo de un iframe de widget de chat de terceros

Si un widget de chat se carga en un iframe desde chat.example.com/widget:

  1. Abre el modal Añadir nuevo script o iFrame.
  2. Establecer la categoría en Marketing.
  3. Seleccione el servicio correspondiente.
  4. Establezca el tipo en iFrame.
  5. Entrar chat.example.com/widget en Etiqueta iFrame.
  6. Entrar #chat-widget-container en Elementos bloqueados para ocultar el contenedor circundante y mostrar un marcador de posición.
  7. Haga clic en Guardar.

Verificación de la configuración

Después de añadir un script personalizado, comprueba que funciona correctamente:

  1. Abre tu sitio web en una ventana privada o de incógnito del navegador.
  2. Abre las herramientas de desarrollo del navegador (F12) y cambia a la pestaña Red.
  3. Busca el script o el iframe en las solicitudes de red. No debería aparecer antes de que interactúes con el banner.
  4. Acepte la categoría de cookies correspondiente en el banner de consentimiento.
  5. Vuelve a comprobar la pestaña Red. Ahora se carga el script o el iframe.

También puede consultar el Elementos pestaña en las herramientas de desarrollo. Antes de dar tu consentimiento, busca script etiquetas con type="text/plain" y data-wpconsent-src atributos. Se trata de scripts bloqueados que esperan el consentimiento.

Solución de problemas

La cadena de la etiqueta de script no coincide con lo que hay en el HTML de tu página. Abre el código fuente de la página (Ctrl+U) y busca la URL del script. Copia la subcadena exacta y pégala en el campo Etiqueta de script. La coincidencia distingue entre mayúsculas y minúsculas.

Comprueba que el Etiqueta iFrame coincide con el src atributo del iframe. Algunos iframes utilizan URL relativas al protocolo (que comienzan por //) o incluir parámetros de consulta. Utilice solo el dominio y la ruta como identificador. Por ejemplo, utilice youtube.com/embed en lugar de la URL completa con parámetros.

Las palabras clave del script no funcionan.

Bloque de palabras clave en línea script etiquetas que hacen referencia a esos nombres de funciones. No afectan a los scripts cargados desde URL externas. El Etiqueta de script El campo gestiona el bloqueo de scripts externos. Utilizar Palabras clave del guion solo para código en línea que depende del script externo.

El menú desplegable de servicios está vacío.

El menú desplegable de servicios se rellena en función de la categoría seleccionada. Si no hay servicios en la categoría elegida, el menú desplegable estará vacío. Vaya a la pestaña Cookies y añada primero un servicio a la categoría Estadísticas o Marketing.

Preguntas frecuentes

¿Puedo bloquear un script que ya está en la lista integrada?

No es necesario. WPConsent gestiona automáticamente todos los scripts de la lista integrada. Añadir una regla personalizada duplicada no provocará errores, pero es innecesario.

¿Cómo sé qué cadena utilizar para la etiqueta Script?

Abre las herramientas de desarrollo de tu navegador, ve a la pestaña Red y busca la solicitud del script que deseas bloquear. Copia una parte única de su URL. La cadena solo tiene que ser lo suficientemente específica como para coincidir con ese script sin coincidir accidentalmente con otros recursos.

¿Puedo asignar un script personalizado a la categoría «Esencial» o «Funcional»?

No. Los scripts personalizados están limitados a las categorías Estadísticas y Marketing. Los scripts de la categoría Esenciales son necesarios para el funcionamiento de su sitio web y no deben bloquearse. Las cookies funcionales se gestionan por separado.

¿Tengo que borrar la caché después de añadir un script personalizado?

Si utiliza un complemento de almacenamiento en caché, borre la caché de la página después de añadir o modificar scripts personalizados. El bloqueo de WPConsent se produce durante la representación de la página, por lo que las páginas almacenadas en caché no reflejarán los cambios hasta que se actualice la caché.

Conclusión

Los scripts personalizados te permiten ampliar las capacidades de bloqueo de WPConsent para cubrir cualquier recurso de terceros en tu sitio web. Al crear reglas con etiquetas de script y palabras clave específicas, te aseguras de que todos los scripts de seguimiento y los iframes respeten las opciones de consentimiento de tus visitantes.

Para obtener más información sobre cómo funciona el motor de bloqueo integrado, consulte nuestra guía sobre el bloqueo automático de scripts. Si trabaja con iframes y desea personalizar el contenido del marcador de posición, consulte nuestra guía sobre el bloqueo de contenido y los marcadores de posición.

¿Le ha resultado útil este artículo?

Artículos relacionados