Menú Transparente Sticky en WordPress con Elementor

[@berthortiz]

Código -- css --- selector.elementor-sticky--effects{ backdrop-filter: blur(4px); background-color: rgba(0,0,0,0.8)!important; } selector{ transition: background-color 1s ease !important; } selector.elementor-sticky--effects >.elementor-container{ min-height: 70px; } selector > .elementor-container{ transition: min-height 3s ease !important; } .logo img { max-width: 90px; height: auto; transition: all 0.5s ease; } .elementor-sticky--effects .logo img { max-width: 80px; height: auto; }

[@JOACKOLATORRE]

Me súper sirvió!!!! Muy agradecido

[@kattycreativa_rdk]

Mis sinceras gracias. Por fin alguien que explica las modificaciones ese el ccs. Excelente información!!!!

[@diegoperedo1208]

Muy buen tutorial muchas gracias!

[@berthortiz]

tuviste algún problema al seguir el tutorial?

[@diegoperedo1208]

@@berthortizNo, esta muy buena tu forma de explicar! solamente que utilice el codigo que me redirigió a tu pagina web y no me resultaba, luego utilice el codigo que subiste a los comentarios y funcionó de maravilla, capaz fue mi error jajaa pero por el resto una belleza

[@wadodesigns]

Saludos, funciono perfectamente, ahora quisiera cambiar el color del logo, tengo la imagen del logo en formato .svg se puede hacer?

[@berthortiz]

Si, pero ahorita no sabría como hacerlo. Mi PC no sirve, intenta poner .logo svg { fill: #333; } Ahí nomás cambia el color. En teoría debería funcionar

[@berthortiz]

Comenta si te funciona. Saludos

[@oscarb612]

buenzoooo

[@joseplluis1663]

Hola y Gracias!!! está estupendo. Solo me queda un pequeño espacio en blanco en la parte superior de la cabecera que desaparece al bajar (scroll) puedes ayudarme a poder eliminar este pequeño espacio?

[@berthortiz]

Hola josep, 1- intenta quitar el padding (relleno) de la sección del header. 2- revisa el margen y que no tenga ni mas ni menos. 3 revisa la imagen, después de ciertos pixeles tiende a aparecer ese borde blanco. sino lo arreglas manda me video por Instagram y vemos cual es el problema- instagram.com/berthortizweb/ saludos.

[@explicatodoo]

Solo debes desenlazar los rellenos, eso me pasó y revisé y es lo que te dije. Saludos

[@0owilliano0]

hola, disculpa el enlace para el código CCS esta suspendido, podrías facilitarnos otro, por favor.

[@berthortiz]

Disculpa, aqui re lo dejo. si necesitas ayuda coméntame y dime si te sirvió. ----- CSS -------- selector.elementor-sticky--effects{ backdrop-filter: blur(4px); background-color: rgba(0,0,0,0.8)!important; } selector{ transition: background-color 1s ease !important; } selector.elementor-sticky--effects >.elementor-container{ min-height: 70px; } selector > .elementor-container{ transition: min-height 3s ease !important; } .logo img { max-width: 90px; height: auto; transition: all 0.5s ease; } .elementor-sticky--effects .logo img { max-width: 80px; height: auto; }

[@miguelzenteno3800]

en el min 4:00 me quedé no se muestra en la previsualización :'v no se qué hice mal

[@berthortiz]

a veces elementor tarda en cargar la previsualización o simplemente no la muestra. También puedes abrirla desde paginas en el panel de WordPress. si tienes dudas, solo dime y te ayudo

[@solutechcore]

No me funciona