If you’re currently using one of the stunning premium WordPress themes by StudioPress and wondering how to replace the default header logo with your own design, then read on.
I love the StudioPress themes and I’m currently using the Freelance theme for this blog. I’m quite happy to stick with this design for a while until I’m able to afford a fully customised design from StudioPress later on when my blog becomes a lot more popular, being optimistic so to speak.
Ok if you have a few concerns over the customisation of the header and are not sure how to do this, here are some suggested tips and methods in which you can use to achieve this without a great deal of difficulty.
Option 1
Some of the Child themes already a have a section in which you can upload a custom header quite easily. Simply go to Theme Settings page under Genesis and in the General Settings box you will find a drop down menu titled ‘Use for Blog/Title Logo’ select Image Logo
Now on the same page go to the Header Image Settings box and enter the header image height in pixels, e.g. 200.
Once complete go to Appearance and open the Header page to upload your own custom header. The default width will already be determined so all you need to do is upload a header that is whatever the default width is, and the height that you selected in the Theme Settings page, e.g. 965 x 200.
Option 2
If your theme doesn’t have a custom header section, then use this alternative method. Download the StudioPress plugin Simple Hooks and upload the plugin to the root directory of your blog. The easiest way is to also upload the plugin would be from the plugins page in your WordPress dashboard. Go to Add New and search for ‘Simple Hooks’.
Once uploaded and activated, go to the Simple Hooks page under Genesis and find the box titled Genesis_Header Hook This hook outputs the default header (the #header div)
In this box paste in your custom header code, if you’re not too sure how to create a code then follow these simple steps to create one:
1. Upload the header to your media library via your WordPress dashboard.
2. Locate and copy the image file URL and past it into the following code below, paste it to replace the red text. In line description: <a href=“http://www.yourblog.com”> replace the red text with your own blog’s URL.
Custom Header Code Suggestion
<div align= center>
<a href=”http://www.yourblog.com“>
<img src=” http://www.yourblog.com/wp-content/uploads/2010/12/your-header-logo.jpg” alt”My Blog Title”>
</div>
3. Paste this code into the box titled above.
Once you have pasted your code ensure that you have ticked the box titled: Unhook genesis_do_header()
function from this hook? You may also want to tick the boxes: Execute shortcodes on this hook and; Execute PHP on this hook, this is optional.
Click Save Changes and you’re done.
Enjoy.
Recommended Tutorials
1. How to Install Genesis Theme Framework & Church Child Theme into WordPress
2. Adding a Customized Footer in Genesis Child Theme using Simple Hooks!
- Share this:
[...] How to Add a Custom Header to StudioPress Premium WordPress Theme [...]