BLOG
Encabezado móvil
Personaliza la cabecera y la barra de navegación de tu sitio web para dispositivos móviles.
Si lo deseas, reemplaza la cabecera predeterminada por una versión móvil en dispositivos más pequeños. La cabecera incluye el logotipo del sitio, el botón para mostrar el menú de navegación y otros elementos típicos.
Puedes encontrar los siguientes ajustes en el panel Layout → Mobile de YOOtheme Pro.
Visibilidad
Define el tamaño del dispositivo a partir del cual se reemplaza el encabezado de escritorio por el encabezado móvil. El punto de ruptura depende del número y el tamaño de los elementos de la barra de navegación.
Utilice los botones de vista previa del dispositivo para ver cómo se ve el sitio en diferentes anchos de pantalla.
| VISIBILIDAD | DESCRIPCION |
|---|---|
None | No mostrar el encabezado móvil. |
Pequeño | Muestra el encabezado móvil si el ancho del dispositivo es inferior a 640px. |
Medium | Muestra el encabezado móvil si el ancho del dispositivo es inferior a 960px. |
Large | Muestra el encabezado móvil si el ancho del dispositivo es inferior a 1200px. |
Header Layout – Posiciones
Seleccione la disposición para el logotipo móvil, la barra de navegación y las posiciones del encabezado. (Logo, Navbar y Header)
| POSICION | COLOR | DESCRIPCION |
|---|---|---|
Logo | Negro | Muestra el logotipo, así como el área del widget móvil del logotipo. |
Navbar | Verde | Muestra la ubicación del menú de navegación móvil y el área de widgets |
Header | Púrpura | Muestra la ubicación del menú móvil del encabezado y el área de widgets |
Horizontal Layouts
Barra de navegación (Navbar)
| OPCIÓN | DESCRIPCION |
|---|---|
Static | La barra de navegación se desplazará fuera del área visible al hacer scroll. |
Sticky | La barra de navegación permanecerá fija en la parte superior de la ventana gráfica al desplazarse. |
Sticky on scroll up | La barra de navegación se desplazará fuera del área visible al desplazarse hacia abajo y permanecerá fija al desplazarse hacia arriba. |
Nota Si se configura un encabezado transparente en una sección, la barra de navegación fija aparecerá una vez que se haya desplazado por debajo de la sección principal y se ocultará cuando la sección principal entre en el área visible.
Haz que el encabezado sea transparente y se superponga al fondo del sitio en todas las páginas, incluso cuando esté fijo. El color del texto del encabezado cambiará automáticamente según el fondo. Opcionalmente, puedes colorear las partes de la barra de navegación por separado y combinar el color del texto de la barra de navegación con el contenido de la página.
Dialog Layout – Posiciones
Además del diseño de la cabecera, YOOtheme Pro puede mostrar menús y widgets publicados en el área de widgets del diálogo móvil en una barra desplegable, una barra lateral o una ventana modal. El diálogo se abre al hacer clic en un icono que aparece automáticamente en la cabecera móvil.
Seleccione la posición del botón del diálogo. Opcionalmente, muestre el texto “Menú” junto al icono.
Seleccione el diseño para la posición móvil del diálogo. Los elementos que se pueden pulsar se muestran como puntos suspensivos. Además, todos los diseños ofrecen la opción de centrar su contenido horizontalmente y de mostrar u ocultar el botón de cierre para los diseños fuera del lienzo y modales.
Dialog Push Items
Dropbar Layouts
Offcanvas Layouts
Modal Layouts
Offcanvas Options
| OPCIÓN | DESCRIPCION |
|---|---|
Slide | La barra fuera del lienzo se desliza sobre el contenido de la página. |
Reveal | El contenido de la página se desplaza fuera del área visible, dejando al descubierto la barra fuera del lienzo que se encuentra debajo. |
Push | La barra fuera del lienzo desplaza el contenido de la página fuera del área visible. |
Videos
-
Encabezado móvil (Visibilidad)
-
Diseño del encabezado (Configuración)
-
Barra de navegación (Configuración)