Saturday, December 3, 2022
No menu items!
HomeElementor TemplatesThink Header Template

Think Header Template

Overview

hello friends welcome back with another

video and in this tutorial i’m going to

show you that how you can create a

beautiful header for your website using

elementor pro so if you don’t have

elementor pro

just follow the channel and you will get

a video of how you can install the

elementor pro in your website so if you

want to create a beautiful header

in this video i will show you step by

step how you can create it otherwise if

you want to download pre-built headers

for my website

just visit get into pocket.com

i will give you the link in description

and just here in the menu you will see a

header just click on it these all are

elementor headers

as you can see i have added a lot of

headers just click on it and download

the header you like mostly

so come back to my website

here in the dashboard as you can see the

website is empty and nothing we have in

this website just we are going to create

a beautiful header for this website so

first of all what we need to do is for

creating a header we need a beautiful

menu to

add on our header so for creating a menu

what you need to do is go to appearance

here menu

and i’m going to create a new menu here

as you can see we don’t have any menu

just click on menu name and add the menu

name you prefer i am going to add a

primary menu here and click on create

menu

as you can see our menu is npd and we

don’t have any pages here i’m just going

to create some demo link pages so first

of all i’m going to create a homepage so

i’m going to add the name of this page

as home

and nothing at the link

there is your first page and next is

about us

about

us

so

[Music]

next is about us and then

services

services

and the next is contact us or something

else about

plans so plans

the next

and the last is contact us so contact

us

page is the last you need to create all

the pages i’m just going to create demos

to show you how you can create

a menu so here i’m going to add the last

contactor so money is ready just click

on save menu here

and as you can see our primary menu is

ready okay the next step is that we are

going to create a header for this

website so come back to it

just go to elementor templates and here

click on add new

and here click on header so we are going

to

add the type of this template as a

header so next is the name of address so

we are going to add a default header

name here

create template

[Music]

so as you can see we have a lot of pro

templates here but we need to create a

new template that’s where we’re going

we’re not going to use this template

okay so here is our default area of

header we are going to customize it so

first of all what we need is the logo

here and a menu and a search or contact

us here so just click on this plus

and we have a structures here a lot of

structures and we are going to add this

one here the three section structure

so as you can see the structure is added

here what we need to do is adding logo

here so for adding site logo we are

going to add cycle over here i did not

uploaded the logo here so that’s why i’m

going to add an image

so

here i’m going to drag the image here

okay so this is added so first of all

click on the choose image

and select your logo so i’m going to

select it and insert media

as you can see my logo appears here what

we need to do first is the change of

color so as you can see my logo is in

white color so i’m going to add the

background color black so for this we

are going to start

first of all select the structure the

wall structure from here

and from here we are going to click on

background type and here classic

the color and we’re going to change this

to black as you can see my logo is

appears here so for changing the logo

size just click on the logo

and here you can change the size to

medium large or custom

like most so i’m going to

add it full

and from here you can drag it to

customize it as big and

smart

i’m going to add

logo here it looks perfect so first what

is the next next is the menu so click on

it

and add a navigation menu here

so you can see all menu is added here

what we need to do is drag the other

side to look it completely so it looks

complete here what we need to do is

change the colors of our menu

so for channing the color go back to

styles and here you can see the

typography here you can change the fonts

and size of your menu text

what is next the text color so here i’m

going to change the text color to white

now you can see the color is white and

the whole color is green so if we want

to change the whole color to red as you

can see the logo is end with a red dot

so

what we need to do is

click on hover and here you can see text

color is

green so i’m going to add a red color

here so for adding a red color you need

to select the red one

and pointer for what is the pointer

pointer is the last section as you can

see the green

line behind the text okay

so i’m going to also click on red and

add a pointer red so as you can see it

looks very beautiful here

okay what is the next step so we need to

add a search option here or contact us

anything else

as you can see i’m going to add a search

option here click on search form

and drag and drop here oh my god it’s

not looking better here so we need to

customize it the screen of it first

customizing skin we are going to add is

minimal so minimal looks attractive but

you don’t need minimal also

the full screen

as you can see this one is looking

durable so drag it and make it smaller

so as you can see we are going to change

the color of this we need to add the

size so

the size is looking fine here but the

search block icon is not appearing click

on style

and we need to find the logo color here

so color

click on it and change it to white so

a little dark white side that’s looking

perfect

so what we need to do is add this menu

to center so this menu is at left side

what we need to do is click on this menu

and find uh

here we need the align section click on

center and you can see

the menu is in center so this is the

logo

this is the menu and a search option

once we click on it as you can see the

search appears here we can write

anything and

okay this color is also halfway so we

need to add a white color searcher

click on it again and you will see the

typography overlay color is

black if we click on white what happens

no it’s not looking perfect

we need it black

okay so overlay color is black as you

can see the black appears here but we

need to change the text color

okay text color is

black so it’s white now you can see we

have the written text in white color

okay this also close it

and you can see our beautiful header is

created if you want to add some other

functions here

just click on here and customize what

you want so you want to add a heading

here

click on text and add at the bottom of

this menu as you can see

i’m going to add

that okay

that 50 percent off

and first order

so it’s a heading we need to customize

it also click on it to edit center and

then the typography

size so text size is too big we need to

make it smaller it’s perfect here just

need to change the color also to white

okay

if anyone click on it the whole color is

same so need to change the whole color

what is text for here so

it’s looking

nice here okay

you have a lot of blending options here

if you want to change it to screen

and

color dodge

a lot of options don’t need to do

anything here

so the header is completed as you can

see if you need to save it and publish

it on your entire website what you need

to do is click on publish here you can

see a condition widget appear here you

need to add the condition so i will tell

you what is condition if you want to add

this header on entire website you need

to select the entire site or if you want

to add on some pages except all over

let’s suppose you want to add on home

page and not other any page you need to

select the home page manually just click

on add

conditions and

includes entire website

and click on update so

here just need to click on update

congratulations your side part is live

so we are going to refresh it

wow the beautiful header appears here

well this one is looking perfect okay so

here is a beautiful

header completed so if you want to learn

more about this

just subscribe our channel and if you

want to download these type of headers

visit my website i will give you the

link in description also subscribe my

channel to support me i will teach you

how you can create a beautiful footer in

the next video thank you so much take

care bye

For more information check its documentation and also subscribe to the YouTube channel for the latest updates.




Previous article
Next article
RELATED ARTICLES
- Advertisment -

Most Popular

Recent Comments