Tutorial Divi: Evitar que el logo pierda calidad

Una de las cosas que más me pone de los nervios de Divi, a pesar de que me encanta, es que cuando añades tu propio logo este se muestra muy feo, pixelado o a baja calidad.

Ya sea por el tamaño de la imagen elegida o el formato, cuando el tamaño del menú principal es pequeño se suele mostrar poco nítido y básicamente se ve mal.

En esta captura de la web de mi empresa puedes comprobar a lo que me refiero:

Una posible solución

Una posible solución, manual, es subir el logo al tamaño máximo – o similar –  que se vaya a mostrar en tu menú principal. Es un apaño, pero funciona.

Una solución de verdad

Pero si no quieres andar haciendo experimentos o cálculos ridículos lo mejor es que añadas este poquito de CSS desde el Personalizador de temas > CSS adicional:

/* Mostrar el logo Divi a buena calidad */
#logo {
-webkit-transition: initial;
-moz-transition: initial;
transition: initial;
-webkit-transform: initial;
}

Guarda los cambios y tu logo ya se verá decentemente.

Siguiendo el mismo ejemplo de la web anterior ahora se vería así, sin cambiar el archivo de imagen, solo aplicando el CSS anterior:

Este es uno de mis trucos para Divi favoritos, por lo fácil que es de aplicar y el estupendo y visible resultado con el mínimo esfuerzo.

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(25 votos, promedio: 4.8)

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

11 comentarios en “Tutorial Divi: Evitar que el logo pierda calidad”

  1. Luis Salamanca

    Excelente truco. Mil gracias por compartirlo. Quiero aprovechar Fernando para preguntarle, sabes como se puede eliminar o dejar de mostrar el menú en un pagina (por ejemplo en una landing page), que funcione tanto para pc como para móvil? Gracias de antemano y un saludo desde Colombia.

  2. Anna De Mandrágora Vallirana

    Hola, perdona, pero soy muy novatilla en Worpress y Divi, por lo que cuando he ido a hacer lo que sugieres, porque tienes razón, mi logo se ve un poco feito, al ver que ya hay código escrito ahí, en el personalizador de temas, CSS adicional, me ha asaltado la duda de si pegarlo debajo de lo que ya hay o qué hacer y cómo hay que ponerlo?? …no quiero fastidiarla. Agradeceré tu respuesta. Saludos

  3. María Silvia Cemborain

    MUCHAS GRACIAS por compartir este truco. Me quitaste un gran dolor de cabeza, porque pude limpiar mis sitios web en DIVI, que mostraban el logo pixelado. Gracias de verdad!.

  4. Hola Fernando, antes de nada agradecerte tu ayuda con el logo.Estoy construyendo un ecommerce con el tema divi y en la ficha de producto, cuando empiezo a construir con el tema divi y le doy a guardar la foto de producto se vuelve pequeña, con un gran margen blanco a la derecha, por mas que lo intento no puedo cambiar el tamaño

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

 

Ir arriba Ir al contenido