Mostrar el banner de cookies por encima de otros elementos flotantes

Según las regulaciones de privacidad, debes pedir expresamente a los usuarios que acepten expresamente las cookies antes de seguir navegando por tu web, pero esto es más fácil de decir que de hacer, y no me refiero al bloqueo de cookies, que ya expliqué cómo hacerlo con mi plugin de RGPD favorito.

Me refiero a que, a veces, el banner de cookies tiene que convivir con otros elementos en la página, sobre todo en dispositivos móviles, que en ocasiones impiden que se visualice correctamente, el texto, los botones, o todo.

Aquí un ejemplo…

Como verás en la captura anterior, el banner de cookies se ve escasamente detrás de otros 2 elementos, el típico icono de contactar por WhatsApp y un botón adicional para contactar y que te llamen.

Pero lo peor de todo es que no hay manera de ver los botones para aceptar o rechazar cookies, con lo que no solo es una pesadilla de usabilidad para tus visitantes, sino que estás incumpliendo la legislación de privacidad y cookies.

Hay varias posibles soluciones…

Lo primero que debes hacer es comprobar si alguno de los otros elementos tiene algún ajuste con el que definir la prioridad de visualización. Es raro, pero te lo puedes encontrar, como en el siguiente ejemplo:

Este plugin de la captura anterior (Call Now Button) permite decidir el orden de visualización de su propio botón, pudiendo forzar que se visualice por delante de otros posibles elementos (Front) como banner de cookies, etc., o detrás (Backwards). Eso sí, es raro encontrarse un ajuste como este, tan útil. Lo normal es que tengas que tomar otro tipo de medidas.

La otra posible solución es forzar la visualización de banner de cookies mediante código, para que se visualice por delante del resto de elementos.

Así, mi plugin recomendado para cookies, GDPR Cookie Compliance, ofrece este código para evitar que otros elementos se superpongan por delante del banner de cookies:

/* Evitar que otros elementos oculten el banner de cookies */
add_action('moove_gdpr_inline_styles','gdpr_cookie_css_extension_zindex',10,3);
function gdpr_cookie_css_extension_zindex( $styles, $primary, $secondary ) {
$styles .= '#moove_gdpr_cookie_info_bar { z-index: 99999999; }';
$styles .= 'body.moove_gdpr_overflow #moove_gdpr_cookie_info_bar { z-index: 9900; }';
$styles .= 'body.moove_gdpr_overflow .gdpr_lightbox { z-index: 999999999; }';
return $styles;
}

Para saber cómo usar este código revisa esta sencilla guía:

Cómo y dónde pegar en WordPress códigos PHP, JS, CSS y funciones que encuentres por ahí

Una vez que hayas guardado los cambios ningún otro elemento de la página tapará el banner de cookies.

¿De cuánta utilidad te ha parecido este contenido?

¡Haz clic en los emoticonos para valorarlo!

Promedio de puntuación 5 / 5. Total de votos: 8

Hasta ahora ¡no hay votos!. Sé el primero en valorar este contenido.

Ya que has encontrado útil este contenido...

¡Sígueme en los medios sociales!

¡Siento que este contenido no te haya sido útil!

¡Ayúdame a mejorar este contenido!

Por favor, dime, ¿cómo puedo mejorarlo?

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

Sobre el autor

2 comentarios en “Mostrar el banner de cookies por encima de otros elementos flotantes”

  1. Yo también lo he probado con carga diferida, pero en la mayoría de ocasiones el resultado no ha sido el deseado.

    Probaré este método por ver si así soluciono los problemas que tengo con ello !

    Gracias

Deja un comentario

Tu dirección de correo electrónico no será publicada.

Información base sobre privacidad:
  • Responsable: Fernando Tellado ([email protected])
  • Fin del tratamiento: Moderación de comentarios para evitar spam
  • Legitimación: Tu consentimiento
  • Comunicación de los datos: No se comunicarán los datos a terceros salvo por obligación legal
  • Derechos: Acceso, rectificación, portabilidad, olvido

 

Ir arriba
Ir al contenido