Pricing
Written by Editorial Team on December 14, 2020

How To Edit Header In WordPress?

Changing the content and appearance of your website will be the first step of improving the default design. You will most likely want to edit header in WordPress right after the installation success. While WordPress is often considered one of the easiest CMS to use, there is always a tiny learning curve, especially for beginners.

In this WordPress tutorial, you will learn exactly how to effectively and quickly improve your WordPress content.

Here's what you are going to discover today.

What Is A Header In WordPress?

WordPress uses a simple templating system where all header content is contained in a piece of code stored in the header. php template file.

The basic WordPress header has two parts: the topmost part is the meta-header part where you can insert meta-data tags for SEO purposes. It also contains links to the theme’s stylesheets. The lower part of the header contains all your branding info (company or website name, logo, and tagline).

What is a custom header in WordPress?

Custom headers is a WordPress theme feature which allows theme developers to enable support for customization of the header image. When custom headers support is enabled in a theme, the users can replace the default image used in the theme’s header with their own images.

Most themes have limitations as to what the size of the header image can be. Some themes are made so that there is only enough space to put a logo, others allow you to use the entire width of the theme.

Some themes will allow for the use of flexible headers that can expand or contract in size depending on the width of the browser window at the time. Some themes will also allow for the use of pre-uploaded header images that are already present in the theme, such as the ones available in the default WordPress theme.


How To Edit Header In WordPress? (Step By Step Guide)

Now, let's get started on how you can quickly and safely edit and modify your WordPress header without using any WordPress plugin or having any coding skills.

Step 1: How to access the header configuration?

You are first required to login to the WordPress backend a.k.a. wp-admin. From there, navigate to Appearance → Header.

How to access the header customization page in WordPress
~How to access the header customization page in WordPress?

Depending on your WordPress setup, you may and may not find the Header tab. If the tab is not found, you should navigate to Appearance → Customize.

Step 2: How to edit the appearance of the header?

We will begin with the Header Image section of that page.

The main field is called Current Header, and as the name suggests, it is for the preview of the changes which were already performed on the component.

Add New Header Image In WordPress
~Adding new header image in WordPress

Step 3: How to add custom header images to WordPress?

We will begin with the Header Image section of that page.

To add a custom header image to your WordPress site, you will have to select the Add new image option, which will allow you to choose the corresponding image. Once you click on it, you can choose if you want to upload an image from your local machine or use an already uploaded image from your WordPress Media Library.

Once you select your image, the option to crop it as much as you like and then to save and publish it will appear.

Step 4: How To Delete Header Image

If you want to remove the current image header from your website, click on the Hide image button.

How to hide WordPress header image?
~How to hide WordPress header image?

Important

Note that further customization of the Header is usually done in the files of the particular theme which you are using. Due to this, you should check your theme's documentation if you want to switch the dimensions, borders, and colours of the header placeholder space.

When all of the changes are performed, and you are satisfied with the result, please use the Save Changes button at the bottom of the page so you can save the changes and finish the editing of your website's top position element.

Step 4: How To Add Videos To A WordPress Header

Adding a video as a header can be very beneficial for charity organizations, travel agencies, and real estate brokers, to name a few. Video materials draw the attention of visitors stronger than images.

Videos also win faster the trust of visitors that the footage shown is legitimate compared to images which are easier to manipulate.

Plus, video marketing, when done right, is a great way to send the right signals to search engines for better ranking.

In WordPress, there are two ways of adding videos on the top of your page:

Option 1: Add a Local Video in .mp4 format

The first is by uploading a video directly to your Media Library. Note that this method can only be used for files that are less than 8MB in size. Dimensions can also be restricted by the container size in your theme (in our case, this will be 2000x1200 pixels). If your video is within the limitations, access the header configuration options and click on the Select Video button.

Important

Even just an 8MB video in your header can increase your bandwidth generation significantly as it will be auto-played on every page visit. To avoid excessive bandwidth usage, check the next substep in which we cover how to embed a video from YouTube.
How to upload header video in WordPress
~How to upload header video in WordPress?

You will see a small box preview of the video and will be able to play/pause it as part of the review process.

Preview uploaded header video
~Preview uploaded header video

Important

It is a great idea to add an image even though you already have a video in your header. If for some reason the visitor's browser doesn't load the video or is slowed down in loading that element, the user will see an empty space if there is no fallback image already set.

Option 2: Adding a Video from YouTube

For higher resolution clips which will be above 8MB in size, you will need first to upload your video to YouTube. Then copy its link and paste it in the appropriate field in this section.

How to Add WordPress Header Video from YouTube
~How to Add WordPress Header Video from YouTube

The video should start playing immediately in your preview. The layout will also provide a dedicated pause button and even suggest similar videos via YouTube.



Summary: How to edit headers in WordPress theme?

Editing your WordPress header could be challenging if you have no idea where to start. With the above WordPress tutorial, we hope that you will now know how to edit the header of your WordPress website. With this, you can pin the attention of your website's visitors from the get-go.

Need help? Leave a comment below and tell us more about your challenges!

Article written by Editorial Team

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Related Posts

crossmenu