Overview
In this video, we cover how to build an amazing header on any WordPress theme using Elementor Theme Builder.
From now on, you are no longer limited by your theme’s restrictions. If you don’t like your theme’s header, and can’t make changes – now is the time to try the easy-to-use and visual header & footer editor with Elementor. By bringing the power of Elementor to these areas, you can design any header or footer you can imagine.
Transcript
hey everyone it’s Cassie from Elementor
in this video I’ll go over how to create
customized headers tired of being stuck
with a particular header limited by your
theme now you can edit and design any
aspect of your header using element or
on any theme the header template lets
you easily design and edit custom
headers offering all the easy
drag-and-drop element or functionality
create headers using our pre-designed
blocks or from scratch let’s head on
over to headers to create a header first
we’ll need to make a header template by
the way check out these updated tabs
header footer single and archive will
focus on the header see other videos to
learn about the other tabs so in the
WordPress dashboard under element or my
templates click add new header choose
header give it a name if you don’t name
it it’ll just give you a default name
this opens the template library offering
a variety of customizable blocks choose
the header template block and insert
once added you’ll see the header block
in the elementary ed atang screen where
you can customize it as you like your
entire header area is edited right here
you can extend it however you want like
adding a top bar there’s already a
widget in the block that displays the
logo you added in the customizer if you
do not see a logo it’s because you
didn’t add one you can go to the
customizer and add it or use a standard
logo image now in case you’ve never done
it to set your site’s logo on WordPress
use the WordPress customizer from the
customizer choose site identity select a
logo and then crop it and publish and
refresh and there you go magic now you
see your logo now your logo is fed from
your WordPress setting customize your
logo as you like and content and style
let’s move on to editing the navigation
menu nav menu on the right click the nav
menu to open the content options under
layout you can see
we have two menus here if you already
created your menus they will appear here
otherwise go to the menu screen to
create your menus in WordPress you can
tweak your menus here name them and
check the settings you need don’t forget
to save your menu back in layout choose
the menu that you want now you can
design your menu adjust the alignments
at the pointer style and animation etc
see the nav menu video for more info I
want to demonstrate that there are no
restrictions when designing the header
of course you can change the style play
around with the settings there to show
this more let’s add a separate section
to serve as my top bar add a to column
section let’s drag in a heading widget
and some social icons you have the full
element or functionality and flexibility
to change anything
dragon whatever you want a button links
phone number and you can change the
color resize it etc want to make your
header sticky under section go to
settings advanced scrolling and turn the
sticky on and click publish
check out the new display conditions
under include add a condition from the
drop-down menu choose entire site or a
specific page you can also add exclude
where you exclude it from a particular
page let’s try a singular and exclude it
from a 404 page you can also save
without conditions press have a look to
see it live now if you visit any other
page in your site you’ll see the same
header you’ll notice here that we
expanded the Edit with Elementor button
so if you hover over it you can access
your new header back in WordPress
Elementor my templates header you can
see the header that you just created
here you can edit it or delete it etc be
aware that some themes automatically
delete the footer when adding a
customized Elementor header no worries
the solution is easy just create your
own footer using the same flexibility
you have in Elementor so enjoy
elementor’s header template and get off
on the right foot with footers to see
the next video to learn how
thanks for watching
