Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Estilos móviles avanzados

Todos los sitios de Squarespace están optimizados con un diseño adaptativo, por lo que tu sitio puede ajustarse al formato de cualquier dispositivo móvil o navegador.

Algunas plantillas de la versión 7.0 tienen ajustes específicos para dispositivos móviles en los estilos del sitio para mayor personalización. Esta guía repasa esas opciones.

Esta guía se refiere a la versión 7.0. La versión 7.1 no tiene otros estilos para dispositivos móviles. Para informarte mejor, consulta ¿Cómo se verá mi sitio en dispositivos móviles?.

Opciones por plantilla

Para acceder a una vista previa de tu diseño para dispositivos móviles a medida que haces los cambios, abre vista en dispositivo antes de abrir estilos del sitio.

  • Para encontrar ajustes móviles, presiona Ctrl + F (Comando + F en Mac) y busca la palabra Móvil.
  • Para ajustar la escala de fuentes, busca la palabra Mín.

Estas son las opciones para dispositivos móviles en estas familias de plantillas:

Familia de plantillas Opciones
Avenue
  • Ajusta el tamaño del logotipo.

Aviator

Brine

  • Agrega una o dos barras de navegación en dispositivos móviles.
  • Elige si la barra superior es fija.
  • Establece estilos separados para íconos de encabezado.
  • Ajusta dónde aparecen los íconos.
  • Establece el ancho en el que el sitio cambia a la vista en dispositivo móvil (punto de ruptura).
  • Opciones de estilo de página de tienda

Farro

  • Agrega una o dos barras de navegación en dispositivos móviles.
  • Elige si la barra superior es fija.
  • Establece estilos separados para íconos de encabezado.
  • Ajusta dónde aparecen los íconos.
  • Opciones de estilo de página de tienda
Flatiron
  • Oculta los títulos de cuadrícula de imagen en miniatura de la página de índice.
Galapagos
  • Establece el color y la fuente del título del sitio.
  • Si tienes un logotipo en la vista de equipo, puedes agregar un logotipo para dispositivo móvil independiente y establecer su altura o mostrar el título de un sitio.

Skye

  • Escala de fuentes
  • Opciones de estilo de página de tienda
Supply
  • Reemplaza el logotipo por el título del sitio.

Tremont

  • Escala de fuentes
  • Diferentes ajustes de tamaño para diferentes anchos de navegador. Por ejemplo, establece la altura del logotipo para un equipo, tableta y smartphone.
  • Opciones de estilo de página de tienda
Wells
  • Establece la fuente y el tamaño del título del sitio.
Wexley
  • Ajusta el color de fondo de la navegación en dispositivos móviles.

York

  • Escala de fuentes
  • Barra de navegación superior para dispositivos móviles
  • Establece estilos separados para íconos de encabezado.
  • Opciones de estilo de página de tienda

Tipos de estilos para dispositivos móviles

Escala de fuentes

La escala de fuentes permite establecer manualmente los tamaños máximo y mínimo para títulos, encabezados y otros textos clave. Para obtener más información, visita Ajuste de escala de fuentes.

Logo Size (Tamaño del Logo)

En las plantillas en las que puedes ajustar el tamaño del logotipo en dispositivo móvil, recomendamos configurar el logotipo del sitio para que se muestre más pequeño en el dispositivo y reducir la desorganización por tanto contenido.

Nota: Solo Galapagos permite cargar un logotipo especial para dispositivos móviles.

Barras de navegación para dispositivos móviles

Las barras de navegación para dispositivos móviles se muestran en la parte superior o inferior del sitio. Contienen elementos de encabezado, como el título o logotipo del sitio, el carrito de compras y el ícono de búsqueda. Puedes personalizar los colores de las barras, elegir dónde se muestran los elementos y darles estilos únicos para dispositivos móviles.

Por ejemplo, la plantilla Brine admite hasta dos barras para dispositivos móviles:

Página de la tienda

En el caso de plantillas que admiten la página de tienda avanzada, puedes dar a los títulos de elementos, a los precios normales y a los precios con descuento un estilo único para mostrar en dispositivos móviles. Para obtener más información, visita Cómo modificar el estilo de páginas de Tienda.

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 18 de 150