Ahorra hasta 20% OFF en nuestro Planes y Cursos

Día(s)

:

Hora(s)

:

Minuto(s)

:

Segundo(s)

Solo durante:

Ahorra hasta 20% OFF en nuestro Planes y Cursos

Seleccionar página
4
Volver al contenido del HUB: Divi | Hub
  • UXDIVI
  • 5
  • Post
  • 5
  • Hub
  • 5
  • Configurar el ancho de contenido ideal en dispositivos móviles en Divi.

Configurar el ancho de contenido ideal en dispositivos móviles en Divi.

En este HUB Content te mostraremos cómo configurar el ancho de contenido ideal en dispositivos móviles en Divi para éste se vea de la mejor y más provechosa manera en dispositivos móviles.

Lo lograremos moviendo algunas de las configuraciones de diseño de Divi, con un par de simples ajustes, y veremos excelentes resultados a la hora de mostrar contenido con un ancho correcto en dispositivos móviles. Vamos a ello.

Hacer más ancho el contenido en móviles.

La idea de esto, es lograr que el contenido abarque al menos un 90% del ancho de la pantalla en móvil para aprovechar el maximo posible del total del ancho de la pantalla, sin llegar a los bordes del mismo y romper el diseño.

¿Quieres hacer que todos tus diseños en móvil en Divi se vean completamente responsive? Aprende a hacerlo con nuestro tutorial premium para optimizar el diseño responsive en móvil con Divi.

Para lograr esto solo debemos ir a la fila donde tenemos el contenido que queremos que se muestre en ancho «casi completo» y modificar los valores de «anchura máxima» tanto interna como externa. Es importante saber que si tienes varias secciones y filas, debes hacer lo mismo para cada una de ellas.

Una vez que elijamos la fila que queremos modificar, iremos a la pestaña de diseño de la misma, bajamos hasta el apartado de anchura máxima, y seleccionamos dispositivo «tablet» en ambos valores de la anchura.

En el primer valor de «anchura máxima» colocaremos «100%» esto hará que esa fila entienda que quieres darle el valor de anchura máxima interna dentro de la sección que la tienes. Eso quiere decir que si en el personalizador de temas has configurado un contenedor de 1280 px por ejemplo, esta fila siempre tendrá 1280 px.

En el segundo valor de «anchura máxima» colocaremos «90%», esto hará que la fila interprete que ahora queremos que esa fila abarque el 90% del ancho de todo el viewport de la pantalla (total de pantalla visible) y hará que el contenido abarque el 90% del ancho de la pantalla en dispositivos móviles.

Puedes ver acá el ejemplo:

Configurar el ancho de contenido ideal en dispositivos móviles en Divi.


Recuerda, debes ir a fila > diseño > tamaño y allí colocaras ancho completo 100% y ancho completo posterior 90% con eso lograremos un resultado así:

Como se ve Configurar el ancho de contenido ideal en dispositivos móviles en Divi.

Con esto lograremos que nuestro contenido abarque el mayor ancho visible en dispositivos móviles sin llegar a romper el diseño.

Bastante recomendable para post del blog principalmente, pues es donde tenemos una gran cantidad de contenido, y es lo que debemos optimizar todo lo que podamos para dispositivos móviles.

Contenido Relacionado

0 comentarios

Enviar un comentario

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

¡40% + 10% OFF en nuestro lanzamiento!

Apúntate y te avisaremos cuando esté publicada nuestra nueva plataforma uxdivitemplates.com. Te regalaremos un cupón ÚNICO de descuento del 10% adicional a los descuentos de lanzamiento.

¡Gracias! Te avisaremos cuando publiquemos nuestra plataforma y te enviaremos el cupón de descuento único por estar en esta lista.