18 Plugins To Customize the Header And Footer Of Your Site

The header of your site is the first thing that your visitors see, so it’s important to create a good impression. An eye-catching header will encourage people to explore further.

Most website headers will include a combination of some of the following:

  • Site title, site description and/or logo
  • Navigation
  • Social media icons
  • Hero images
  • In some themes, a header widget area

Likewise, your website’s footer can be overlooked but can hold plenty of useful information. This is where you can put useful links and credibility boosters. Don’t ignore footer content: a “Copyright 2016” notice in your footer makes you look like you haven’t updated your site since then.

Footers may contain:

  • Widget areas (“Fat footers” have become popular in recent years)
  • Copyright information with the current year, or an older year to the current year
  • Credits e.g. “Proudly powered by WordPress”
  • Links e.g. privacy policy, terms and conditions, sitemap or custom menus.
  • Social media icons
  • Contact details
  • Email newsletter sign up forms
  • Website trust marks
  • A Back to Top link

Sometimes it’s better to use custom code to make a header or footer change. If you are adding a header widget area to a child theme, it needs to be compatible with your theme layout.

In other instances, it’s quicker and easier to use a plugin to make a header or footer modification. In fact, it’s surprising just how many header and footer enhancements plugin developers have thought of!

The difference between <head> and <header>

The header area is the top part of the page before the main content, after the <body> tag. It may be marked up as <div id=”header”> or with HTML5, the <header> tag.

The <head> element comes after the <html> tag and before the <body> tag. This holds information such as the page title, meta information, scripts and styles used on the page.

None of this information in <head> shows on the actual page as rendered, so strictly speaking it’s not part of the header. But a number of plugins tagged as “header” plugins actually target the <head> section.

What can plugins add or change in headers and footers?

  • Notification bars, including messages, social media icons and contact links
  • Navigation enhancements e.g. mega menus (link) and menu icons
  • Stickiness – fixing header elements to the top of the screen when you scroll
  • Custom headers (images)
  • Replacement text or HTML code
  • Email signup forms

Header and footer plugins

In compiling this list, I was looking for plugins which:

  • Would not require a specific theme or plugin to work.
  • Work out of the box i.e. didn’t require modifying theme template files.

For testing, I used BasePress theme.

BasePress theme showing header and footer

With minimal configuration, the header contains:

  • Site title
  • Site description
  • Navigation

The footer shows the copyright notice, year and a link to the theme developer.

Optionally, this theme can include up to 4 footer widgets.

Advertising

  • Ad Inserter 600 600x280 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 100,000+

    Do you wish to monetize your site with ads? Try Ad Inserter. It injects ads either before or after the header tag or in your site’s footer, and in many other locations as well.

    Ad Inserter Pro plugin allows more precise ad placement, plus many other features.

    Some of the following plugins also let you add advertising code or check out other plugins which place ads.

Countdown timer

  • YITH Topbar Countdown plugin 600 600x194 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 1,000+

    Creating a sense of urgency can be an effective marketing strategy, particularly in the ecommerce space, where stock may be scarce or a holiday imminent.

    YITH Topbar Countdown encourages buying or sign-ups by highlighting limited time sales or promotions, or the time until an event. You can customize the bar to match your brand colours and typeface.

    A top bar with a countdown to a saleA top bar with a countdown to a sale

    Tip: Enter the “Countdown to” date in mm/dd/yyyy format. If you use the date picker, the timer won’t count down properly.

Footer credits

  • Remove Footer Credit plugin 600 600x194 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 30,000+

    Tired of “Proudly powered by WordPress” or similar? Ditch credits completely with this plugin, or replace them with text or HTML of your choice.

    BasePress' original footer credit has been removed and replacedBasePress’ original footer credit has been removed and replaced

    It might take trial and error to find the right code to remove. For BasePress I needed to enter the footer credit and link, but not the surrounding

Header and footer code

  • Simple Header Footer HTML 600 600x194 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 4,000+

    This plugin does exactly what it says on the tin, allowing you to add HTML snippets to the header or footer, or scripts in the <head> or below the <footer>tag. Scripts could include analytics code or custom Javascript.

  • Head Footer and Post Injections 600 600x192 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 100,000+

    Very similar to the previous plugin but has more features:

    • Add code before, after and within posts
    • Add code before and after pages
    • Use PHP, JavaScript and shortcodes
  • Active installs: 20,000+

    Another plugin to add content to the header and footer, but with conditional logic, so the content can show only on the post type you specify, or on individual posts/pages.

    This is useful if you need a script on one page, but don’t want it loading on every page, which could potentially slow your site down.

  • Ultimate Branding 600 600x334 - 18 Plugins To Customize the Header And Footer Of Your Site

    WPMU DEV’s Ultimate Branding – free to members – uses a visual editor for adding global header and footer content.

    Ultimate Branding add to header 600 - 18 Plugins To Customize the Header And Footer Of Your SiteA centre aligned header logo added with Ultimate Branding

    Aside from altering the header and footer, Ultimate Branding has many more features, including the option to customize your admin dashboard layout and colour scheme, plus your site’s login page.

Header images

  • Unique Headers plugin 600 600x192 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 20,000+

    Well-chosen images can add extra visual appeal to your header area.

    Unique Headers shows different header images on different pages, depending on your configuration and theme support.

    Your theme must use WordPress custom headers to use this plugin. BasePress does have this feature; custom headers are shown on the home page and archive pages.

    You can adjust the header image on posts, pages, category and tag archives (BasePress only shows headers on the latter two).

    The custom header on a category archive page can be different from that on other pagesThe custom header on a category archive page can be different from that on other pages

    Unique Headers does not crop images to fit your theme, so make sure that you upload the correct image size to avoid stretching – 1600 x 640 px in my theme’s case. Check the header size of your theme in the Customizer.

Menu modification

  • Menu Icons by Themeisle 600 600x180 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 100,000+

    Menu icons can enhance usability if partnered with appropriate navigation labels.

    This plugin adds icon sets including Dashicons, Font Awesome and Genericons. SVG and custom images are also supported.

    Navigation with a mix of Genericons and Font Awesome iconsNavigation with a mix of Genericons and Font Awesome icons

    You might need to add some custom CSS to change the menu display. I needed this to stop my menu spilling over onto a second line.

  • Add Search To Menu 600 600x151 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 9,000+

    For larger, content-heavy sites especially, it’s useful to have a search facility in the header. Adding the search to the navigation makes sense, as the top right is where many users would expect to find it.

    This plugin appends a search icon or box to the menu of your choice. You can choose the style of search display and to show or hide it on mobile devices.

    Search in menu, dropdown styleSearch in menu, dropdown style
  • If Menu plugin 600 600x195 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 30,000+

    Sometimes you have navigation items you only want to show to certain users. If Menu shows menu items conditionally – for example, if the user has a particular role, is viewing a post, or is on a mobile device.

  • Max Mega Menu 600 600x194 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 200,000+

    Install Max Mega Menu to build a stylish mega menu, or simply use it to alter the style of your header navigation.

    For more on how to use this plugin, read How to Add a Stunning Mega Menu to Your WordPress Site.

Notification bars

  • Speed Contact Bar plugin 600 600x195 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 10,000+

    Best used in the header, Speed Contact Bar is ideal when you want visitors to get in touch fast – for example, if you run a service business.

    The bar stands out well, the phone number is configured to dial directly if you’re on a mobile, and it comes with many design options.

    Speed Contact Bar in the headerSpeed Contact Bar in the header
  • 8 Degree Notification Bar 600 600x195 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 4,000+

    Notification bars can alert visitors to offers, contact information, social media links and other points of interest. This bar can show in either the header or footer.

    Footer notification bar with social icons and messageFooter notification bar with social icons and message

    The premium upgrade ($17) permits multiple bars, conditional displays, tweets and more.

Ribbons and banners

  • Show Support Ribbon 600 600x195 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 400+

    Do you have a cause to highlight? This plugin adds a banner, ribbon or button to your header, which can link anywhere. It will show on the top right corner of the page by default but can be moved to any corner and styled to match your branding.

    Support Ribbon exampleSupport Ribbon example

Sticky headers

  • Sticky Menu on Scroll 600 600x194 - 18 Plugins To Customize the Header And Footer Of Your Site

    Active installs: 50,000+

    There is evidence that sticky navigation is preferable to users on sites with a specific call to action, long-form content and to young and old audiences.

    Not all themes support this feature, but Sticky Menu plugin is an easy solution to keep your header bar always on top when you scroll. Use your browser inspector to find the relevant section to stick.

    Sticky Header 600 - 18 Plugins To Customize the Header And Footer Of Your SiteSticky navigation (header#masthead) on BasePress

Summing up

As you’ve seen, the header and footer can be prime real estate on your website.

While you don’t want to overload them with content, well-chosen header and footer features can make it easier:

  • For visitors to contact you
  • To grow your email list
  • Monetize your site
  • Improve user experience
  • Brand your site more successfully

Powered by Start Fast Stay Fast Website Speed Optimization Theme by SiteNow

Get more stuff like this
in your inbox

Subscribe to our mailing list and get interesting stuff and updates to your email inbox.

Thank you for subscribing.

Something went wrong.

Leave a Reply

Get more stuff like this
in your inbox

Subscribe to our mailing list and get interesting stuff and updates to your email inbox.

Thank you for subscribing.

Something went wrong.