ThemeShaper Forums » Thematic

[closed]

Adding logo and removing blog title/description

(2 posts)
  • Started 2 years ago by rwheeler
  • Latest reply from wlanni
  • This topic is not resolved
  1. rwheeler
    Member

    So I am complete newbie here and am starting to lose the hair I have left. :-)

    I have experience creating basic XHTML/CSS websites but want to offer clients the ability to have a WordPress site to provide a CMS. I have started with Thematic as the theme and created a child theme from that. My question is and will probably be very simple to most people in here, how do I remove the blog title and description from my header and add my logo left aligned and centered vertically in the header area? Once I get that I can hopefully figure out how to then move the navigation bar to the right and add some social media links and search box in the upper right corner of the header.

    Any help or a push in the right direction would be greatly appreciated.

    Posted 2 years ago #
  2. wlanni
    Member

    Hello rwheeler!

    I know this has been answered, but maybe we haven't tagged the previous post well to have it show up in search.

    here's what you do:

    1. Copy the thematicsamplechildtheme directory and contents out of the thematic theme and into your wp-content/themes directory. Rename the directory, open the styles.css and rename the style. Then in your wp-admin set your new child theme to be the active theme.
    2. open your functions.php file in your new child theme.
    3. You'll want to remove the existing site title and tagline. In the blank space before the closing ?> php mark, add the following code:
      //remove WordPress site title, blog description
      function unhook_thematic_functions() {
          remove_action('thematic_header','thematic_blogtitle',3);
          remove_action('thematic_header','thematic_blogdescription',5);
      }
      add_action('init','unhook_thematic_functions');
    4. Next, you'll want to add in custom code to place your logo in the header area:
      //Add in custom branding
      function childtheme_logo() { ?>
      <div id='branding-logo'>
          	<a href="<?php bloginfo('url') ?>/" title="<?php bloginfo('name') ?> &raquo; <?php bloginfo('description') ?>">
          		<img id="logo" src="<?php echo bloginfo('stylesheet_directory') ?>/images/IMAGENAME.png" alt="<?php bloginfo('name') ?>: <?php bloginfo('description') ?>" />
          	</a>
      </div>
      <?php }
      add_action('thematic_header','childtheme_logo',2);
    5. OK. That's all fine and dandy, but what about adding social media and search into the header? I think the easiest way for you to deal with this is to add a custom widget area into your header, and then install a social media plugin, and use the search widget. Here's how to add a widget into the header:
      // This will create header widget area
      function my_widgets_init() {
          register_sidebar(array(
             	'name' => 'Header Aside',
             	'id' => 'header-aside',
             	'before_widget' => '<li id="%1$s" class="widgetcontainer %2$s">',
             	'after_widget' => "",
      		'before_title' => "<h3 class=\"widgettitle\">",
      		'after_title' => "</h3>\n",
          ));
      
      }
      add_action( 'init', 'my_widgets_init' );
      
      // adding the widget area to your child theme
      function my_header_widgets() {
      	if ( function_exists('dynamic_sidebar') && is_sidebar_active('header-aside') ) {
      	    echo '<div id="header-aside" class="aside">'. "\n" . '<ul class="xoxo">' . "\n";
      	    dynamic_sidebar('header-aside');
      	    echo '' . "\n" . '</div><!-- #header-aside .aside -->'. "\n";
      	}
      }
      add_action('thematic_header', 'my_header_widgets', 7);

    Hope that helps. I used the above to make http://www.revebeds.com work, and used Brian Freytag's Social Media Widget to get the social media buttons across the top.

    Posted 2 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.