Facebook is Out… Twitter is In!

I just canceled my Facebook account. I’ve been finding that I Twitter really works better for connecting with people that share similar interests and issues. I’ve also found that I had to spend an awful amount of time on Facebook to make it work, which kept me off it most of the time. Twitter on the other hand is super simple and desktop tools like Seesmic make it super easy to keep track of the Tweeps I follow regularly.

For all my family, friends, readers, co-workers, and contacts staying in touch with me is really easy… just Google my name and you’ll find at least one of my dozen blogs, all of which have contact forms on them. You can also follow me on Twitter of course and get the play by play crazy world of Michael Janzen’s brain… now back to designing my nine square foot tiny house.

How to use a custom image in the header of Basic Simplicity

I got an email from a fellow named Matt who is using Basic Simplicity, my WordPress Theme. He asked how he could use his own custom image in the header. The only caveat is that any edits made to any theme will need to be duplicated when you upload an update to the theme; so be sure to keep some notes for yourself when making changes to files. Actually that’s why I built the admin control screen for Basic Simplicity… I wanted to store the most commonly customized items in the database instead of the php files. This will make future theme updates more seemless. Here’s his question and my response.

Hi Michael

Great theme.
I would like to change the header to my own custom design. How do i do this and can it be done so the image/header is a link to my site url?

I’m no coder so i hope you will go easy on me. I did look around however can’t find the answer before emailing you?

Thanks for all your help.

Matt

The admin control panel lets you swap images. Normally you’d just upload a new image to the images folder via FTP and then enter that file name into the field on the admin screen. File names should not have spaces or special characters ideally. Best to name them things like my-custom-header.jpg. The trouble is… this will make it a background image which is not click-able.

Here’s one way to make a click-able header you’ll need to edit the header.php file (appearance > editor).

Find this <div id=”header”> (you’ll see some code here) </div>

Replace the code between the <div id=”header”> and </div> with your image. Here’s some html that should work:

<a href=”<?php echo get_settings(‘home’); ?>”><img src=”<?php echo bloginfo(‘template_url’); ?>/images/my-custom-header.jpg” width=”980″ height=”120″ border=”0″ alt=”<?php bloginfo(‘name’); ?>” /></a>

Then go to the admin control panel for basic simplicity and enter the following in the custom css field at the bottom:

#header { padding: 0; }

The width of the image should be 980 pixels, the height can be whatever you want.