Bricks 101 Part 5 - Create a Header Template - Bricks Builder #wordpress Tutorial - BricksBuilder.io

Templates are great for Headers. We'll cover how to set it up and create a Basic Header.

00:00 Intro
00:51 Create a Header Template
02:62 Add the First Section
04:49 Add a Heading to be the Logo
06:34 Style the Heading
08;56 Style the Parent Section
10:10 Add a Nav Menu
10:56 Address the Typography
12:29 Align the Container's Items
15:18 Padding to the Container
16:01 Styling the Nav Menu Further
19:28 Set the Display Conditions

We love to create - share - respond - and deliver.

Hire us to work on your Website!

[crspmyh]

It worked! I just have created my first header for my bilingual website! So happy, and grateful for this tutorial, and all your other great work. If I ever win the lottery I come to the UK and take you and your whole family out for dinner 😀. You are definitely in my top 3 of YouTube tutors!

[wppagebuilders]

Wow, this tutorial really dives deep into setting up a header template with Bricks Builder! It's great that they're emphasizing the importance of templates for maintaining consistency across multiple pages—definitely saves a ton of time. I appreciate the detailed walkthrough on structuring sections and containers, and the tips on optimizing images for web using WebP format are spot on. Looking forward to seeing how they flesh out the content in the next video!

[RichardWadeUK]

Excellent video mate, superbly explained. After much delaying and distractions, I'm finally getting stuck into Bricks. In pure Macca's style... "I'm lovin' it"

[davidwalls]

Thanks Imran, I'm looking forward to the remaining videos in this series. I'm almost finished developing an Elementor website in Bricks but I'm sure I'll learn some better approaches during this series.

[mubindidit]

Hey Imran! Thank you so much for putting in the hard work. Loved all the bricks videos.
Can you please make a video to create search pages and customize the search box?
Maybe you can combine those to "Blog archive page" videos in this series.

[Thrive-WP]

So is there any particular reason to have the container in this example? Could you have just had the logo and menu in the section? I'm just curious with all the div drama with elementor. I'm always thinking how can I make this with the least amount of div's, sections, containers or columns etc.

[itsnelson]

I find the header the most complicated thing in Bricks.

[jugibur]

Thanks for sharing Imran! Q: What could be the best way to have an individual header image plus text (or what ever) for each page? I guess we need ACF oder MetaBox etc. for building an input to insert an image, right?

[ravakano]

How do you create hover effect like color change on the menu? Should be super simple but I can't seem to find a way how. I used the hover selector but when I change the color it changes the coler of every menu item. I just want to change the color or bg color of the item im currently hovering over.

[barrystockdale]

Hi Imran. I am just getting to grips with Bricks and following your videos. I have a problem with scrolling. I cannot scroll down the widget panel as there is no scroll bar to click. I keep having to zoom out so that I can see everything. Can you help?

[NassR]

Hi, thank you for great videos, please shortcut your content it's too much unnecessary explanation, also avoid using 60fps videos!

[vanessasorino]

Looks okay but it done nothing to convince me to change from Elementor - Sorry