How to Design a WordPress Header

1. Create a mock-up of your design. You can use a graphics application such as Photoshop or PaintShop Pro to fully visualize what you want your header to look like.
2. Open Notepad or your preferred text editor and type in the basic framework of your header. For example, a basic framework for a header that includes the site name, description and site navigation should look like this:


'>








' title='
'>Home




Save this code in a file named 'header.php'.

3. Add your header styles in the 'styles.css' file of your WordPress theme. This can be found within your theme's folder. Add a background color, define fonts and set layouts for each section. For example, a header with a background image and fonts written in Courier will have the following CSS code:#header {background: URL('/images/headerimage.jpg') no-repeat bottom center;font-family: Courier, serif;font-weight: bold;}
4. Attach the style sheet to your 'header.php' file by using the following code:
' />Save and upload the 'header.php' file to your WordPress theme folder.