Home web designing wordpress Create A Custom Header Template For WordPress Page

Create A Custom Header Template For WordPress Page


Step by step guide to create custom page header without plugin

With using custom header template in your WordPress website pages ,you can give unique and different look to each page . In this step by step guide learn how to create custom header for specific page without using any plugin .

Method 1

  1. Open notepad in your computer .
  2. Create a blank file. Save this file as .php file and file name must be start from “header-PageName” . For example your want to create a custom header template for your about us page then file name must be “header-about-us.php” .
  3. Upload this file to current theme folder under wpcontent using ftp clicent such as FileZilla .

Method 2

Create .php file in theme folder


  1. Login to cPanel and go to wordpress installation root folder .
  2. Go to wpcontent folder . Open current theme folder . Create a new .php file with name “header-about-us.php” .

Edit this custom header file

After create new header file, go to your WordPress dashboard . Then go to Appearance and then Editor . You will see , new created “header-about-us.php” file is displayed in theme files list .


If file is not displayed in list ,it means something is wrong in file name . So write the file name carefully .Know this custom header template is ready to use .

Open your custom page template ,”page-about-us.php” in list . If you have not custom page template for your about-us page then you can create it .

custom header assigned to custom page


Add Header file name in get_header()

In this page template , go to top code of this file which is get_header() . get_header() is built in function in wordpress to call the header . header code is look like following .

<?php get_header() ; ?>

Insert your custom header file name in get_header() as parameter  with quotes.

<?php get_header('about-us') ; ?>

Click “Update” button to save file . Go back to your website and click on about us page . As you can see in the following image, .css file is not loading is the about us page .


Custom header template


This is because ,custom header template is loaded on webpage but header file is blank at this time . So write the custom code to this header-about-us.php file and update it .With this way you can create different custom header templates for different pages, posts and categories .