Loading...
WordpressWordpress Setup

Thesis WordPress Tutorial – How to Add Banner Beside the Header

Thesis Wordpress Tutorial – This tutorial is mainly for me because I know I will forget how to do this again in the future.  Since I upgraded my Thesis Openhook plugin, all the hooks I stored in the plugin in the past are now gone.  I’ve been trying to add code in the hook thesis_hook_header to add a Banner beside the Header in the Thesis Openhook plugin today for hours.  Finally I got it to work, but by adding code directly into the custom_functions.php.  The code is below:

// custom header to add Banner
// Code added by Elaine CmsMind.com – April 12, 2012
function custom_header() { ?>
<div style=’float:right’><a href=”http://www.cmsmind.com” target=”_blank”><img src=”your-banner-file.jpg”></a></div>
<p id=”logo”><a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a></p>
<h1 id=”tagline”><?php bloginfo(‘description’); ?></h1>

<?php
}
remove_action(‘thesis_hook_header’, ‘thesis_default_header’);
add_action(‘thesis_hook_header’, ‘custom_header’);

Steps to Add the Banner Beside the Header

1.  Go into Wordpress Admin

  • Login to your WordPress Administrator
  • Click on ‘Thesis’, ‘Thesis Custom Editor

Wordpress Thesis - Edit Custom_Functions.php

2.  Edit the Custom_Functions.php

It is wise to take a back up of the custom_functions.php file before editing it.  If you make any mistake in your custom_functions.php file, your whole thesis website will be down and not accessible.  You can make a backup of it using your FTP Manager.

  • In the Thesis Custom File Editor
  • Click on the drop down “Currently editing: custom/custom_functions.php”, set to
    • custom_functions.php
  • Click on ‘Edit selected file

3.  Add Code to Place Banner Beside Header

  • Add the code above
  • Click on  ‘Save’
Thesis WordPress Theme - Add Banner to Header - thesis_hook_header
Thesis Wordpress Theme - Add Banner to Header - thesis_hook_header

Now you can refresh your website and see the banner you added beside the header.  If you need further customization, please refer to the DIYthemes guide.

Thanks,

Elaine

Leave a Reply

Your email address will not be published. Required fields are marked *

Captcha Captcha Reload