How to Edit the Header on Your WordPress Website (3 Ways)

WordPress is one of the most flexible Content Management Systems (CMS) on the market. As a WordPress beginner, it may be tempting to stick with the basic design your theme provides. However, if you do that you’ll miss out on the opportunity to customize important elements such as your header. 

The header is more than just a place for your logo and main menu. WordPress offers several ways to increase its functionality. You can add tracking codes, insert a search bar, include a login option, and more.

In this post, we’ll look at why you might want to edit the header of your WordPress website. We’ll then show you three ways to do it. Let’s get started!

Why You Might Want to Edit Your Website’s Header

The header is one of the most crucial elements of your website. This section is located at the top of your site and usually appears on every page. It typically contains your logo, main menu, a log-in link, and a search field. 

If you have an online store, you probably also have your shopping cart in your header:

It’s worth remembering that the header is usually the first thing visitors see. With dozens of competitors out there, you’ll need to make the best possible impression quickly.

There are many reasons you might want to edit your header. Perhaps you wish to change the alignment of your menu, or make your logo bigger so that it stands out. 

Alternatively, you might want to add new elements to the header to improve the User Experience (UX). For instance, you might include a search field so users can look for something more quickly.

Additionally, you might add social media buttons to your header. This way, users can easily follow you on other platforms. 

How to Edit the Header on Your WordPress Website (3 Ways)

Now that we’ve discussed some reasons you might wish to edit your header, we’ll show you three easy ways to do this on your WordPress website. 

1. Using the Theme Customizer on Classic Themes

The Theme Customizer will be your go-to tool for the most basic changes to your design. This feature is the easiest way to edit elements such as your header. However, different themes will have different options. 

To get started, navigate to Appearance > Customize in your WordPress dashboard. This will launch the Theme Customizer:

Note that if you’re using a block-based theme, you won’t be able to access the Customizer. Instead, you’ll need to use the new Site Editor (which we’ll cover in the third method).

In the Customizer, you’ll see a menu on the left with all the different elements that you can edit. Some themes contain more options than others. However, at the least you should be able to to change the site’s name, tagline, and logo. You’ll find these settings under Site Identity:

If you go to Menus, you’ll be able to customize the appearance of the menu in the header: 

Other options in the Customizer might include adding a header image:

Feel free to explore all of the available settings for your header. When you’re ready, click on Save Changes

2. Using a Plugin

While the Theme Customizer is incredibly useful, it only lets you change the appearance of your header. This means that if you wish to add tracking codes and make other custom changes, you’ll need to use a plugin like Insert Headers and Footers.

After you install the plugin, navigate to Settings > Insert Headers and Footers in your dashboard:

The plugin has three separate sections: Scripts in Header, Scripts in Body, and Scripts in Footer. If you want to edit your header with custom CSS, you’ll need to add this code to the Scripts in Header field. 

The plugin will insert anything you place into this field before the </head> tag. This function is perfect for adding tracking codes for Google Analytics and Google AdSense. The main advantage of using a plugin such as Insert Headers and Footers is that the codes and customizations that you add to the header won’t get deleted if you change themes in the future.

3. Using Full Site Editing

Full Site Editing (FSE) is a new set of features that enables you to edit every area of your WordPress site. It gives you more control over the design of your site than the Customizer. Even better, it works just like the Block Editor. Therefore, you’ll find it easy to use if you’re already familiar with WordPress blocks. 

Note that FSE is only compatible with block-based themes such as Twenty Twenty-Two. If you’re using a classic theme, you won’t be able to access this feature. 

To edit your header, navigate to Appearance > Editor in your WordPress dashboard. This will launch the Site Editor:

By default, the Site Editor will open the homepage. However, you can select different templates to edit, including the header and footer. In the panel on the right, select Header. You can then start editing this template:

You can click on individual elements, such as the Site Title block, to edit them:

You can use the toolbar or the settings on the right to customize every block within the header. Additionally, you can add new elements by selecting the plus (+) icon. For example, you might add a search bar:

Once you’ve finished customizing your header, make sure to save your changes. These will be applied across your entire site. 

With Full Site Editing, you can also create additional template parts, including headers. In the Site Editor, click on the WordPress logo on the top left corner, and then select Template Parts:

As you can see, Twenty Twenty-Two offers a few variations of the header. To create your own, click on the Add New button and select Header:

Then, give your template a name and click on Create. This will launch the Site Editor, where you can create your header from scratch:

All you have to do is select your blocks and place them in your desired locations. You’ll find the main elements for the header, such as site title, logo, and navigation, under Theme blocks:

If you need some inspiration, click on the Patterns tab and select Headers from the menu. There, you’ll find plenty of premade designs that you can customize to suit your needs:

As you can see, using FSE is the easiest way to edit the header on your WordPress website. It also gives you a lot of flexibility. 

Conclusion

The header is one of the most important areas on your site. It contains your site’s title and brand logo, and useful features such as your main menu and a search bar. Because it is a vital part of your website, you might feel it’s time to edit the appearance of your header or expand its functionality. 

In this post, we looked at three ways to edit the header on your WordPress website:

  1. Use the Theme Customizer for simple edits.
  2. Use a plugin like Insert Headers and Footers to add tracking codes and custom CSS.
  3. Customize the header with Full Site Editing, or create your own using blocks and patterns.

ABOUT THE AUTHOR

The WordPress.com Team

At WordPress.com, our mission is to democratize publishing one website at a time. Create a free website or build a blog with ease on WordPress.com. Dozens of free, customizable, mobile-ready designs and themes.

More by The WordPress.com Team

%d bloggers like this: