ThemeShaper Forums

Help In Shaping WordPress Themes

Register or log in:

Username:
Password:

Remember me

ThemeShaper Forums » Thematic

1. 

   eastjane
   Member

   Hi

   I would like to move the search box to the top right corner of my site. I don't have a live site just yet so I am copying my code below. I tried the methods talked about in this post:http://themeshaper.com/forums/topic/widgets-in-the-header, but was not successful.

   I am using the Child theme development format.

   My style.css looks something like this. (after all the import statements on top)

   /*Have a clickable logo on the left most site */
   #blog-title a {
   display:block;
   text-indent:-4000px;
   width: 317px;
   height: 200px;
   }
   #wrapper {
   background:url('images/logo.jpg') no-repeat top left;
   background-position: 5% 0%;
   }
   
   #branding {
   padding:8px 0 1px;
   }
   /*Don't need secondary*/
   #secondary {display:none;}

   And my functions.php is empty.

   I am new to web development. I would appreciate any help.

   Thanks,
   Jane

   Posted 3 years ago #
2. 

   srinair
   Member

   Hey there,

   Check my site - www.srinair.com. Is this what you want to do as well?

   If so, then you have to add code to functions.php in your child theme along with the necessary CSS styles in your style.css file.

   Let me know and I'll share with you what I have and the little I know.

   Sri

   Posted 3 years ago #
3. 

   eastjane
   Member

   Yes something along those lines is what I am looking for. I would appreciate your help.

   Thanks!

   Posted 3 years ago #
4. 

   eastjane
   Member

   Please help me, I am really stuck on this problem. None of the methods talked about in this post:http://themeshaper.com/forums/topic/widgets-in-the-header work for me.

   Thanks,
   Jane

   Posted 3 years ago #
5. 

   Erin
   Member

   You need to add a searchbar to your header before you can style it. Here is how I did it: Add to function.php:

   /* add search form to header
   */
   function add_searchbar(){
   include (TEMPLATEPATH . '/searchform.php');
   }
   add_action('thematic_header','add_searchbar');

   Then, style in your childtheme's stylesheet.

   Posted 3 years ago #
6. 

   eastjane
   Member

   Ok I got it! Thanks for your help. I did the following:

   In function.php
   

   // This will create your widget area
   function search_widgets_init() {
       register_sidebar(array(
          	'name' => 'Header Aside',
          	'id' => 'header-aside',
          	'before_widget' => '<li id="%1$s" class="widgetcontainer %2$s">',
          	'after_widget' => "</li>\n",
   		'before_title' => "<h3 class=\"widgettitle\">",
   		'after_title' => "</h3>\n",
       ));
   
   }
   add_action( 'init', 'search_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" . '</ul>'. "\n";
   		echo '' . "\n" . '</div><!-- #header-aside .aside -->'. "\n";
   	}
   }
   add_action('thematic_header', 'my_header_widgets', 8);
   
   function remove_branding() {
   		remove_action('thematic_header','thematic_brandingopen',1);
   }
   add_action('init', 'remove_branding');
   
   function my_brandingopen() { ?>
   	<div id="header_box">
       	<div id="branding">
   <?php }
   add_action('thematic_header','my_brandingopen',1);
   
   /* add search form to header
   */
   function add_searchbar(){
   include (TEMPLATEPATH . '/searchform.php');
   }
   add_action('thematic_header','add_searchbar', 8);

   In style.css:
   

   #header_box {
   	clear: both;
   	margin: 0 auto;
   	overflow: hidden;
   	position: relative;
   	width: 960px;
   }
   
   /* Moves blog name & description to the left */
   #branding {
   	float: left;
   	width: 620px;
   	margin: 0 0 0 10px;
   	padding:8px 0 1px;
   }
   
   /* Moves the new widgetized area to the right and levels it with #branding */
   #header-aside {
     float: right;
     width: 300px;
     padding: 88px 0 44px;
   }

   Thanks for your help!

   Posted 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.