WP Design Tips: How to Crop a Photo for Your Custom Header – Free Photoshop Template

You are creating your WordPress site custom header and you have a photo you would like to use. Your goal is to create a great visual with your photo that conveys as much information as possible about your business in that narrow header space.

That is great, but how do you get there? John McWade, Creative Director of Before and After Magazine, has created a great video that explains how to get results cropping photos for narrow areas like your header.

2016 Update: The video, Extreme Photo Cropping, has been moved to Lynda.com. You will find it in the Before & After: Graphic Design Techniques course.

John offers the following tip:

When you’re designing a web banner, it might help to think of it not as a sign board with discrete edges, that you have to paint within. But rather as a window to a larger world.And visualize yourself looking through blinds to that world. Crop that way, place it in your banner, add your name, and you have a great result pretty easily.

Look how much visual information is being conveyed in this slice. You have…the colors, the textures, the general ambiance of the whole photo. You can get pretty extreme with this. Key is always to pick out the most expressive sliver of an image. This could be a fun exercise.

Try the technique with the Free Photoshop Template I have created. (A png image is also included for non Photoshop users.) The template is designed for use with the Twenty Ten theme but could be easily modified for any theme.

Download the FREE TEMPLATE

Follow the instructions from my How to Personalizing Your WordPress Site post to replace the default header image with your new custom header.