Sticky Bar

Paso 2 - Plantilla >

Sticky Bar

Previous pageReturn to chapter overviewNext page
Mostrar/ocultar el texto oculto

Cuando se desplaza una Página hacia abajo, a partir de un cierto punto el Encabezado ya no será visible. Normalmente el Encabezado contiene elementos importantes como por ejemplo el Logotipo, el Título del Sitio web y sobre todo el Menú de navegación principal. Para permitir a quien visita el Sitio web orientarse siempre del mejor modo, es posible hacer que estos elementos se retomen en una barra que durante el desplazamiento de la Página permanece siempre visible, anclada en la parte superior de la ventana del Navegador. Esta barra se la denomina Sticky Bar y puede personalizarse tanto en sus contenidos como en el estilo gráfico por medio de las opciones al efecto presentes en las siguientes secciones:

General  
Contenidos  

Si se trabaja en la realización de un Sitio web adaptable, es posible configurar la Sticky Bar para las Vistas correspondientes a los diferentes puntos de interrupción definidos. En estos casos, de hecho, la ventana presenta una Barra de Adaptabilidad, que reproduce la ya ofrecida en la ventana Resoluciones y Diseño Adaptable. La Barra de Adaptabilidad reproduce todos los puntos de interrupción definidos y, en función de estos, identifica intervalos: basta con pulsar sobre un intervalo para seleccionarlo y proceder a la definición de los ajustes gráficos o de los contenidos de la Sticky Bar.

Para proceder a la creación de un Sitio web adaptable, es necesario elegir la opción Sitio web Adaptable de la ventana Resoluciones y Diseño Adaptable.

Pulsar para expandir/reducirReferencia: Las opciones de la sección General

Para hacer que aún cuando el encabezado ya no está visible se siga viendo una barra en la parte superior basta con activar la opción Mostrar una barra superior.

Una vez activada, el aspecto de la Sticky Bar puede personalizarse mediante las opciones presentes en la sección Estilo:

Color Fondo: especifica el color para usar como relleno del fondo.
Archivo imagen: selecciona el archivo gráfico (.JPG, .GIF, .PNG.) de la imagen que se utilizará como fondo. La imagen puede buscarse bien en la Librería online a la que se accede mediante el botón bien en las carpetas locales por medio del botón Seleccionar archivo.
Repetir: especifica si la imagen añadida como fondo debe repetirse o no. La imagen puede repetirse solo en sentido horizontal, solo en el vertical o en ambos sentidos, hasta llegar a llenar el espacio disponible. Además es posible hacer que la imagen se adapte o cambie su tamaño para cubrir todo el fondo. En este caso, podrían no respetarse las proporciones originales.
Alineación: define cómo debe ser alineada la imagen insertada respecto a la Sticky Bar.
Altura: indica el valor expresado en píxeles de la altura de la Sticky Bar.
Opacidad: define el grado de opacidad del color de fondo de la Sticky Bar. Para valores tendientes a 0 disminuye la opacidad y el filtro se vuelve más transparente, dejando ver los contenidos de la Página.
Extender hasta el ancho de la ventana del Explorador: si está activa, hace que la Sticky Bar se extienda ocupando toda la anchura de la ventana del Navegador y no solo la anchura de los Contenidos de Página.
Pulsar para expandir/reducirReferencia: I comandi della sezione Contenidos

Una vez definido el aspecto gráfico es preciso ocuparse de los contenidos de la Sticky Bar.

Para conformar la Sticky Bar es posible usar un editor gráfico igual al disponible para la Plantilla (ventana Contenido de la Plantilla). Este editor gráfico presenta una barra de herramientas y, debajo de la misma, un área de trabajo en la que  se presenta la imagen utilizada como fondo d: la imagen se muestra a escala 1:1 y, si fuese necesario, se puede deslizar con la barra de desplazamiento horizontal incluida. Sobre esta imagen se muestran, en tiempo real, todas las modificaciones introducidas con los comandos disponibles.

Inmediatamente debajo de la imagen cargada hay una barra de estado en la que se indica:

Posición muestra las coordenadas X e Y que identifican la posición del ángulo superior derecho del Objeto seleccionado, respecto al área ocupada dalla Sticky Bar.
Tamaño muestra el valor expresado en píxeles de la anchura y de la altura del objeto seleccionado.

Por último, bajo la Barra de Estado están indicados en una lista todos los Objetos que es posible utilizar para conformar la Sticky Bar.

Los Objetos son los mismos empleados para conformar las Páginas (ver Paso 4 - Páginas): para poder encontrarlos más fácilmente están organizados mediante filtros y para cada uno de ellos hay disponible una vista previa.

Dentro de la Sticky Bar es conveniente reproducir los elementos principales del Encabezado, y el primero de todos, el logotipo de la empresa o el título del sitio web y el menú de navegación principal.

 


Best practice:

-

Cómo trabajar con las plantillas

-

Dónde encontrar nuevas plantillas para WebSite X5