How To Add Custom Header Images To WordPress Posts And Pages

Learn how to add custom header images to your WordPress site, including adding custom header images to different posts and pages …

How To Add Custom Header Images To WordPress Posts And PagesAdding images to the header section of your website can help to improve your branding and create an attractive look and feel for your site visitors.

Most free and premium WordPress themes provide built-in support for adding header images to your website or blog.

Let’s say that your website focuses on pet products. Wouldn’t it be great if you could display headers with dog images on pages about dog products, headers with cat images for cat product pages, bird image headers for bird product pages, etc?

What about rotating different header images throughout your site’s posts and pages? Like images with different travel destinations for a travel-related website, or different vehicle images for an auto-related blog, etc?

With WordPress you can!

In this tutorial, you are going to learn how to add custom header images to your WordPress site or blog without touching code.

How To Add Custom Header Images To WordPress Posts And Pages

Most WordPress themes support custom header images. This allows users to set up a website and add an image or logo that reflects their business, products, or services throughout the header section of their website …

Most WordPress themes support custom header images

(Most WordPress themes support custom header images)

Most sites, however, display the same header image on all pages (e.g. a banner with their logo) …

Most websites display the same header image on all pages

(Most websites display the same header image on all pages)

What if you want to display different header images throughout your website or blog?

Better still … what if you want to display a specific header image on certain posts or pages, or display a header image for all posts that share the same categories or tags?

Well, with WordPress, you can!

Let’s look at different methods to add custom header images to WordPress that don’t require touching code.

Add Custom Header Images To WordPress Using The Theme Customizer

The WordPress Theme Customizer lets you easily add header images to your WordPress site …

The Header Image section lets you add multiple header images to your WordPress site and select one of these as the current header image …

Make a header image the current header for your site

(Make a header image the current header for your site)

You can also add multiple header images to your site and rotate these randomly throughout your site …

Rotate images randomly in your theme header

(Randomize uploaded header images)

To learn more about using the WordPress Theme Customizer, go here:

Add Different Custom Header Images To WordPress Posts And Pages

The previous method allows you to either display a specific custom header image or rotate multiple header images to your entire website but not to specific posts or pages.

To add different custom header images to specific WordPress posts or pages, you will need to install the plugin below.

WP Display Header

WP Display Header

(WP Display Header)

WP Display Header is a free WordPress plugin that lets you specify a header image for posts, pages, custom post types or archive pages individually, from your default headers and custom headers.

Installing The Plugin

To install the plugin from your WordPress dashboard, go to Plugins > Add Plugins and type in “display header” into the Keyword search field (if you need help see our tutorial on installing WordPress plugins).

Locate the plugin and click on ‘Install Now’ …

Install the plugin

(Install the plugin)

After installing the plugin, click the ‘Activate’ button …

Activate the plugin

(Activate the plugin)

Using The Plugin

To add custom header images to your posts or pages using the plugin, upload images to your WordPress Media Gallery and then add these to the Header Image section of your theme via the Theme Customizer

Upload custom header images to your site via the Theme Customizer

(Upload custom header images to your site via the Theme Customizer)

Once images have been uploaded to your site, you can then add these to individual posts and pages.

Useful Tip

Don’t confuse Header images with Featured images.

By default, WordPress lets you easily add featured images to individual posts and pages, but to add different header images to specific posts or pages requires customizing your theme or adding a plugin like the one shown in this tutorial …

Header image vs Featured image

(Header image vs Featured image)

To learn more about using Featured images in WordPress, see this tutorial:

Add Custom Header Images To Posts And Pages

After installing and activating the plugin, when you create or edit a post or page you will see a Header meta box in your page and post edit screens below the content area …

Header meta box

(Header meta box)

Useful Tip

If you can’t see the ‘Header’ section displayed below you content area, click on the Screen Options tab and make sure that Header checkbox is ticked …

Screen Options - Header enabled

(Screen Options – Header enabled)

This section gives you the option of showing random images, no header image, or selecting a specific image to display on your post or page.

For this example, select an image and republish your post …

Select a specific image for your post or page

(Select a specific image for your post or page)

Visit your post (or page) and you should see the custom header image that you have selected displayed in your theme’s header …

Custom header image added to individual post

(Custom header image added to individual post)

You can add different header images to posts or pages individually …

Add different header images to different posts

(Add different header images to different posts)

But you can also add header images to posts grouped by categories or tags.

Add Custom Header Images To Post Categories

To add custom header images to post categories, go to Posts > Categories > Edit Categories, select an image from the ‘Header’ section added by the plugin, then save to update your settings …

Add custom header images to post categories

(Add custom header images to post categories)

