Las opciones de la sección Menú de la Hamburguesa

Paso 4 - Páginas > Objeto Menú >

Las opciones de la sección Menú de la Hamburguesa

Previous pageReturn to chapter overviewNext page

Cuando el espacio disponible no es suficiente para consentir la visión de todos los elementos, el Menú se sustituye automáticamente con el Icono de la Hamburguesa. Esto sucede también en el caso de que no se haya activado la creación de un Sitio web Adaptable (en Resoluciones y Diseño Adaptable).

Si el Objeto Menú ha sido añadido en el editor de la Plantilla, el espacio disponible depende del tamaño con el que el Objeto mismo ha sido diseñado. Si por contra el Objeto Menú se ha añadido dentro de una Página, el espacio disponible está determinado por el tamaño de la Celda de la Rejilla de maquetación que lo contiene.

 

El Icono de la Hamburguesa tiene forma cuadrada y la misma altura y el mismo estilo que se ha definido para los botones del Menú Principal (sección Principal).

Pulsando sobre el Icono de la Hamburguesa se muestra el Menú de la Hamburguesa, es decir un menú emergente que muestra los elementos del primer nivel.

Pulsar para expandir/reducir

Para definir el estilo del Menú de la Hamburguesa es posible en primer lugar usar las opciones disponibles en el recuadro Vista:

Apertura: especifica si cuando se pulsa sobre el Icono de la Hamburguesa el Menú debe abrirse hacia la derecha o hacia la izquierda.
Efecto: define con qué efecto se debe mostrar el Menú de la Hamburguesa.

Dado que el Menú de la Hamburguesa se muestra superpuesto a la Página, es posible definir algunas opciones para el Estilo Overlay de Contenidos:

Color de Fondo: define el color de fondo de lo que queda fuera de el Menú de la Hamburguesa, es decir el color que se vuelve semitransparente (según el valor definido para la opción Opacidad) y se utiliza para crear un filtro que oscurece la Página en segundo plano.
Opacidad: define el grado de opacidad del color de fondo de la parte exterior del Menú de la Hamburguesa. Para valores tendientes a 0 disminuye la opacidad y el filtro se vuelve más transparente, dejando ver los contenidos de la Página.

Las opciones para definir el Estilo del botón son las siguientes:

Ancho: ajusta el valor en pixels de la anchura de los botones que contienen los elementos de Menú
Margen: establece el valor en pixels del margen horizontal y del margen vertical, es decir del espacio existente entre el borde del botón y el texto contenido.
Distancia: define el valor en píxeles del margen exterior, es decir del espacio que hay entre un botón y el otro.

La anchura de los botones debe ser definida considerando también el espacio total disponible para el menú. Este parámetro se puede modificar libremente en el caso de que no se esté utilizando una plantilla gráfica predefinida (ver Estructura de la Plantilla).

Las opciones que están en el recuadro Texto del Botón son:

Fuente: define el tipo de carácter, el estilo y el tamaño del texto.
Alineamiento: establece la alineación del texto a la izquierda, en el centro o a la derecha respecto al botón.

También es posible definir el aspecto de cada elemento de los que conforman el Menú de la Hamburguesa. En primer lugar es preciso seleccionar el Elemento del Menú que se desea modificar: Fondo del sitio, Elemento de menú, Elemento al pasar el ratón, Separador y Línea de separación.

En función del elemento seleccionado, en la sección Estilo pueden estar disponibles las siguientes opciones:

Color de Fondo / Color del Texto: definen el color para el Fondo, para los textos de los Elementos en los diferentes estados, para el Separador del Menú y para el elemento Línea de separación.
Borde: define, también individualmente, el color, el espesor y la sombra para los bordes del Fondo.
Texto del Botón: aplica al Elemento al pasar el ratón o al Separador el estilo del texto Normal, Negrita, Cursiva o Subrayado. Este estilo se añade a lo ya definido en el recuadro Texto del Botón.
Ancho: disponible solo para el Elemento Línea de separación, define el ancho en porcentaje respecto al ancho del Menú de la Hamburguesa.