Encabezado Fijo con JetBlocks

Como crear un Encabezado Fijoo

Muchos temas de WordPress sugieren encabezados fijos, también conocidos como encabezados “pegajosos”, pero dichas secciones también se pueden crear con Elementor Page Builder utilizando el complemento o Plugin JetBlocks.

En este tutorial aprenderás cómo usar la función Jet Sticky y agregarás un encabezado “fijo o pegajoso” a cualquier tema de WordPress mientras usas Elementor.

Siéntete libre de ver el siguiente video tutorial para ver con qué facilidad se pueden crear secciones pegajosas mientras trabaja con Elementor, o seguir leyendo.

Haciendo la sección de encabezado “Pegajosa”

  1. Primero, necesitas crear una nueva plantilla de encabezado. Puedes crear una desde cero o usar una de las plantillas de encabezado prediseñadas representadas en la biblioteca de plantillas de JetThemeCore. Puedes encontrar las plantillas de encabezado en CrocoBlock> Mi biblioteca, enumeradas en la sección de partes del tema del encabezado.
  2. Has clic en Editar con la opción Elementor. Se abrirá el editor de elementor..
  3. Has clic con el botón derecho en la opción Edición y selecciona Editar sección. Luego navega a la configuración de la sección Avanzada. Aquí localiza el bloque Jet Sticky.
  4. Para habilitar la opción de Encabezado Pegajosa, active la Sección Pegajosa
  5. Ahora selecciona la visibilidad de la sección Pegajosa adecuada. Esto significa que puedes seleccionar los dispositivos en los que la sección se vuelve pegajosa.
  6. La siguiente opción disponible es Z-Index. Aquí puedes hacer que la sección superponga el contenido existente en su sitio, o que se muestre debajo de algunos de los bloques.
  7. La opción Ancho Máximo te permite seleccionar el ancho máximo de la sección adhesiva. Simplemente arrastre el control para ajustar el ancho según tus necesidades.

Personalizando el Encabezado Pegajoso

También puede personalizar la configuración de estilo del encabezado pegajoso. El nuevo estilo se aplicará cuando la sección se ponga pegajosa (cuando uno desplaza la página hacia arriba y hacia abajo).

  1. En la configuración de estilo, puedes cambiar los márgenes y los rellenos para las secciones, aplicar un tipo de fondo diferente para que el encabezado sea semitransparente o invertido cuando aparezca en la parte superior del contenido de tu sitio web.
  2. También hay una opción Box Shadow o Sombra de Caja que te permite agregar una sombra alrededor del encabezado pegajoso para hacerlo más destacado o discernible.
  3. La opción Duración de la transición definirá el tiempo de retraso para que el encabezado se posicione en la parte superior de la página cuando uno lo desplaza.
  4. Después de establecer las condiciones, has clic en Actualizar para aplicar los cambios a tu sitio.

Leave a Reply