Como hacer un Header / Menú Transparente en Elementor Pro | Encabezado Sticky
HTML-код
- Опубликовано: 8 фев 2025
- ¡No olvides suscribirte!
¡Si eres de México puedes dar clic en este enlace para recibir $300 pesos de regalo en tu próxima compra de supermercado en Jüsto! justo.mx/accou...
En este tutorial de Elementor en español, aprenderás una de las grandes tendencias en diseño web en este momento, que es cómo crear un header (encabezado) menú transparente. En este video, te enseñaré cómo puedes crear un menú de encabezado transparente en WordPress con Elementor Pro desde cero.
→ Elementor Pro (los tres paquetes tienen las mismas características)
be.elementor.c...
→ Código CSS necesario
drive.google.c...
🔥 Descarga la Plantilla Gratis 🔥
alejandrogs.co...
¡Gracias a Living with Pixels por el código!
Encuentra su canal aquí
/ @rinodeboer 
Хобби
NO comento nunca pero me encanta que lo hagas todo rápidamente, muchas veces se tiran 30 min para este mismo video y tu eres conciso amigo, mis respetos
Por un momento creí que era colombiano... muchas gracias por el video, me ayudó!!!
Perfecto a fecha de hoy mayo 2021 este es el único video que funciona el efecto, ya que explica el mejor método. Felicitaciones, probé varios otros videos y no resulta, creo que puede ser por las actualizaciones de elementor.
Muchas gracias! hace rato estaba peleando con el header de mi página jaja ahora quedó impecable ;)
¡Felicitaciones hermano! Eres un duro... Sin duda alguna explicas muy bien. Saludos desde Venezuela.
¡Excelente aporte, Alejandro! Muchas gracias por compartir con nosotros :)
Con mucho gusto
el mejor tutorial ever👏, gracias crack
Qué bien¡ me salió todo ok. Muchas gracias por compartir buena información.
Excelente efecto y muy fácil de comprender. Gracias y adelante
Muy buen vídeo.! y gracias por publicar el código css.
Hermanazo te quedó excelente, gracias! Me diste un buen datazo
Muchas gracias hermano, me ayudaste con el menu que me quedaba detras del slider revolution
Excelente, Muchas Gracias por compartir :)
Increíble tutoria, gracias infinitas :).
gracias, excelente tutorial, pero cuando yo le pongo color transparente a la seccion del menu no se pone transparente, se pone blanco!
Hola Alejandro, te saludo desde Colombia, muchas gracias por compartir tus conocimientos, siempre veo este video cuando tengo que hacer el header fijo, enserio muchas gracias, tengo dos preguntas, para que por favor me las ayudes a solucionar: 1. Siempre me sigue quedando el header ancho aunque coloque el logo mas pequeño y modifique el código del container, es decir, el header se achica solo un poco pero igual sigue quedando ancho ¿a qué se deberá eso? ¿cómo lo puedo solucionar? y otra pregunta: veo que en el sitio web usas un slider con la cabecera transparente ¿Cómo haces eso? es que yo lo puedo hacer pero debajo del header, es decir, no me deja superponer el header si uso slider... ¿tienes un video donde muestres como hacer este proceso?
Está buenísimo el contenido, pude crear mi página de diseño gracias a tus videos. Me gustaría saber como cambiar color del header y que sea opaco no translúcido, Saludos!
Muchas gracias Vania! Para hacerlo hay que modificar el código CSS background-color: rgba(0,0,0,0.5)!important de 0.5 a 1, y los valores que están en 0 por el código RGB de tu color!
Excelente video, y como agregas las imagenes que estan de fondo
Graciaaaaaaas 🩷
Gracias crack!
Excelente video
genial bro, buen video. Tengo una duda, cómo sería para ponerle un borde solido de 1px abajo al contenedor y que solo aparezca al hacer scroll hacia abajo, es decir al momento de la transición? agradezco tu ayuda.
hola hermano excelente video tengo una pregunta como puedo hacer que cuando hago scrool en ves de oscureserce el header se ponga de otro color
En la primera línea del código CSS viene el color en formato RGB (0,0,0,1) el primer cero es Rojo, el segundo es Verde y el tercero es Azul, mientras que el cuarto número es la opacidad, si buscas en Google Color HTML a RGB te va a arrojar el código de color que quieres.
me preguntaba como hacer para que cambie de color los items del menu cuando son sticky y me funciono esto, espero les sea de ayuda
selector.elementor-sticky--effects nav.elementor-nav-menu--main.elementor-nav-menu__container.elementor-nav-menu--layout-horizontal.e--pointer-background.e--animation-fade ul li a{
color: red;
}
GENIAL. MUCHAS GRACIAS.
Como podría hacer que el fondo del Header se desenfoque a través de ese mismo código?
hola estimado , una consulta la pagina debe estar por defecto o en cambas?
En Elementor ancho completo si tienes varias páginas, elementor canvas si lo vas a meter dentro de una landing page!
Hola, cuando modifico el margen me queda la imagen por encima del menu, sabes por qué es???
Hola, cuando pongo el margen de la seccion en -90px me oculta toda la seccion y no se ve el menu, que estoy haciendo mal?
Debes desvincular juntos los valores, es el icono que parece una cadena
Muchas gracias, no se si me estoy quedando sordo o no se escucha casi nada xD
Si! Ya tengo un nuevo micrófono para mejorar el audio, por lo pronto habilité los subtítulos!
@@alejandrogonzalezexpert1766 Todo lo demás espectacular, yo de verdad creo que te puede ir muy bien, explicás muy muy bien
graccia
Gracias por el video, buena explicación. Te recomiendo hablar un poco mas fuerte, es como si estuvieras susurrando y mas encima tiene música el video, cuesta escuchar. Entregas muy buena información. Saludos
Gracias, pero subir el volumen sería ideal. Un abrazo.
Papi el volumen de la voz tiene que ser más fuerte sino es un susurró lo que se escucha!!!!
Totalmente de acuerdo Daniel! Ya corregí el audio en los siguientes videos!
Espero que mejores la calidad de tu audio... gracias.
Les juro que voy a poner una pista de audio encima de este video!!
Es un buen contenido pero vas demasiado rápido apenas da oportunidad de ver dónde haces click o lo que retocar y toca pausar demasiado el vídeo
Aprecio mucho la retroalimentación Javier! Lo tomaré en cuenta para futuros videos!
Se escucha muy baja la voz.
Ya mejoré el audio en los siguientes videos! Gracias por tu comentario!
pues suba el volumen :)
Terrible tu audio, tuve que poner volumen 100....!!!! por eso tiene dedito abajo.