Tabla de contenidos
Una plantilla de encabezado Elementor es la barra superior de un sitio web guardada como un diseño ya hecho: el logotipo, el menú, un botón y, a menudo, una barra de contactos encima de ellos. Lo agregas una vez con un creador de temas y se muestra en cada página.
Esta publicación recopila las 43 plantillas de encabezado Elementor en la biblioteca Master Addons, agrupadas por el tipo de sitio que se adaptan. Cada uno tiene una captura de pantalla y una demostración en vivo que se abre en una nueva pestaña. Se instalan desde la pestaña Encabezados del Biblioteca de plantillas de complementos maestros y recorra todo el sitio Creador de temas de complementos maestros, por lo que no necesitas Elementor Pro para usarlos.
Salta a lo que viniste:
- Cómo agregar una plantilla de encabezado Elementor: cinco pasos con Theme Builder
- 43 plantillas de encabezado por tipo de sitio: SaaS, negocio local, tienda, multifila y mínimo
- ¿Qué diseño de encabezado se adapta a su sitio: una mesa rápida para reducirlo
- Preguntas frecuentes
Cómo agregar una plantilla de encabezado Elementor a su sitio
Un encabezado es una plantilla de Theme Builder: aparece en cada página y la editas en un solo lugar. Los encabezados de construcción en Master Addons Theme Builder son gratuitos y los pasos a continuación funcionan con el complemento gratuito y el Elementor principal.
En el vídeo a continuación, uno de estos encabezados va directamente a una plantilla de Theme Builder y luego se transmite en vivo en todo el sitio. Si prefieres leer, debajo se escriben los mismos pasos.
- En tu panel, ve a Complementos maestros → Creador de temas, clic Agregar nueva plantilla, establezca el tipo en Encabezado y haga clic Editar con Elementor.
- En el editor, haga clic en Plantillas de complementos maestros botón, abre el Encabezados pestaña, elige un diseño y haz clic Insertar.
- Reemplace el logotipo, apunte al Widget de meniul Nav en su propio menú de WordPress y cambie el texto y el enlace del botón.
- Abre el Condiciones pestaña, conjunto Incluir → Sitio completo y salva.
- Si su tema aún imprime su propio encabezado encima del nuevo, desactive el encabezado del tema en su configuración.
El guía del creador de temas de encabezado cubre los mismos pasos con una captura de pantalla para cada uno, incluido cómo excluir una página o darle su propio encabezado a una página de destino. El mismo creador de temas también maneja la parte inferior de la página, como se muestra en nuestra guía editar el pie de página en WordPress con Elementor. Si también necesitas un pie de página, nuestro Plantillas de pie de página de Elementor post tiene 34 diseños, cada uno con una demostración en vivo.
43 plantillas de encabezado Elementor por tipo de sitio
Los 43 diseños se dividen en cinco grupos. Salta al más cercano a tu sitio y abre dos o tres demostraciones una al lado de la otra antes de elegir.
| Tipo de encabezado | Diseños | Lo que comparten | Dónde |
|---|---|---|---|
| SaaS y tecnología | 14 | Menú corto y un botón de prueba o demostración | Saltar |
| Servicios empresariales y locales | 7 | Número de teléfono y botón de reserva | Saltar |
| comercio electrónico y tienda | 6 | Iconos de búsqueda, carrito y cuenta | Saltar |
| Barra superior y varias filas | 9 | Barra de contactos encima del logo y menú | Saltar |
| Mínimo y centrado | 7 | Una línea, pocos enlaces, logo centrado o dividido | Saltar |
Plantillas de encabezado SaaS y tech Elementor
La mayoría de ellos provienen de SaaS y kits tecnológicos y comparten un patrón: logotipo a la izquierda, cuatro o cinco enlaces y un botón de prueba o demostración a la derecha. Finix, Clowdify y Techbyte usan barras oscuras y Lead Lift se asienta sobre una color crema.
1. Shiftflow: plantilla de encabezado de la placa de trabajo Elementor
Creado para una bolsa de trabajo: Inicio, Empleos y Publicar un trabajo, siéntese a la derecha de una barra blanca, seguido de un botón delineado Publicar un trabajo gratis.
2. Techbyte: plantilla de encabezado de tecnología oscura Elementor
Azul marino oscuro, con la marca a la izquierda y tres enlaces a la derecha. No hay botón, por lo que se adapta mejor a un portafolio o sitio de proyecto que a una página de ventas.
3. Tecpart: plantilla de encabezado de empresa de TI Elementor
Un encabezado de servicios de TI cuyo menú desplegable Todas las páginas contiene nueve páginas internas, por lo que el nivel superior solo necesita tres enlaces más. La captura de pantalla muestra el menú desplegable abierto.
4. Clowdify: plantilla de encabezado de píldora Elementor SaaS
Todo el encabezado es una píldora negra redondeada con espacio a su alrededor. Funciones, precios, integración e inicio de sesión del cliente se encuentran junto al botón Comenzar ahora.
5. Craftova: plantilla de encabezado Elementor SaaS
Seis enlaces, estudio de caso entre ellos y un botón de inicio de prueba gratuita delineado. Se adapta a un producto con más páginas que el menú SaaS habitual de tres enlaces.
6. Finix: plantilla de encabezado SaaS oscura de Elementor
Negro con un logotipo verde, tres enlaces en el medio y un botón de inicio de prueba gratuita delineado. Con sólo tres enlaces, el ojo va directo a la prueba.
7. Agarre: plantilla de encabezado de agencia Elementor
Un encabezado de agencia con una marca denominativa grande, Acerca de, Estudios de casos y Contacto, y un botón Trabajar con nosotros donde un sitio SaaS pondría a prueba.
8. Klyro: plantilla de encabezado de demostración del software Elementor
Cinco enlaces en una barra gris pálido y un botón Solicitar demostración gratuita, para software que se vende a través de una llamada de demostración.
9. Lead Lift: plantilla de encabezado de inicio de Elementor
Una barra color crema con texto de enlace en negrita y una pastilla negra que dice Iniciar prueba gratuita. Es el más cálido de los encabezados SaaS aquí.
10. Nexis: plantilla de encabezado Elementor SaaS
Cinco enlaces espaciados en el medio, un logotipo verde intenso y un botón Comience ahora con un borde claro.
11. Optivue: plantilla de encabezado Elementor SaaS
Tres enlaces centrados en una barra blanca y un botón de prueba gratuito de inicio redondeado a la derecha. Hay muy poco que leer, por lo que el botón funciona.
12. Sabrion: plantilla de encabezado de inicio de sesión de Elementor SaaS
Precios, Acerca de y Contacto junto al logotipo, luego un enlace de inicio de sesión y un botón Iniciar prueba gratuita de 14 días. El inicio de sesión permanece en texto sin formato para que no compita con la prueba.
13. Sempla: plantilla de encabezado Elementor SaaS
Características, Acerca de nosotros, Precios y Testimonio al lado del logotipo, con Iniciar sesión y Comenzar ahora agrupados a la derecha.
14. Zaplyte: plantilla de encabezado de la aplicación Elementor
Los enlaces se encuentran justo después del logotipo en lugar de en el medio, lo que deja un espacio abierto antes del botón Comenzar ahora.
Plantillas de encabezado de servicios locales y comerciales
Encabezados para empresas de limpieza, dentistas, fontaneros, una clínica de terapia, un restaurante y una agencia inmobiliaria. La mayoría agrega una barra superior con un número de teléfono o enlaces sociales, y el botón principal reserva una cita, una llamada o una mesa.
15. HomeAxis: plantilla de encabezado inmobiliario de Elementor
Los íconos sociales, una dirección de correo electrónico y un número de teléfono se encuentran en una barra superior de lima. La fila principal tiene seis enlaces y un botón Obtener una cotización correspondiente con una flecha.
16. Balanciq: Plantilla de encabezado de clínica de terapia elemental
Inicio, Acerca de, Servicio, Terapeutas y Contacto con un botón redondeado de Inicio de su viaje. Colores suaves y mucho espacio, lo que se adapta a una clínica.
17. Limpiador: Plantilla de encabezado del servicio de limpieza Elementor
Los íconos sociales, una dirección postal y un número de teléfono comparten una delgada barra superior. La fila principal tiene cinco enlaces y un botón verde Reservar una cita.
18. Limpieza: plantilla de encabezado de empresa de limpieza Elementor
Una barra superior azul pregunta “¿Necesita ayuda de limpieza rápida?” junto a un número de llámenos. Debajo hay cinco enlaces y un botón Hacer una cita en el mismo azul.
19. Culinario: plantilla de encabezado de restaurante Elementor
Una barra superior color oliva con íconos de teléfono, correo electrónico y redes sociales encima de una fila principal color crema. Libro A Tabla es la única acción que solicita.
20. Dental: Plantilla de encabezado de clínica dental Elementor
El número de teléfono se encuentra justo al lado del botón Reservar una cita, para que un paciente pueda llamar o reservar desde el mismo lugar.
21. Plumbiq: Plantilla de encabezado del servicio de plomería Elementor
Llámenos e íconos sociales llenan la barra superior, con cinco enlaces a continuación y un botón azul Solicitar una llamada gratis.
plantillas de encabezado de tienda y comercio electrónico
Encabezados de tienda con íconos de búsqueda, carrito y cuenta. Sartivo abre un menú desplegable de categorías y dos de los diseños colocan una oferta de venta o un enlace promocional dentro del encabezado.
22. Encabezado de tienda azul con búsqueda: plantilla de encabezado de tienda Elementor
Una fila superior azul con íconos sociales, un logotipo centrado, un cuadro de búsqueda y un carrito. La fila del menú debajo termina en una hamburguesa para obtener enlaces adicionales.
23. Tienda de logotipos centrada: plantilla de encabezado de tienda Elementor
Debajo de una dirección azul y una barra de teléfono, el menú se encuentra a la izquierda, el logotipo en el medio y la búsqueda y el carrito a la derecha.
24. Tienda de barras Dark Top: plantilla de encabezado de tienda Elementor
Su barra superior oscura ofrece una consulta gratuita y un número de teléfono. A continuación se muestran el logo, seis enlaces y un botón de búsqueda.
25. Tienda de banners promocionales: plantilla de encabezado de promoción de la tienda Elementor
Tres filas: una línea de mensajes con íconos sociales y de cuenta, el logotipo al lado de un amplio banner de oferta y una barra de menú azul con búsqueda, carrito y lista de deseos.
26. Tienda de barras de búsqueda: plantilla de encabezado de búsqueda de comercio electrónico Elementor
La búsqueda ocupa el medio de la fila del logotipo, con la lista de deseos y el carrito a la derecha y un enlace de 70% de descuento en electrónica en la barra de menú.
27. Sartivo: plantilla de encabezado de tienda de moda Elementor
Un encabezado de tienda de moda con un enlace Tienda por categoría, un menú desplegable Todas las páginas, un logotipo centrado y una cuenta e íconos de búsqueda. La captura de pantalla muestra el menú desplegable abierto.
Plantillas de encabezado de barra superior y varias filas
Encabezados construidos a partir de dos o tres filas: una barra de contacto con teléfono, correo electrónico u horario de apertura, una fila de logotipos y una barra de menú. Se adaptan a agencias, clínicas y empresas de servicios que desean datos de contacto en cada página.
28. Barra de direcciones: plantilla de encabezado de barra superior Elementor
Barra superior gris con dirección e íconos sociales, luego el logotipo, seis enlaces y un botón azul Unirse ahora.
29. Menú en ángulo: plantilla de encabezado de cita de Elementor
Los horarios de apertura y tres pequeños enlaces de servicios públicos se encuentran encima de una barra de menú azul en ángulo que termina en un botón blanco Crear una cita.
30. Encabezado de información de contacto con Búsqueda: plantilla de encabezado de información de contacto de Elementor
Una barra azul con dirección, inicio de sesión e íconos sociales, una fila de logotipos con Llámenos y horarios de apertura, y una barra de menú azul con un cuadro de búsqueda.
31. Agencia creativa: plantilla de encabezado de agencia creativa Elementor
El logotipo tiene su propio gran bloque azul a la izquierda. Un número de teléfono e íconos sociales recorren la parte superior, con el menú debajo.
32. Menú flotante: plantilla de encabezado de menú flotante Elementor
Una barra azul contiene teléfono, correo electrónico y horarios de apertura. El cuadro de menú blanco a continuación se superpone a la parte superior de la página, lo que funciona bien con una imagen de héroe.
33. Comience la barra de contacto: plantilla de encabezado de barra de contacto de Elementor
Teléfono y correo electrónico en una barra superior ligera con un bloque sólido de Introducción a la derecha, luego el logotipo, el menú y el icono del carrito.
34. Clínica Médica: Plantilla de encabezado de clínica médica Elementor
El logotipo se encuentra en un panel azul diagonal. El teléfono y el correo electrónico van en la barra superior, y los íconos de búsqueda y carrito finalizan el menú.
35. Centrado en tres filas: plantilla de encabezado de tres filas de Elementor
Envíe un correo electrónico, llame por teléfono e inicie sesión en la barra superior, un logotipo centrado con un carrito e íconos sociales a cada lado, y una barra de menú azul de ancho completo en la parte inferior.
36. Visita, llamada y correo: plantilla de encabezado de datos de contacto de Elementor
Los bloques Visítenos, Llámanos y Envíenos un correo electrónico se alinean junto al logotipo, con una barra de menú azul debajo que contiene Iniciar sesión y Registrarse.
Plantillas de encabezado mínimas y centradas
Diseños inusuales y de una sola línea: un menú dividido alrededor de un logotipo centrado, una barra con un solo botón de menú, un logotipo centrado apilado y algunas barras simples de logotipo y enlaces.
37. Logotipo centrado apilado: plantilla de encabezado de logotipo centrada en Elementor
El logotipo se encuentra en la parte superior con el menú centrado debajo, un diseño que se adapta a blogs y sitios de portafolios.
38. Fire Away Split: plantilla de encabezado de menú dividido de Elementor
El menú está dividido en dos, con tres enlaces a cada lado de un logotipo centrado.
39. Botón de menú: plantilla de encabezado del botón de menú Elementor
Logotipo a la izquierda, íconos sociales en el medio y un botón de menú azul a la derecha. Funciona para sitios con sólo un puñado de páginas.
40. Encabezado mínimo con iconos sociales: plantilla de encabezado mínimo de Elementor
Una barra blanca con el logo, seis enlaces, un botón de búsqueda y tres iconos sociales.
41. CTA del ángulo morado: plantilla de encabezado de llamada a acción del elementador
Logotipo y menú en blanco, que termina en un panel violeta en ángulo que contiene un botón Descargar.
42. Iniciar sesión: plantilla de encabezado simple Elementor
Logotipo, seis enlaces y un enlace de inicio de sesión con un icono. Con tan poco, cae en casi cualquier sitio.
43. Resumen simple: plantilla de encabezado del menú desplegable de Elementor
Solo el logotipo, un menú con flechas desplegables y un ícono de cierre a la derecha, en una barra blanca lisa.
¿qué diseño de encabezado se adapta a su sitio?
| Tu sitio | Encabezado que normalmente funciona | Empezar con |
|---|---|---|
| SaaS o aplicación | Menú corto con precios y funciones, un enlace de inicio de sesión y un botón de prueba | Sempla, Sabrion, Nexis |
| Negocio de servicios locales | Número de teléfono visible, botón de reserva a la derecha | Dental, Plumbiq, Limpiador |
| Restaurante | Póngase en contacto con la barra superior y un botón Libro A Tabla | Culinario |
| Tienda en línea | Búsqueda, iconos de carrito y cuenta, menú desplegable de categorías | Sartivo, Buscar bar |
| Agencia o clínica con muchas páginas | Dos o tres filas con datos de contacto y una barra de menú completa | Clínica médica centrada en tres filas |
| Sitio de cartera o marca | Logotipo centrado o botón de Menú que mantiene limpia la barra | Logotipo centrado apilado, botón de menú |
Ejemplos de encabezados de sitios web: lo que comparten los buenos
- Le dan al visitante un botón principal. Nexis, Finix y Optivue tienen cada uno un único llamado a la acción, y Sempla diseña su segunda acción, Iniciar sesión, como un enlace simple para que los dos no compitan.
- Mantienen el menú corto. La mayoría de los encabezados aquí muestran de tres a seis enlaces, y Tecpart coloca el resto de sus páginas en un menú desplegable Todas las páginas.
- Las empresas locales muestran un número de teléfono. Dental, Cleanery y Plumbiq lo colocan en el encabezado, donde un cliente que prefiera llamar puede encontrarlo sin desplazarse.
- Las tiendas colocan la búsqueda en el encabezado. Cada diseño de tienda aquí lo tiene y la mayoría agrega un ícono de carrito al lado.
- Las barras oscuras utilizan texto claro y un botón delineado, como lo hacen Finix y Clowdify, por lo que ambos siguen siendo legibles.
Haz que el encabezado sea pegajoso
Un encabezado que permanece en la parte superior mientras los visitantes se desplazan mantiene el menú y el botón al alcance en páginas largas. Puede hacer que cualquiera de estos encabezados sea pegajoso y los pasos están en nuestra guía creando un encabezado adhesivo en Elementor. Pe a sitio web de una página, empareje el encabezado adhesivo con enlaces de menú que salten a cada sección.
Encabezado, sección, página o kit: ¿qué plantilla necesitas?
Una plantilla de encabezado cubre una parte del sitio. Si también estás construyendo el resto, la misma biblioteca lo tiene Plantillas de sección elementora para bandas individuales como precios o preguntas frecuentes, completo Plantillas de página de Elementor para páginas completas, y kits de plantillas que incluye un encabezado, un pie de página y cada página en un estilo coincidente.
Los encabezados marcados como Pro en la biblioteca necesitan un Licencia Master Addons Pro, que también desbloquea los kits completos de donde provienen muchos de estos encabezados.
Preguntas frecuentes
¿qué es una plantilla de encabezado Elementor?
Una sección de encabezado ya preparada guardada como plantilla de Elementor. Contiene el logotipo, el menú, los botones y, a menudo, una barra superior, y lo inserta en un encabezado de Theme Builder para que se muestre en cada página.
¿cómo uso una plantilla de encabezado en Elementor?
Cree una plantilla de encabezado en Master Addons → Theme Builder, ábrala en Elementor, inserte un diseño en la pestaña Encabezados de la biblioteca de plantillas de Master Addons, luego establezca la condición en Incluir → Sitio completo y guárdela.
¿necesito Elementor Pro para usar estas plantillas de encabezado?
No. Master Addons Theme Builder coloca el encabezado en sus páginas y su generador de encabezado es gratuito en el complemento Master Addons, por lo que no se requiere Elementor Pro.
¿Funcionará el encabezado en los teléfonos?
Abra la demostración en vivo en su teléfono o cierre la ventana de su navegador para ver cómo se comporta el menú en una pantalla pequeña antes de elegir una.
¿Puedo usar un encabezado diferente en una página?
Sí. Cree una segunda plantilla de encabezado y establezca su condición en Incluir → Singular → Páginas para esa página, luego excluya la página de su encabezado principal.
¿Por qué veo dos encabezados después de importar?
Su tema todavía está imprimiendo su propio encabezado. Desactívelo en la configuración del tema o en el Personalizador, o use un tema que oculte su encabezado cuando un encabezado del Creador de temas esté activo.
¿cuántas plantillas de encabezado incluyen los complementos maestros?
La pestaña Encabezados de la biblioteca de plantillas de complementos maestros tiene 43 diseños y cada uno de ellos está en esta página.
Elige un encabezado y configúrelo una vez
Comience con el grupo que coincida con su sitio e inserte el diseño que se ajuste. Si cambia de opinión más tarde, abra la misma plantilla de Theme Builder, elimine el diseño antiguo e inserte uno nuevo. Las condiciones de visualización permanecen como están.
Lectura relacionada: cómo importar una plantilla de Elementor, Plantillas de sección elementora, Plantillas de pie de página de Elementor y Guía propia de Elementor para construir un encabezado con contenedores.