You custom header images will now display in your site’s category archive pages …

Custom header image added to category archive pages

(Custom header image added to category archive pages)

If you need help with WordPress categories, see this tutorial:

Add Custom Header Images To Post Tags

To add custom header images to post tags, go to Posts > Tags > Edit Tags, select an image from the ‘Header’ section, then save to update your settings …

Add custom header images to post tags

(Add custom header images to post tags)

You custom header images will now display in your site’s tag archive pages …

Custom header image added to tag archive pages

(Custom header image added to tag archive pages)

If you need help with WordPress tags, see this tutorial:

Congratulations! Now you know how to add custom header images to individual posts and pages on your WordPress site.

How To Add Custom Header Images To WordPress Posts And Pages

Images sourced from Pixabay.com.

***

"This is an awesome training series. I have a pretty good understanding of WordPress already, but this is helping me to move somewhere from intermediate to advanced user!" - Kim Lednum

Disclaimer: WordPress and its related trademarks are registered trademarks of Automattic, Inc. This site is not affiliated with nor sponsored by Automattic, Inc. or the WordPress Open Source project. This site and the products and services offered on this site are not associated, affiliated, sponsored, or endorsed by WordPress, nor have they been certified, tested, or reviewed by WordPress. The owner, contributors and/or advertisers may derive financial benefit from sales of items reviewed, linked to, or advertised on this site.

***

Have you found this tutorial useful? Feel free to use the social links below to share this information with other online users.

How To Add A Custom Gravatar To WordPress

Learn how to add a custom gravatar to WordPress without touching code in this step-by-step tutorial …

Get Thrive Leads for WordPress

How To Add A Custom Gravatar To WordPressAs we explain in this tutorial, WordPress uses a special kind of avatar called a Gravatar to display user profile photos.

To learn how to set up a Gravatar, see the step-by-step tutorial below:

How To Add A Custom Gravatar To WordPress

Take a look at WordPress sites and blogs where users frequently post comments or engage in online discussions and you will most likely see user profile images displayed next to their comments.

These are user avatars or Gravatars …

A Gravatar is a special kind of avatar used in WordPress

(A Gravatar is a special kind of avatar used in WordPress)

Your Gravatar is associated with your email address and follows you around the web, displaying your profile image whenever you post comments online or interact with other WordPress users.

If a user doesn’t have a gravatar, WordPress will display a default image, called  a ‘Mystery Person’ …

Mystery Person

(Mystery Person)

Since many users don’t have an image associated with their email address, your site can end up displaying lots of ‘Mystery Person’ images.

If you allow users to post comments on your site and you don’t want a ‘Mystery Person’ to display next to commenters without gravatars of their own, you can set up a custom default gravatar to display on your site. This can be any image you like, even a branded logo.

In this tutorial, you are going to learn how to add a custom default gravatar to WordPress without touching code.

Why Add A Custom Gravatar To WordPress?

There are two reasons for adding a custom gravatar to WordPress:

  1. To change your own default user gravatar.
  2. To change the default gravatar of other users.

Why Change Your Own Default User Gravatar?

As explained in this tutorial, Gravatar is a free web service that allows users to create a profile and associate avatar images to their email addresses.

Once you set up your Gravatar, the image you have associated with your email address will display everywhere your email address is used. While it’s great to keep the same profile image consistent when interacting with other sites, you may not want to use your gravatar image on your site.

For example, you may want to use  your professional gravatar when posting comments on websites related to your work or industry …

Professional Gravatar

(Professional Gravatar)

But you may also have created a fun or special character avatar or a mascot image that you would like to associate with your profile when posting on your own site …

Fun Gravatar

(Fun Gravatar)

Why Change The Default Gravatar Of Other Users?

As explained earlier, the main reason for changing the default gravatar of other users on your site is to replace the ‘Mystery Man’ default image …

Mystery Man gravatar ... Boooo!

(Mystery Man gravatar … Boooo!)

But you may also have created a fun or special character avatar or a mascot image that you would like to associate with your profile when posting on your own site …

Custom user gravatar ... Yaaay!

(Custom user gravatar … Yaaay!)

Add A Custom Gravatar To WordPress Using Plugins

The easiest way to add or change custom gravatars in WordPress without touching code is using plugins. There are a number of plugins you can use to customize WordPress using avatars.

For this tutorial, let’s look at how to change your default gravatar and set a different default gravatar for other users on your site using a couple of gravatar plugins.

Podamibe Custom User Gravatar

Podamibe Custom User Gravatar

(Podamibe Custom User Gravatar)

Podamibe Custom User Gravatar is a free WordPress plugin that allows users to upload their own gravatar in the media gallery and displays that image as a gravatar instead of looking for an avatar from gravatar.com based on their registered email.

To install the plugin from your WordPress dashboard, go to Plugins > Add Plugins and search for “gravatar” in the Keyword field.

Locate the plugin and click ‘Install Now’ …

Install the plugin

(Install the plugin)

After the plugin has installed, click on ‘Activate’ …

Activate the plugin

(Activate the plugin)

After installing and activating the plugin, go to your User Profile and scroll down to the Custom Gravatar section. Check ‘Use Custom Gravatar’ and click the ‘Select Picture’ button …

User Profile - Custom Gravatar

(User Profile – Custom Gravatar)

Upload and/or select an image from the WordPress Media Library to use as your custom gravatar, then click on ‘Update Profile’ to update your settings and set your image as your new default gravatar  …

Use Custom Gravatar

(Use Custom Gravatar)

Your new custom Gravatar image will display throughout your site, replacing the previous default gravatar …

(Your custom Gravatar image)

You can return to the default gravatar simply by disabling the Custom Gravatar feature in your User Profile or deactivating the plugin …

Back to 'Mystery Man'

(Back to ‘Mystery Man’)

To learn more about this plugin, go here: Podamibe Custom User Gravatar

WP User Avatar

WP User Avatar

(WP User Avatar)

WP User Avatar is a free WordPress plugin that lets you use any image or picture from your WordPress Media Library as a custom user avatar, including adding your own default avatar.

To install the plugin from your WordPress dashboard, go to Plugins > Add Plugins and search for “gravatar” in the Keyword field.

Locate the plugin and click ‘Install Now’ …

Install the plugin

(Install the plugin)

After the plugin has installed, click on ‘Activate’ …

Activate the plugin

(Activate the plugin)

The plugin adds a new ‘Avatars’ menu to your main WordPress menu. Go to Avatars > Settings to add a new default avatar …

Avatars > Settings menu

(Avatars > Settings menu)

This brings you to the ‘WP User Avatar’ settings screen, which effectively mirrors the Avatar section of the WordPress Discussion settings area, allowing you to configure the plugin settings, select whether or not to display avatars, set the content rating, and change the default avatar for users without a custom avatar of their own …

WP User Avatar settings screen

(WP User Avatar settings screen)

Scroll down to the ‘Default Avatar’ section, select the WP User Avatar radio button and click on the ‘Choose Image’ button …

Default Avatar - WP User Avatar

(Default Avatar – WP User Avatar)

Upload and/or select an image from the WordPress Media Library to use as your custom gravatar and click ‘Save Changes’ to update your settings …

Set a new default WordPress avatar

(Set a new default WordPress avatar)

The new custom avatar image will replace the default avatar on your site …

Custom avatar image

(Custom avatar image)

The new custom avatar image will also replace the default image for all users on your site without a Gravatar of their own …

New default user gravatar

(New default user gravatar)

The plugin also adds a library of Avatars to your admin area …

Avatars - Library menu

(Avatars – Library menu)

This lets admin users view and manage all custom avatars uploaded by users on your site …

Avatars library

(Avatars library)

WP User Avatar – Additional Features

If you allow the plugin to add a menu button to your Visual Editor in the plugin ‘settings’ section, users can insert their custom gravatar into their content using the menu button or a shortcode …

Insert a custom gravatar into your content

(Insert a custom gravatar into your content)

Clicking on the menu button brings up a dialog box where users can edit and insert their custom avatar into their content …

Insert a custom avatar into your content

(Insert a custom avatar into your content)

This places a shortcode into the content …

Custom gravatar shortcode

(Custom gravatar shortcode)

The custom gravatar will display in the content in the specified location after the post or page has been published …

Custom Gravatar

(Custom Gravatar)

Clicking on the menu button also gives you the option of adding a standalone uploader to a front page or widget which is only visible to logged-in users …

Add a standalone uploader to a page or widget

(Add a standalone uploader to a page or widget)

This lets logged-in users directly upload their own custom avatar and update their profiles …

Logged-in users can upload their own custom Gravatar

(Logged-in users can upload their own custom Gravatar)

This feature can be useful if you plan to run a membership site or user forum

User profile avatar updated

(User profile avatar updated)

There is also a WP User Avatar PRO version of the plugin that adds more customizable features for adding, editing, managing, and storing custom avatars.

Watch the video below to see a demo of the Pro version of the plugin:

(WP User Avatar PRO)

Learn more about …

We hope you have found this tutorial on how to add a custom gravatar to WordPress useful.

How To Add A Custom Gravatar To WordPress

Angry eggs image: Pixabay

***

