Divi Header Design | How to make a custom header in Divi
Vložit
- čas přidán 7. 09. 2020
- In this Divi Header Design, I show you step by step how to make a custom header in Divi. Divi header is an important part of your website because it helps people navigate your website.
Design your Divi header easily with this tutorial.
Get 10% OFF Divi Theme Builder - funnelstoincome.com/Divi (Includes BONUS Course)
0:36 What we will be designing
1:37 Divi header design
1:51 Add Divi Glogal header
15:26 View final design - Jak na to + styl
Mak - I cannot tell how many times your videos have saved the day. Thank you for all you do!
I love you dude! You have helped me a lot over the years with Divi! Keep up the good work man, is really good stuff. Quick and simple.
Super helpful! Saved me hours of work and makes my site that much better!
Perfect directions! Thank you, DIVI's MAK!
Thanks Mak. Always great!
Ok, this made it SO easy to learn! Thank you so much.
Hi, wonderful tutorial, thank you. However I have a problem with the search box in the primary menu, I can't change the text colour. Does anyone know how to change it via CSS? Thank you
Ideally, in the mobile version, the drop-down menu should occupy its own space as a block that displaces everything else when it is opened, that way, if there is advertising ADS, the drop-down does not overlap with the ad. Could you make a tutorial with it? Thank you.
You are a great teacher! I'm one year late though, and Divi seems to have changed a lot. I find out that they have moved the scroll option to" Advanced" but I can't find out where I change the padding, and background color when the scrolling starts?
Amazing man! Thanks so much! I do have one quick question...how would I resize the logo? I've been trying and it just seems to refuse to resize. I've made it sticky as well, tried changing the sticky size and it just doesn't work at all.
thank you so much for the tutorial! :3
Gracias, buen tutorial.
I love your videos. thanks man!!!
Hi! I'm new to Divi. I would like to ask, how to make the social icon with hover effect available?
great tuto Make.
that was a good methode to costumize header.
easy and good.❤️💎
Hi Mak
I bought learndash and divi through your links but where do i send the invoice copy so i can get access to your courses?
Divi is one of the best tools on the market!
This is great! Thanks.
Great Job Mak... love it
Thanks for the great tutorial 👍👍
Hey Mak, awesome tutorial!! I have a question. I have a membership website, when I log out and click on the back button on the browser, my website shows protected content again. Can you please help me? Thanks a lot
hi mak, how to make custom header in divi + woo-commerce like amazon with bigger search bar . i have search more videos but elemantor got divi dont have
Thanks for the video.
Nice Works Perfect!
Great - thank you!
brilliant tut....tnx a lot...
Awesome Teacher!
You are amazing. Thanks a lot
Thank you!
what is that css code to align everything in the midde?
Thank you :)
Love you Dude!
How do I align the menu with the logo vertically?
Thank you very much! :) Does anyone know how to make the header overlap the website content instead of "pushing it down"? When I make the lower of corners of my header round it does not overlap the picture on my front page and therefore there is a white background where the corners have been.
Hi, have you ever figured out the white section exposed under the header when scrolling? I am sitting with this issue now. :(
Hi MAK, I am writing to you from Italy. I would like to know what the procedure for setting layout pages for proper visibility on tablet and phone. Thank you very much.
Oddly when i make changes to the image the whole thing stretches out on the builder. Unless i have things set to auto i cannot change anything.
wow great video,
Thank You
Awesome video
Thanks for the tutorial brother! It saved my day as well! Cheers.
Steve @ Gozy Mobile Solutions
Super mega good you’re the best
This is so good--thank you!!
You're so welcome!
Great Tutorial. 👍
For me the CSS code display: flex; didn't work with a 3-column row as 1/4-1/4-2/4. When I changed the row to 1/4-2/4-1/4 colums it started to work, I can't explain why.
Mak!!! Thank u!
BUT HOW CAN WE ADD CART ICON ON CUSTOM HEADER IN DIVI? IF anyone knows please response .thanks
Think you
What if I want to keep the social media module on mobile devices? Are the mobile users not allowed to use this feature? How do you properly align the social media module? Otherwise, let's just hide everything that doesn't look good on the first try.
Love u dear ... your every video makes me stress free ...
Thank you so much 😀
Great video !
Glad you enjoyed it
the dropdown menu came when you changed the size to mobile but what if we want it in desktop site
is it true that when u do this you no longer have ANY mobile menu styling options in divi
Someone, please help me: When I change the color to anything other than transparent, it works. But when I want to make the background transparent, it stays white! I can't seem to find a solution on my own.
Finaly some good at teaching Divi! thanks man!
that's cool . but how can i add more email recipient to divi forms molude
If we take two rows in a section, how to reduce the height of the header.
when this effect is tested in the mobile version, an error occurs, a spacing, how to solve it?
Maybe you need to make a video tutorials for custom humberger menu potitions on mobile..because by default only on left..so how to set humberger menu to right..
very nice video
How to change the hamburger icon color? Please tell me.
Hey, does someone know how to add | between each menu item
Hello, I made a full width custom header, it displayed well on a 1920p screen, but when displaying it on a 1366p screen, it got messed up..what's wrong?
Question, when choosing transparent for the default state, my main site now just shows as white. When choosing 2 different colors it works perfectly, but transparent just shows a white space as default state at the top instead of putting menu over top of my background image below.
Any suggestions?
Same here. Do you already know something to fix it? Please tell me if you do!
I had this problem as well since I am using a fullwidth global menu. I discovered that the custom menu it is sitting above/before any page content rather than overlaying on top. This is why the white page background is showing. To get around this, I had to go in and make the bottom margin on the fullwidth menu a negative value (-120px). Then to compensate any spacing issues, I added some top padding to each page's content. Hope this helps!
How to move a cart icon further right from the menu?
Mak, your teachings are so great that I stopped listening french teachings (I'm french), even if it's more challenging, the results for me are amazing. Thx a lot really.
You're very welcome!
@@sitekrafter from where can we add the sicky header option in padding? Please guide me about this.
Good
Love u
why the dropdown menu didn't show for desktop?
Love you Mak
GOAT
why when i add custom global footer then the layout of my page changes and header disable
This is an amazing video! I only have 2 problems. My menu is long, and it looks like people can't scroll the menu, to see all menu items, on a phone. And, how do I get the Cart icon to show?
I figured out how to get the shopping cart. Just need to know how to scroll a long menu on a device.
@@AgileWaters Has anyone found a solution to the scrolling issue?
i love you, brother.
Amazing content right there. One thing though, don't you think removing socials from phone/tablet is a bit impractical for a solution?
Yeah it's an absolute cop out.
It doesn't work for my guys. Everytime I try to change the section size while scrolling it remains the same size. I've followed the tutorial and seen it about 20 times. What could it be wrong? Moreover when I change some colors of spacings it changes the size of my logo (in the home page not in the working one). Please help me!
Nice video.Please tell me how to place to logos in the menu bar? Both will be inline with the menu items. The 2nd logo will be a little away from the st logo and centered between the menu items like Home, About us Contact
How we can make language button in divi header ?
I still for some reason cannot get the mobile drop-down menu to show up no matter what background I change it to
He won’t write back
@@joeys7570 he dont ever
i am a divi sub
how can i get the course
plz help
thx
Hi Mak. I’m wondering when someone will respond to my email. I purchased Divi with your link and can’t wait to see your course. Hope my email didn’t go to spam🤦🏾♀️
He won’t write back
Nice but we really need way better mobile menus than a dropdown.
there is no sticky position menu in my divi , why?
Update Divi to the latest version.
they dont have sticky option in 2021
You should've placed the social media icons within the dropdown menu on mobile view, getting rid of them was a silly solution, no doubt you're a web designer mate.
I prefer not to have them.
When you go to mobile view the hamburger is no longer centred
Your links don't work. You don't give the freebies that you said after I bought from one of your links. SMH
mobile
hi, requesting to publish a video on Divi "Read More" Button with jQuery - Reveal a Hidden Section on Click. thanks