Buenas tardes.
Tenemos la web acabada, pero hemos detectado un par de problemas de adaptación a dispositivos móviles, y nos gustaría saber si debemos modificar algo del tema, instalar algún plugin, o cualquier otra cosa para solventarlo.
En primer lugar, en la home se ve esto: el slider sale bien, pero las letras se descolocan un poco en relación al ordenador. Además, el "¿Qué hacemos?" tiene muy poco internliado digamos, es decir, que se sobreponen las dos palabras. Adjunto la imagen para que quede más claro.
En segundo lugar, las entradas del blog tienen una anchura de cuerpo de texto muy estrecha. ¿Cómo podemos solventarlo?
Muchas gracias por vuestra ayuda.
URL del sitio: Contenido solo visible a usuarios registrados
Hola
Cómo has colocado el texto de ¿Qué hacemos?, veo que tiene estilos en línea, tal vez copiaste y pegaste desde WordPress, de manera general sería corregirlo con un line-height pero lo mejor sería que coloques este texto con h2 o h3 y luego si quieres darle un diseño particular usar CSS
Veo además que tu archivo:
Contenido solo visible a usuarios registrados
Tiene código PHP, esto es incorrecto, en la parte final veo que has insertado código PHP en un archivo .css esto te puede traer problemas si quieres hacer cambios con CSS posteriormente.
Saludos.
Hola. En lo que refiere a la primera imagen ya he podido arreglarlo.
En lo segundo, básicamente lo que necesitamos es que el cuerpo de texto se vea ancho en la pantalla de móvil. ¿Qué debería hacer en el caso de los códigos .css y PHP? ¿Qué me recomiendas?
Gracias.
Hola!
Sí, esto lo querría dejar así. ¿Crees que debería modificarlo? Lo que me preocupa es la poca anchura de texto en las entradas del blog y en la descripción de los servicios. Siempre hablando en la versión móvil.
Gracias.
Hola,
Revisando las entradas del blog desde el móvil veo que el ancho es correcto. Respecto a los servicios, parece que el problema está causado por un estilo CSS personalizado que has añadido. En concreto, sería el siguiente:
.vc_custom_1479484415780{padding-right: 75px !important;padding-left: 75px !important;}
Tendrías que revisar si has añadido un CSS de este tipo para eliminarlo.
Hola Pablo,
En efecto, pusimos ese padding para que en la pantalla del ordenador quedase una hilera con 2 servicios en cada una con una separación adecuada. ¿Para adaptarlo a móvil deberíamos cambiar ese margen, es decir, la configuración actual, o podemos compaginarlo?
Gracias.
Hola,
Prueba a añadir este otro CSS personalizado, dejando el que ya tenías:
@media (max-width: 767px) { .vc_custom_1479484415780{padding-right: 0 !important;padding-left: 0 !important;} }
Hola,
Revisando el código fuente de tu página no veo que se esté cargando el cambio que te he indicado. Tendrías que revisar si en este parámetro Custom CSS tienes el otro estilo que habías aplicado, para determinar que se están aplicando en el mismo lugar.
La otra posibilidad es que el parámetro no admita el @media para definir los tamaños a partir del cual se aplicarán los estilos, pero esto es algo que tendrías que consultar con los desarrolladores de la plantilla.