Do you want to change the header image of your WordPress website?

The header image plays an important key role in grabbing a user’s attention. It helps to establish a connection with the website’s visitors. 

Do you know, users spend an average of 5.94 seconds looking at a website’s main image?

Changing the header image of your WordPress website depends upon the theme you have chosen. Below, we have listed 3 ways to change the header image of your WordPress website. Hopefully, these ways will cover all the seniors. 

In this post, you will learn about:

  • How to choose the right image for the header section
  • How to change the header image using the customizer
  • How to change the header image using the site editor
  • How to change the header image using the featured image

Let’s get started!

How to choose the right image for the header section

Choosing an appropriate header image is often ignored in the process of website building. Designers use placeholder images for time being and while making the website live they forget to update it. 

The header section on the homepage of your WordPress leaves the first impression on your visitor’s mind. Keep in mind, you can’t get a second chance to make a first impression. Your header image should be enough to convince visitors to stay on your website. 

Key design aspects to keep in mind when choosing the right header image for your website are:

  • The image type should be .jpeg, .gif, .svg,  or .png file
  • Your image dimensions should have 16:9 ratio like 1920 × 1080
  • Ideally, the header image should be landscape
  • The text on the image should be readable. Choose the color combination wisely
  • Header image should look great on the desktop.
  • Keeping logos, text, and the focal points of images in the sweet spot area. 
Pro tip:

Your theme always has a recommendation for the best image dimensions to use. Redirect to Appearance > Themes > Info. Next, scroll down to the Quick Specs and look for a recommended header image size, if any.

Slack.com

Slack.com

How to change the header image using the Customizer

Customizer is a core part of WordPress. You can edit or customize your website design, including a header section with live previews. It is the easiest way to customize your WordPress theme. 

If your website has Customizer, follow the following steps:

Step 1: Log in to your WordPress dashboard

Step 2: Redirect to Appearance > Customize

Appearance > Customize WordPress Header Image

Step 3: On the left sidebar of the customizer, find the Header Tab and click on it. 

Step 3: On the left sidebar of the customizer, find the Header Tab and click on it.  WordPress Header Image

Step 4: Click on the Site Identity. Site Identity lets you edit your site’s identity on your header.

Step 4: Click on the Site Identity. Site Identity lets you edit your site’s identity on your header. WordPress Header Image

Step 5: Click the “Add new” image. 

You will have two options here:

  • Media Library: You can choose from existing images on your site
  • Upload files: You have to upload an image from your computer

Step 6: Upload the header image from your computer and click on the Select 

Step 6: Upload the header image from your computer and click on the Select 

After you’ve uploaded the image that fits, click on the Publish button on the top of the WordPress Customizer to make it go live.

Publish

That’s all!

How to change the header image using the site editor

The site editor of your WordPress website allows you to design the entire site including the header, footer, and everything in between, with blocks. You can get great control over how your site looks. 

If you know HTML and CSS, then you can customize your WordPress header from your dashboard. 

Follow the following steps to change the header image using the Site Editor:

Step 1: Log in to your WordPress dashboard

Step 2: Redirect to Appearance > Theme File Editor 

Step 2: Redirect to Appearance > Theme File Editor  WordPress Header Image

Step 3: Click on the area where you want to place a header image. Probably, it will be above your site’s title and menu.

Step 4: Click the + Block Inserter icon to add a new block

Step 5: Search for the Cover block and click to add it.

Next,

Step 6: Click Upload to upload the image from your computer 

You will have two options here:

  • Media Library: You can choose from existing images on your site
  • Upload files: You have to upload an image from your computer

Step 7: Upload the header image from your computer and click on the Select 

Step 6: Upload the header image from your computer and click on the Select 

Once you are done, click on the Update File button at the end of the page. This will save your edited code. 

Publish
Pro tip:

It is exclusively for developers ONLY. Please don’t open ‘Theme Editor’ if you’re not a WordPress developer.

Featured images are tucked away in the sidebar of the WordPress blog post editor, yet are a key option.

To set a featured image on the page, follow these steps:

Step 1: Log in to your WordPress dashboard

Step 2: Redirect to Pages > Homepage

Step 2: Redirect to Pages > Homepage

Next,

Step 3: In the settings on the right, locate the Featured Image section.

Step 3: In the settings on the right, locate the Featured Image section. WordPress Header Image

Step 4: Click Set Featured Image 

You will have two options here:

  • Media Library: You can choose from existing images on your site
  • Upload files: You have to upload an image from your computer

Step 5: Upload the header image from your computer and click on the Select 

Step 6: Upload the header image from your computer and click on the Select 

Step 6: Click Update on your page to save your changes. Your featured image is now set as the header image of your homepage on your website. 

Step 6: Click Update on your page to save your changes. Your featured image is now set as the header image of your homepage on your website. 

That’s all!

Conclusion 

Wrapping up, Images play a crucial role in your web design. Eye catchy header image helps you to stand out among your competitors. 

Before changing the header image make sure that the image has the right type, looks real, has easy-to-digest visuals, the ability to Switch things up, and includes your brand colors. 

If the image meets all the requirements then the image is ready to upload on the website. 

According to your theme, choose the method, follow the above-mentioned steps, and change the header image of your WordPress website. 

Feel free to comment us below if this post is helpful for you or if you need any help. 

Source: https://wpsupportdesk.com/blog/wordpress-header-image/



You might also like this video

Leave a Reply