"I have used the tutorials to teach all of my clients and it has probably never been so easy for everyone to learn WordPress ... Now I don't need to buy all these very expensive video courses that often don't deliver what they promise." - Stefan Wendt, Internet Marketing Success Group

Disclaimer: WordPress and its related trademarks are registered trademarks of Automattic, Inc. This site is not affiliated with nor sponsored by Automattic, Inc. or the WordPress Open Source project. This site and the products and services offered on this site are not associated, affiliated, endorsed, or sponsored by WordPress, nor have they been tested, reviewed, or certified by WordPress. The owner, contributors and/or advertisers may derive financial benefit from sales of items reviewed, linked to, or advertised on this site.

***

Did you enjoy this tutorial? If so, please consider using the share buttons below and share this information with other bloggers.

WordPress Custom Post Types Explained

Learn what custom post types are and how they are used in WordPress in this tutorial …

WordPress Custom Post Types Explained

WordPress Custom Post Types ExplainedWordPress is a true Content Management System (CMS) in the sense that it not only allows you to manage content but to manage and display different types of content.

Let’s call the most basic unit of content that WordPress stores in its database a post.

Default Post Types

WordPress can hold and display a number of default post types.

The default post types most WordPress users are familiar with, are posts and pages

Common WordPress default post types

(Common WordPress default post types)

WordPress, however, has additional default post types it uses to store and manage the types of content it needs to perform a number of built-in functions …

WordPress default post types
Click to enlarge image.

(WordPress default post types)

WordPress default post types include:

  • Post – This is the post type typically used in blogs, web articles and RSS feeds. Regular posts normally displayed in reverse chronological order (i.e. newest posts first).
  • Page – A page is like a post, but it lives outside the normal time-based listings of posts. Pages can use different page templates and be organized in a hierarchical structure (i.e. parent pages with nested pages). Pages normally  cannot be assigned categories and tags. If permalinks are enabled, page permalinks comprise the main site URL and the slug of the page and/or parent pages. See WordPress Posts vs WordPress Pages for more information about the differences.
  • Attachment – An attachment is a special post that holds information about a file uploaded through the WordPress media upload system, such as its description and name, image size, post thumbnails, image alt text, etc.
  • Revision – Revision posts store draft posts and past revisions of a published post.
  • Navigation Menu – Navigation Menu is a type of post that holds information about a single item in the WordPress navigation menu system.
  • Custom CSS – Custom CSS is a theme specific post used to store CSS saved from the “Additional CSS” screen of the WordPress Theme Customizer.
  • Changesets – Changesets is a post type similar to auto-saves but specifically for the Theme Customizer. If you’re making changes to your theme through the Customizer and something happens, this post type can help you restore your unsaved changes.

You can learn more about WordPress default post types in the official WordPress Codex.

Custom Post Types

In addition to the default post types shown above, WordPress also lets you (i.e. developers) create new post types for specific purposes …

WordPress lets you create custom post types
Click to enlarge image.

(WordPress lets you create custom post types)

Some examples of custom post types include:

  • Products
  • Testimonials
  • Porfolios
  • Recipes
  • Listings
WordPress custom post types
Click to enlarge image.

(WordPress custom post types)

Custom post types are normally added to WordPress when you install plugins or themes designed to help you perform specific purposes.

For example, if you run an e-Commerce website, you can add new products to your site through a ‘product’ post. This is a custom post type specifically designed to store and display information about products (e.g. product name, product description, product image, pricing, availability, etc.)

Custom post type: Product

(Custom post type: Product)

Additional custom post types include testimonials

Custom post type: Testimonial

(Custom post type: Testimonial)

Portfolio items

Custom post type: Portfolio

(Custom post type: Portfolio)

Recipes

Custom post type: Recipe

(Custom post type: Recipe)

Directory listings

Custom post type: Listing

(Custom post type: Listing)

And more!

With WordPress, there is no limit to the types of content you can create, store and display on your website. If you can’t find a plugin or theme that will give the type of content you need, you can always ask a web developer to code or customize a custom post type for your website.

We hope you have found the above information useful. Hopefully, now you have a better understanding of what custom post types are and how they are used in WordPress.

WordPress Custom Post Types Explained

***

"If you're new to WordPress, this can stand on its own as a training course and will stay with you as you progress from beginner to advanced and even guru status." - Bruce (Columbus, Ohio)

Disclaimer: This site is not directly associated with WordPress or any WordPress products mentioned or reviewed on this website. We may derive an affiliate commission of financial benefit from purchases of third-party services or products advertised on our site. All images and descriptions sourced from product websites remain the copyright of their respective owners and have been used solely for illustrative or training purposes.

***

Did you enjoy this tutorial? Feel free to share this information with other WordPress users using the links below.