¿Quieres ofrecer a los visitantes una forma sencilla de actualizar sus preferencias de cookies después de que cierren el banner? WPConsent incluye un botón de consentimiento flotante que permanece visible en cada página, permitiendo a los visitantes reabrir el panel de preferencias en cualquier momento. Esta guía te explica cómo activar y personalizar el botón de consentimiento flotante.
Tabla de contenidos
- Requisitos previos
- Activación del botón de consentimiento flotante
- Elección de un icono para el botón
- Comprensión de los colores del botón
- Guardar tus cambios
- Verificar su configuración
- Preguntas frecuentes
- Conclusión
Requisitos previos
Antes de empezar, asegúrate de que lo siguiente esté en su lugar:
- WPConsent está instalado y activado en tu sitio de WordPress.
- Tienes acceso de administrador al panel de WordPress.
- El interruptor Banner de Consentimiento está activado en la página Ajustes.
Activación del botón de consentimiento flotante
Para empezar, navega a WPConsent >> Ajustes. Desplázate hacia abajo hasta la fila Botón de Ajustes y activa el interruptor. La descripción dice: “Mostrar un botón flotante para gestionar el consentimiento después de que se descarte el banner.”
Luego, haz clic en Guardar Cambios para aplicar el ajuste.
Elección de un icono para el botón
Una vez que actives el interruptor Botón de Ajustes, aparecerá un selector de iconos en la pestaña Estilo de la página Diseño del Banner.
Primero, navega a WPConsent >> Diseño del Banner y haz clic en la pestaña Estilo. Luego, desplázate hasta el final de la página para encontrar la sección Diseño del Botón de Ajustes Flotante.
Verás una cuadrícula de opciones de iconos. Selecciona el que quieras usar:
| Icono | Descripción |
|---|---|
| Tu Imagen | Sube una imagen personalizada de tu biblioteca de medios. |
| Preferencias | Un icono de deslizadores. Este es el predeterminado. |
| Ajustes | Un icono de engranaje. |
| Galleta | Un icono de galleta. |
| Cookie Desactivada | Un icono de galleta con una línea tachada. |
| Bloquear | Un icono de candado. |
| Escudo | Un icono de escudo. |
| Política | Un icono de documento/política. |
| Lista | Un icono de lista. |
| Llave inglesa | Un icono de llave inglesa/herramienta. |
| Ajustar | Un icono de ajustes/afinación. |
| Lápiz | Un icono de lápiz/editar. |
Para cargar una imagen personalizada, haz clic en la opción Tu imagen. Aparecerá un botón para cargar medios. Haz clic en él, selecciona o carga una imagen y confirma tu elección. Las imágenes personalizadas se muestran a 24 por 24 píxeles.
Comprensión de los colores del botón
El botón flotante utiliza automáticamente el mismo Color de fondo y Color de texto que tu banner. Puedes establecer estos colores en la parte superior de la pestaña Estilo, en el encabezado Banner. Cuando cambies los colores del banner, los colores del botón flotante se actualizarán para que coincidan.
Para obtener detalles sobre cómo configurar los colores del banner, consulta la guía sobre personalización de estilos de banner.
Guardar tus cambios
Después de elegir tu icono, haz clic en Guardar en la esquina superior derecha de la página Diseño del banner. Esto aplica tanto la selección del icono como cualquier cambio de color.
Cómo interactúan los visitantes con el botón
El botón flotante de consentimiento aparece solo después de que un visitante interactúa con el banner. Aquí está la secuencia típica:
- Un nuevo visitante llega a tu sitio y ve el banner de consentimiento.
- El visitante hace clic en Aceptar, Rechazar o guarda las preferencias a través del panel de preferencias.
- El banner desaparece y el botón flotante de consentimiento se desvanece en la esquina inferior izquierda de la página.
- En visitas futuras, el banner permanece oculto porque las preferencias ya están guardadas. El botón flotante aparece inmediatamente para que el visitante pueda cambiar sus elecciones.
- Hacer clic en el botón flotante abre el panel de preferencias. El visitante ajusta las categorías y vuelve a guardar.
Consejo: También puedes permitir que los visitantes abran el panel de preferencias desde cualquier enlace o botón de tu sitio. Agrega la clase CSS
wpconsent-open-preferencesa cualquier elemento HTML, y se convertirá en un activador para el panel de preferencias.
Verificar su configuración
Sigue estos pasos para confirmar que el botón flotante funciona correctamente:
- Activa el interruptor Botón de configuración y guarda.
- Abre tu sitio en una ventana de navegador de incógnito o privada.
- Acepta o rechaza las cookies en el banner de consentimiento.
- Confirma que el botón flotante aparece en la esquina inferior izquierda después de que se descarte el banner.
- Haz clic en el botón flotante y verifica que se abra el panel de preferencias.
- Cierra el navegador, vuelve a abrirlo y visita tu sitio nuevamente. El botón flotante aparece inmediatamente sin que se muestre el banner.
El botón flotante no aparece
Asegúrate de que tanto el interruptor Banner de consentimiento como el interruptor Botón de configuración estén activados en la página Configuración. El botón flotante solo aparece después de que el visitante toma una decisión de consentimiento, por lo que primero debes aceptar o rechazar las cookies.
Los colores del botón no coinciden con mi marca
El botón flotante hereda el Color de fondo y el Color del texto del banner. Navega a WPConsent >> Diseño del banner >> Estilo y ajusta esos 2 selectores de color. La vista previa del botón flotante en la cuadrícula de iconos refleja los colores actuales.
El selector de iconos no es visible en la pestaña Estilo
El selector de iconos solo aparece cuando el interruptor Botón de configuración está activado. Navega a WPConsent >> Configuración, activa el interruptor y guarda. Luego regresa a la pestaña Estilo.
Preguntas frecuentes
¿Puedo usar mi propia imagen como icono del botón flotante?
Sí. Selecciona la opción Tu imagen en la cuadrícula del selector de iconos y carga cualquier imagen de tu biblioteca de medios. Las imágenes personalizadas se muestran a 24 por 24 píxeles.
¿Puedo cambiar la posición del botón flotante?
El botón flotante aparece en la esquina inferior izquierda de la página por defecto. No hay una configuración integrada para cambiar su posición, pero puedes moverlo con CSS personalizado. Para obtener detalles sobre cómo agregar estilos personalizados, consulta nuestra guía sobre cómo personalizar el banner de WPConsent con CSS.
¿Cómo permito que los visitantes abran las preferencias desde un enlace normal en lugar del botón flotante?
Agrega la clase CSS wpconsent-open-preferences a cualquier elemento HTML de tu sitio. Hacer clic en ese elemento abre el panel de preferencias, al igual que lo hace el botón flotante.
Conclusión
El botón flotante de consentimiento ofrece a tus visitantes una forma persistente y fácil de encontrar para gestionar sus preferencias de cookies. Después de activar el interruptor en la página de Configuración y elegir un icono en la pestaña Estilo, el botón aparece automáticamente en tu frontend.
Para aprender a personalizar los colores y la apariencia general de tu banner (que también controlan el botón flotante), lee la guía sobre cómo estilizar tu banner de consentimiento.