Hostinger Creador de Sitios Web: Cómo Editar la Versión Móvil de un Sitio Web

Editar por separado las versiones para móvil y escritorio

Actualizado hace 2 semanas

Por defecto, la versión móvil del sitio web muestra los elementos en el orden en que se han añadido a la versión de escritorio. Incluso si, más tarde, reordena los elementos en el escritorio, estos cambios no se aplican automáticamente a la versión móvil. Puedes ordenar los elementos en la vista móvil manualmente. De esta forma, puede disponer los elementos de forma diferente en las vistas de escritorio y móvil.

Para obtener el mejor resultado, evite mover elementos entre secciones, o recuerde comprobar ambas versiones después de hacerlo. Afecta tanto a la versión móvil como a la de escritorio y, por tanto, puede distorsionar el diseño de tu sitio web. En su lugar, siéntete libre de reposicionar elementos dentro de una sección 💡

Acceder al editor móvil

Cambie entre las vistas haciendo clic en el icono móvil o de escritorio de la barra de herramientas superior:

Hostinger Creador de Sitios: botón Cambiar vista para alternar entre escritorio y móvil

Ordenar elementos

Para cambiar la posición de los elementos, entre en la vista móvil y simplemente arrastre y suelte los elementos:

Editor web con botón morado "Add section" resaltado en la parte superior central

Cambiar el tamaño de los elementos

Para cambiar el tamaño de los elementos, acceda a la vista móvil y utilice los controles de cambio de tamaño de los bordes de los elementos:

Sitio web de Jamie Malsinger con foto destacada de snowboard en salto aéreo

Cambiar el tamaño del texto

Puede cambiar el tamaño del texto de dos maneras:

  • Globalmente – afecta a todos los textos de un estilo particular (por ejemplo, todos los textos escritos en Título 1) en todo su sitio web en la vista móvil

  • Localmente: afecta a un elemento de texto concreto en la vista móvil

Para cambiar el tamaño del texto globalmente en el móvil, entre en la vista móvil y cambie el tamaño de la fuente de un estilo de texto concreto en la configuración global del estilo de texto:

Editor web con texto grande “Jamie Maislinger Photography” y foto destacada de snowboarder en la esquina superior derecha

Para cambiar el tamaño del texto localmente en el móvil, entre en la vista móvil, haga clic en un elemento de texto concreto y cambie su tamaño de fuente:

Editor de Hostinger con una sección seleccionada y el botón Cambiar fondo resaltado sobre una foto de snowboarder

Puede configurar los siguientes ajustes para que sean diferentes en el escritorio y en el móvil:

  • Tamaño de fuente; por ejemplo, escritorio: 20 PX, móvil: 18 PX

  • Alineación del texto; por ejemplo, escritorio: izquierda, móvil: centro

  • Altura de línea; por ejemplo, escritorio: 2, móvil: 1.5

Esto significa que cuando cambie cualquier otro parámetro (familia de fuentes, negrita, cursiva, subrayado, etc.), el cambio se reflejará tanto en el escritorio como en el móvil. – el cambio se reflejará tanto en el escritorio como en el móvil. Lo mismo ocurre si cambias todo el estilo de texto, por ejemplo, si estableces Título 2 para móvil mientras que en escritorio es Título 1, el elemento de texto en la vista de escritorio cambiará también a Título 2.

Puedes duplicar un elemento o sección, y hacer una versión visible en escritorio y otra visible en móvil. De este modo, tendrás más libertad a la hora de aplicar estilos al contenido en el escritorio y en el móvil de forma individual, ya que, normalmente, algunos ajustes (por ejemplo, el estilo del texto) se aplican tanto al escritorio como al móvil. Más información: Cómo ocultar elementos y secciones

Cambiar la posición del menú

Para cambiar la posición del menú hamburguesa, entre en la vista móvil, haga clic en la sección de encabezando y abra su configuración:

Hostinger Creador de Sitios Web: icono de engranaje para editar el encabezado móvil

En la pestaña Diseño, cambie la posición del menú:

Configuraciones de encabezado con la posición del menú resaltada en el panel lateral

Si no puedes ver la sección de cabecera, es probable que todas las páginas de tu sitio web estén ocultas del menú de navegación 💡

Cambiar la posición del logotipo

Para cambiar la posición del logotipo, entra en la vista móvil, haz clic en la sección de encabezando y selecciona Cambiar logo:

Hostinger Creador de Sitios Web: botón «Cambiar logo» en el encabezado móvil resaltado

En la pestaña Logo, cambia la posición del logo:

Si no puedes ver la sección de cabecera, es probable que todas las páginas de tu sitio web estén ocultas del menú de navegación 💡