Multi Builder
Ir a la webPreciosAPI
  • Base de conocimientos
  • Plataforma
    • Ajustes
      • Sitemaps
      • Dominios
      • Idioma y hora
      • Título, Favicon, Imagen para compartir
      • Cookies y confidencialidad
      • Solicitud de datos del cliente
      • Administrador de archivos
      • Panel de control
      • Código personalizado
      • Personalización
      • Ajustes de SEO
    • Editor
      • Estilos globales
      • Imágenes
      • Footer o pie de página
      • Header
      • Estilos globales de textos
      • Paleta de colores
      • Diseño del sitio
      • Estilo de la página
      • Cómo añadir páginas y pop-ups
      • Tipos de vistas y vistas previas
    • Widgets
      • Básicos
        • Widget: Contenedor
        • Widget: Botón
        • Widget: Separador
        • Widget: Espaciador
        • Widget: Icono
        • Widget: Acordeón
        • Widget: Sección de icono
        • Widget: Imagen
        • Widgets: Texto y títulos
        • Widget: Barra de progreso
        • Widget: Menú
      • Generación de leads
        • Widget: Citas
        • Widget: Formulario
        • Widget: Inicio de sesión/Registro de miembros
        • Widget: Cuestionario/Encuesta
      • Ventas
        • Widget: Donación
        • Widget: Tienda
        • Widget: Módulo de pago
      • Medios
        • Widget: Redes sociales
        • Widget: Audio
        • Widget: Galería
      • Otros
        • Widget: Blog
        • Widget: Cuenta atrás
        • Widget: Mapa
        • Widget: Código
        • Widget: Incrustar
        • Widget: Buscar
    • Embudos
      • Introducción
      • Ajustes del embudo
      • Upsells y downsells
      • Pasos del embudo
      • Prueba A/B (A/B testing)
      • Embudo dentro de una web
      • Ofertas bump
      • Estadísticas en embudos
      • Generador de enlaces de seguimiento
    • CRM
      • CRM (Conceptos básicos)
      • Etiquetas
      • Propiedades
      • Miembros
      • Mensajes y formularios
      • Ficha del contacto
      • Segmentos
    • Tienda online
      • Conceptos básicos
      • Ajustes de tu tienda
      • Productos
      • Gastos de envío
      • Impuestos
      • Formas de pago
      • Descuentos y ofertas
      • Página del producto
      • Página del catálogo de productos
      • Carrito
    • Blogs
      • Cómo crear un blog
      • Widget: Blog
      • Página de presentación del blog
      • Artículos del blog
    • Portfolios
      • Cómo crear un portfolio
    • E-mails
      • Campañas de e-mail
      • Automatizaciones
      • Segmentos
      • Autorización para el envío de e-mails
      • Doble opt-in
      • Cómo verificar tu dominio
      • Plantillas de e-mail
      • Editor de e-mails y bloques
      • Listas y suscriptores
    • Calendario de citas
      • Agenda de citas (I): Introducción
      • Agenda de citas (II): Cómo crear un Operador
      • Agenda de citas (III): Cómo crear un Servicio
      • Agenda de citas (IV): Cómo crear un Evento
      • Widget: Citas
  • E-mails del sistema
  • LMS
  • Comunidades
  • DISEÑOS DE EMBUDOS
    • Tipos de embudos
      • Generación de leads
      • Embudo para un webinario
      • Embudo "hero"
  • Integraciones internas
    • Twilio
    • E-mail marketing
  • Integraciones externas
    • Make
  • Zapier
  • Usuarios avanzados
    • Modificaciones con CSS
      • Galería de imágenes en móvil
      • Scroll to Top
      • Posición del menú en móvil
      • Menú móvil a pantalla completa
      • Menú desplegable en móvil
      • Cómo mejorar textos en móvil
      • Efecto de scroll sobre una imagen
    • Modificaciones con CCS y JS
      • Widget de Sección de icono con efecto hover
      • Icono o botón en móviles
      • Barra fija de llamada a la acción
      • Widget de Sección de icono con tooltip
    • Modificaciones con JS
      • Añadir descripciones a formas de pago
  • Otros
    • Preguntas frecuentes
    • Glosario
      • Administrador
      • Agenda
      • Automatización
      • Campaña
      • Carrito abandonado
      • Contacto
      • CSS
      • Dominio
      • Downsell
      • E-mail marketing
      • Embudos
      • Encuesta (o Cuestionario)
      • Etiquetas
      • Formulario
      • Grupo de miembros
      • JavaScript
      • Lista
      • Membresía
      • Miembro
      • Mensaje
      • Oferta bump
      • Operador
      • Página del sistema
      • Pedido
      • Portafolio (o Portfolio)
      • Producto
      • Propiedad
      • Proyecto
      • Segmento
      • Sitio web
      • Subdominio
      • Suscriptor
      • Suscripción
      • Widget
      • Upsell
