Instead of using the Icon List, you can use the Nav Menu (Elementor Pro) widget or similar widget from some free plugin (like ElementsKit, it has a Nav Menu in the free version). You will need to create a menu first (WP Dashboard -> Appearance -> Menus). The Nav Menu widgets have a mobile dropdown option, and you can set the breakpoint (when the menu becomes a hamburger icon) to tablet >1024px or mobile >767px.
@@CreateOnWeb if I use wp plugin i will not find this video at the first place, i like this tutorial because this icon list solution is somehow smart. anyway i will try your advice of elementskit. thank you very appreciate your work making this video.
@@indioarmani8209 Thank you Indio! I will add this to my list of videos, so expect a video in the future about this - hamburger mobile menu, free and no extra plugins.
I tried using the code but i have some issues, i dont know if the issues are because i am using flexbox container or for other reason, what happens is that when i paste the code, in the editor preview seems to be working but when i publish it, it doesnt work in a private browser tab, also, i have a back to top button that i have setup with transparency 0-80% so it dissapears when its on the top and it only shows up when you are scrolling down, now the button will fully load since the very beginning and i dont know why the code is affecting the button.
I deleted the old menu (through appearences) , and want to replace it with this new menu. But the old menu keeps coming back. Anyone know how to fix this?
I did it transparent, but i am not able to click on the links, if i change the position of the icon list below the container using transform, then it's redirecting to other page.. May i know the reason.?
Hi, thank you for this tutorial! I had following issue when implementing the html code, the transparent sticky header functions impecably but on below sections of the website, some photos became transparent/invisible. Any idea how can this be fixed? Thanks a lot
Hi! The problem you have shouldn't be because of the code provided, but I guess anything is possible... I'm curious what is happening on your website to cause that. If you want, share the URL where the photos become invisible, and I will try to help you fix it.
@@CreateOnWeb Hi, thank you! When I remove the html code, the issue dissapears. I'm not sure how to share the url with you without sharing it publicly though since it is still a working stage. Thanks
![Free Elementor Sticky Transparent Header Tutorial. [Sticky Header On Scroll Effects] No CSS, No BS😜](http://i.ytimg.com/vi/-fMpH_aKRcI/mqdefault.jpg)
![Free Elementor Sticky Transparent Header Tutorial. [Sticky Header On Scroll Effects] No CSS, No BS😜](/img/tr.png)
Simple, moderately geekish, effective, PERFECT! Thanks a lot, dude!
Thank you so much bro , you saved me lot of time. all the best
Make MORE videos like this. You are doing great
finally i found this video, this is so perfect! Thanks a lot🙏
yooo so underrated... thanks a lot my guy! u saved my day :D
Awesome- liked and subscribed. Thank you!
Really worked for me in Elementor header !!!Thank you 😁
Damn this was really good , tnx 🙏
I have watch many videos about transparent BG. But none of these were work. Thanks for the video. Z index works for me.
Thanks you sir!
It's very helpful for me.
Worked for me - 9/25/2023 ... Thx! ... I'll sub & buy you a coffee.
3:40 Just the solution that I was looking for, thanks!
Your an animal! thank you for so much information. Brother - great teaching
Perfecto 👌👌👌 I've suscribed !
I spent 2 days working on this but after I watched this video I did it with 6 minutes.
how to change those icon list menu to hamburger menu in mobile? this is cool tutorial.
Instead of using the Icon List, you can use the Nav Menu (Elementor Pro) widget or similar widget from some free plugin (like ElementsKit, it has a Nav Menu in the free version).
You will need to create a menu first (WP Dashboard -> Appearance -> Menus). The Nav Menu widgets have a mobile dropdown option, and you can set the breakpoint (when the menu becomes a hamburger icon) to tablet >1024px or mobile >767px.
@@CreateOnWeb if I use wp plugin i will not find this video at the first place, i like this tutorial because this icon list solution is somehow smart. anyway i will try your advice of elementskit. thank you very appreciate your work making this video.
@@indioarmani8209 Thank you Indio! I will add this to my list of videos, so expect a video in the future about this - hamburger mobile menu, free and no extra plugins.
You could hide the original menu for mobile, create another menu using accordion and hide it from desktop (use Hamburger) for the icon
straight to the point. thanks!!
Worked!! Great Tutorial
I tried using the code but i have some issues, i dont know if the issues are because i am using flexbox container or for other reason, what happens is that when i paste the code, in the editor preview seems to be working but when i publish it, it doesnt work in a private browser tab, also, i have a back to top button that i have setup with transparency 0-80% so it dissapears when its on the top and it only shows up when you are scrolling down, now the button will fully load since the very beginning and i dont know why the code is affecting the button.
is there a way to add sub menus to the main menu?
it worked!!!... you are a genius! tahnk you!!!!!
hi somehow my header disappeared, how can I find it again?
I deleted the old menu (through appearences) , and want to replace it with this new menu. But the old menu keeps coming back. Anyone know how to fix this?
It dosen't work on my site, probably an updated of elementor that dosen't recognized the code.
I did it transparent, but i am not able to click on the links, if i change the position of the icon list below the container using transform, then it's redirecting to other page..
May i know the reason.?
this header will show on this particular page. it will not work on all the pages. and how to add sub menu?
please brother I want the background image in video please that has a person like motion graphic
please i want it
How to make this element appear on all pages?
not working... please help
But how i can do the header in mobile to be inside a boz and not under the logo?
the html code doesn't work
It's not showing on all my pages, only the homepage, please help!
So copy the html code and paste it on the site´s you want.
Hi, thank you for this tutorial! I had following issue when implementing the html code, the transparent sticky header functions impecably but on below sections of the website, some photos became transparent/invisible. Any idea how can this be fixed? Thanks a lot
Hi! The problem you have shouldn't be because of the code provided, but I guess anything is possible...
I'm curious what is happening on your website to cause that. If you want, share the URL where the photos become invisible, and I will try to help you fix it.
@@CreateOnWeb Hi, thank you! When I remove the html code, the issue dissapears. I'm not sure how to share the url with you without sharing it publicly though since it is still a working stage. Thanks
I have same the issue, how did you solve it?
Changing the jQuery version from 1.8.3 to the most recent one seems to fix this issue
simple and very helpfull
If we need to add a sub menu in services that is not possible 😅
Thanks a lot brother!
Perfect ,Thank you
its different now with the last version of elementor pro 3.21.1
great job
not working on the front end
Sir your videos are informative why you leave channel..mean just upload 3 videos..?
Thank you ❤
Thank You!!
Brilliant. 💛
😊
Great.. Thanks
Thank you
Thanks
thank you so muchhhhhhh
very thanks sir
but bro this header is only for one page not for other pages
It's NAV! Not Header. Header is section with Web Designer text, button, image etc. It's important for Google robots. Nav!!
Nah bro, that's the hero section.
Doesn't work for me
Bro start making videos again :D
Doesn't work..
these are all fake comments broo its sooo easy
Really worked for me in Elementor header !!!Thank you🤗
Thank you very much.