Editor de Wix: agregar y personalizar cuadros en la versión móvil del sitio

4 min de lectura
Los cuadros ayudan a enmarcar, organizar y estructurar el contenido del sitio móvil. Refina los cuadros transferidos desde la versión de escritorio y personaliza los que agregaste desde el editor móvil.
Cuando agregas cuadros desde el editor móvil, puedes personalizar completamente sus bordes, sombras, colores y espaciado. Al editar cuadros transferidos desde la versión de escritorio del sitio, solo puedes editar sus animaciones u ocultarlos.
En este artículo, obtén más información sobre lo siguiente: 
¿No tienes claro si es un elemento móvil o de escritorio?
Los elementos solo para dispositivos móviles muestran un icono Móvil  cuando haces clic en ellos.

Cuadros transferidos desde la versión de escritorio

Los cuadros agregados a la versión de escritorio del sitio se agregan automáticamente a la versión móvil. Puedes agregar una animación u ocultar el cuadro.
Nota:
Las interacciones al pasar el cursor (a menudo aplicadas a cuadros) no están disponibles para dispositivos móviles.

Para personalizar los cuadros transferidos desde la versión de escritorio:

  1. Haz clic en el cuadro en el editor móvil.
  2. Elige cómo personalizar el cuadro:
    • Agrega una animación: 
      1. Haz clic en el icono Animación y efectos .
      2. Selecciona la animación que deseas aplicar al cuadro.
      3. (Opcional) Haz clic en Personalizar para ajustar aún más las opciones de la animación.
    • Ocultar el cuadro: haz clic en el icono Ocultar elemento  para ocultar el cuadro de la versión móvil de tu sitio.
Captura de pantalla del panel de ajustes de animación.
Consejo:
Para mostrar un elemento, haz clic en el icono Oculto en la versión móvil undefined a la izquierda del editor móvil. Luego, haz clic en Mostrar junto al elemento correspondiente para mostrarlo en la versión móvil de tu sitio.

Cuadros agregados desde el editor móvil

Agrega un cuadro contenedor directamente al sitio móvil. Elige entre una variedad de diseños preestablecidos para el cuadro y personaliza los colores, los bordes, las esquinas, las sombras y el espaciado.

Para agregar y personalizar cuadros solo para dispositivos móviles:

  1. Haz clic en Agregar a móvil la izquierda del editor móvil.
  2. Haz clic en Cuadro.
  3. Haz clic en el cuadro que deseas agregar al sitio.
  4. Haz clic en el icono Diseño .
  5. Haz clic en Personalizar.
  6. Selecciona las siguientes opciones para personalizar el diseño del cuadro:
    • Color de relleno y opacidad: para cambiar el fondo del cuadro, haz clic en la caja de color y arrastra el control deslizante para ajustar su opacidad.
    • Bordes: refina los bordes del cuadro.
      • Opacidad y color: edita el color del borde y arrastra el control deslizante para ajustar la opacidad.
      • Ancho: arrastra el control deslizante para ajustar el ancho del borde. Si no quieres bordes, configúralo en cero. 
    • Esquinas: redondea las esquinas del cuadro.
      • Radio: ingresa un número para redondear las esquinas del cuadro o para crear una caja redonda. 
      • Bloquear: haz clic en el icono de candado  para mantener las cuatro esquinas iguales.
    • Sombra: desliza la palanca para aplicar una sombra alrededor del cuadro.
      • Ángulo: selecciona una posición en el círculo o ingresa un valor. 
      • Distancia: arrastra el control deslizante para aumentar o disminuir la distancia de la sombra.
      • Tamaño: arrastra el control deslizante para aumentar o disminuir el tamaño.
      • Desenfocar: arrastra el control deslizante para aumentar o disminuir el desenfoque de la sombra.
      • Opacidad y color: selecciona un color y arrastra el control deslizante para aumentar o disminuir la opacidad de la sombra.

Captura de pantalla del panel Diseño del cuadro.

¿Te ha sido útil?

|