Con tecnología de GitBook
En esta página
  1. Plataforma
  2. Editor

Header

cabecera | menú | header fijo | header lateral

AnteriorFooter o pie de páginaSiguienteEstilos globales de textos

Última actualización hace 1 año

El header o cabecera solo lo encontraremos en un sitio web (los embudos no tienen header ni footer). Es la parte de la web donde encontramos el logo, el menú y otros elementos como redes sociales o un campo de búsqueda.

Los ajustes generales de la cabecera los encontramos colocando el ratón encima:

Ajustes de la cabecera

Importante: el header (y también el footer) lo podemos Ocultar o Mostrar individualmente en cada una de las páginas. Asegúrate siempre de que está activo.

Si vamos a Ajustes de cabecera veremos lo siguiente:

Con el menú desplegable Diseño de la cabecera definimos el formato, en la parte superior o en un lateral:

  • Parte superior - Tamaño normal

  • Parte superior - Ancho completo

  • Parte superior - Compacto

  • Vertical - a la izquierda

  • Vertical - a la derecha

Experimenta con los formatos para ver cuál se ajusta más a tu diseño.

Cuando el header está en la parte superior veremos los siguientes ajustes:

  • Color de fondo de la cabecera: a veces lo mejor es que sea transparente.

  • Añadir borde inferior: se añade una línea con el color que elijamos.

  • Colocar cabecera encima del contenido: el header quedará justo encima del primer bloque de cada página y se integrará en el contenido (mejor en color transparente).

  • Aplicar cabecera fija al hacer scroll: en este caso podemos diseñar dos headers (uno para cuando se carga la página y otro que quedará fijo mientras hacemos scroll) o bien dejar el mismo header. Para diseñar el segundo header simplemente tenemos que hacer scroll y bajar un poco para modificar el diseño y que quede guardado.

Si el header está en un lateral, la configuración es más simple: solo podemos cambiar el color del fondo y añadirle una sombra.

Estructura del header

El header tiene tres áreas donde podemos insertar widgets de contenido a derecha, izquierda o centro.

También podemos agregar una fila en la parte superior e inferior de la cabecera principal. Cada una de estas filas también está dividida en tres áreas.

Los widgets de la cabecera están limitados a 11, y algunos de ellos son los mismos que encontramos en el menú lateral izquierdo del editor:

  • Botón

  • Código

  • Icono

  • Menú

  • Búsqueda

  • Separador

  • Texto

  • Redes sociales

Los widgets específicos del header son:

  • Logo: que debe estar siempre presente (aunque esté vacío) para mantener el diseño de la web. Para el logo podemos escribir un texto o cargar una imagen cuya altura podremos ajustar.

  • Iniciar sesión/perfil: que enlaza con la página del sistema llamada Inicio de sesión/Registro de miembros, en el caso de que hayamos creado una membresía en nuestra web. Es el enlace de acceso al contenido solo accesible a miembros. Aquí simplemente elegimos si queremos solo el icono, o con texto, y el tamaño del icono y los colores del widget, como puedes ver en la imagen de abajo.

  • Carrito: enlaza con el carrito donde los usuarios pueden ver los productos pendientes de compra. Los ajustes son los mismos que los del widget anterior.

Ajustes de la cabecera
Áreas del header
Widgets del header o cabecera
Ajustes del logo