Are you new to Elementor and looking to customize the header of your website? Look no further! In this beginner’s guide, we’ll walk you through the step-by-step process of editing the header using Elementor. Customizing the header is essential for creating a unique and visually appealing website. Let’s get started!

Introduction

Before we dive into the details, let’s briefly understand Elementor. It is a powerful drag-and-drop page builder that allows you to design and customize various sections of your website, including the header. Customizing the header gives you the flexibility to create a cohesive and engaging user experience.

1.Install a plugin

  • Go to wordpress dashboard
  • I will open my page where i will design my header.
  • This is fresh page. Now i will open my page, where i will create custom header .
  • First, install a plugin
  • Go to plugin
  • Then add new
  • Now search for a plugin called ‘ Elementor header and Footer
  • Then Install and Activated this Plugin
elementor-header-and-footer-plugin

2.Craeate Header Tamplates

  • When you go to Appearance
  • You will see “Elementor Header and Footer Option
  • Open this Plugin interface
  • Click “Add New” option
  • Then set Tittle
  • I’m going to write ‘Header
  • Through the display On option
  • You will get the option (Entire Website) of placing your header anywhere on the website option
  • Then click publish

3.Custom Header Design

  • Now start our editing part
  • Now start our editing part
  • Click Edit with elementor
  • Before i design in figma, Now i will took at the design and create the website
  • First choose this 4 section structure
  • Then click 9 dot icon and drag this text heading
  • and drop it here
  • You can see 3 different text in top-left and opposite side
  • Implement image widget to set this App icon Top right corner
  • Now choose first one,
  • copy this text then paste it here
  • Change HTML tag to H6, Alignment (Center)
  • Go to style, then you can change your font style
  • I’m click main section and change background color
  • Then change font color to white
  • Change font size, font weight
  • Duplicate this section and copy other text and paste it here One by one
  • Copy Donates then paste it here
0