Encabezado y menú expandible

Nota

Esta información es específica del Editor clásico y no es relevante para el Editor 2.0 (anteriormente conocido como el Editor All-Flex). Para identificar la versión actual del editor, consulte Cómo identificar la versión del editor que utiliza el sitio.

Puede agregar un menú expandible a sus sitios para equipos de escritorio y tabletas, lo que facilita la creación de sitios modernos que tienen una excelente flexibilidad de diseño. Elija entre varios diseños de menú expandible y personalícelos como desee, agregando widgets, filas y columnas.

El diseño del menú expandible para dispositivos móviles ofrece más opciones de personalización, y una manera de mostrar widgets en el encabezado y un menú que siempre está visible.

Puede cambiar el diseño del encabezado a un diseño predefinido que incluya botones, clic para llamar, carro de compras, iconos de redes sociales y más. Puede agregar cualquier widget al menú expandible desde el panel de widgets.

PC y tabletas

Seleccionar el diseño del menú expandible

Para seleccionar un diseño de menú expandible para su sitio:

  1. En el panel izquierdo, haga clic en Tema.
  2. Haga clic en Diseño del sitio.
  3. En la sección predefinida Desktop, seleccione el diseño de menú expandible.
  4. En la sección predefinida Tablet, seleccione el diseño con el menú expandible.

Encabezado de equipos de escritorio y tabletas

Después de seleccionar el diseño desde el menú expandible, verá un icono de hamburguesa en el encabezado de su sitio. Haga clic en el icono de hamburguesa () para ver el menú expandible.

Para editar la ubicación del menú expandible en el encabezado:

  1. Mantenga el cursor sobre el encabezado, haga clic en Encabezado y luego, seleccione Editar diseño.
  2. En la sección predefinida de diseño, haga clic en Izquierda o Derecha.

Menú expandible de equipos de escritorio y tabletas

Para configurar el menú expandible:

  1. Haga clic en el icono de hamburguesa () para abrir el editor de Diseño del menú.
  2. En la pestaña Diseño, haga clic en la diseño existente para seleccionar un diseño de menú.
  3. En la pestaña Estilo, tiene las siguientes opciones:
    • Ingresar desde. Seleccione Arriba o Costado.
    • Efecto de entrada. Seleccione Cubrir o Empujar.
    • Ancho. Mueva el control deslizante para ajustar el ancho del menú expandible cuando se expande. El ancho del menú se define en porcentajes para adaptarse a todos los tamaños de pantalla.
    • Fondo. Configure el color o la imagen de fondo.
    • Color del icono de cierre. Seleccione un color para el icono de cierre, así como un color de fondo para el mismo.
  4. En la pestaña de Espacio en blanco, cambie el espaciado interno.

El menú expandible puede tener hasta 3 filas, y cada una se personaliza completamente.

Nota

Si los sitios para Escritorio y tableta tienen la misma disposición (ambos expandibles o de barra superior), todas las personalizaciones son iguales para ambos. En caso de que sean diferentes, cada dispositivo se debe definir por separado.

Si no ve las funciones de encabezado antes mencionadas, tal vez esté usando el encabezado antiguo. Para actualizar al nuevo encabezado, haga clic en el encabezado en la vista de escritorio y tableta. Se crea una copia de seguridad automática cuando actualiza el encabezado.

Nota

Este paso solo se aplica a sitios existentes, no se refiere a sitios nuevos.

Encabezado para dispositivos móviles

Para editar el encabezado para dispositivos móviles:

  1. Mantenga el cursor sobre el encabezado, haga clic en la etiqueta Encabezado y luego, seleccione Editar diseño.
  2. En la pestaña Diseño, haga clic en el diseño existente para seleccionar un diseño de menú. El encabezado para dispositivos móviles ofrece múltiples diseñoss que muestran widgets, tales como enlaces de redes sociales, números de teléfono y más. Los diseñoss de encabezado son fijos, por lo que no puede agregar nuevos widgets, pero puede editarlos o quitarlos.
    Cuando agrega una tienda o usa la función multilingüe, se le ofrecen más opciones de diseño que incluyen los iconos para el carro de compras de la tienda y la función multilingüe. Si no tiene la tienda o la función multilingüe habilitadas, estos dieños no aparecen.
  3. Haga clic en Izquierda o Derecha para la posición del icono del Menú.

Navegación para dispositivos móviles

Para editar el menú expandible, abra el menú en la vista para dispositivos móviles. El editor de menú se abre automáticamente para editar.

  1. En la pestaña Diseño, haga clic en el diseño existente para seleccionar un diseño en el menú. El menú expandible ofrece múltiples diseños que pueden mostrar enlaces de redes sociales, información de contacto y más. Puede agregar cualquier widget al menú expandible, agregar columnas, ordenar las columnas para que queden una al lado de la otra o una sobre otra. Sin embargo, cuando cambia de un diseño a otro, se elimina todo el contenido que ha agregado al menú y se usan solo los widgets del diseño seleccionado.
  2. En la pestaña Estilo, tiene las siguientes opciones:
    • Ingresar desde. Seleccione Arriba o Costado. Cuando seleccione Arriba, mueva el control deslizante de altura. Cuando seleccione Costado, mueva el control deslizante de ancho.
    • Efecto de entrada. Seleccione Cubrir o Empujar.

Actualizaciones a los diseños para los dispositivos móviles

Para actualizar el nuevo encabezado de vista para dispositivos móviles, haga clic en la vista para dispositivos móviles. Se crea una copia de seguridad automática cuando actualiza el encabezado.

Nota

Este paso solo se aplica a sitios existentes, no se refiere a sitios nuevos.