Jump to content

search box alignment

ausdigitalmedia

By ausdigitalmedia
in PHP Coding Help

 Share
Go to solution Solved by PravinS,

Recommended Posts

ausdigitalmedia Newbie

ausdigitalmedia

Posted
Posted

Hi all.

I am trying to have the search box aligned under the cart area top right of this site

thewattletree.com

 

I have placed the search box code inside a dv the same as the cart item but its still not happening for me.

 

Can anyone help?

In case you cant tell I am a php code novice.

Here's the code for the header

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">

<title><?php woo_title(); ?></title>
<?php woo_meta(); ?>
<?php global $woo_options; ?>

<link rel="stylesheet" type="text/css" href="<?php bloginfo( 'stylesheet_url' ); ?>" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php if ( $woo_options[ 'woo_feed_url' ] ) { echo $woo_options['woo_feed_url']; } else { echo get_bloginfo_rss( 'rss2_url' ); } ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
      
<?php wp_head(); ?>
<?php woo_head(); ?>


</head>

         </div>

<body <?php body_class(); ?>>
<?php global $woocommerce; ?>
 

<?php woo_top(); ?>

<div id="wrapper">


	<?php if ( function_exists( 'has_nav_menu') && has_nav_menu( 'top-menu' ) ) { ?>
    
	
	<h1> </h1>
	<div id="top">
		<div class="col-full">
        
			<?php wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'menu_id' => 'top-nav', 'menu_class' => 'nav fl', 'theme_location' => 'top-menu' ) ); ?>
	  </div>
</div><!-- /#top -->
	
    <?php } ?>
    
    <div id="custom">
	<?php global $woocommerce; ?>
 
<a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a><form role="search" method="get" id="searchform" action="http://www.thewattletree.com/">
<div><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s">
<input type="submit" id="searchsubmit" value="Search">
</div>
</form>
     <div>      
	<div id="header-container"> 
    
          
		<div id="header" class="col-full">
        
 		       
			<div id="logo">
		       
			<?php if ($woo_options[ 'woo_texttitle' ] <> "true") : $logo = $woo_options['woo_logo']; ?>
				<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'description' ) ); ?>">
					<img src="<?php if ( $logo ) echo esc_url( $logo ); else { echo esc_url( get_template_directory_uri() . '/images/logo.png' ); } ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" />
				</a>
	        <?php endif; ?> 
	        
	        <?php if( is_singular() && !is_front_page() ) : ?>
				<span class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></span>
	        <?php else : ?>
				<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo('name' ); ?></a></h1>
	        <?php endif; ?>
				<span class="site-description"><?php bloginfo( 'description' ); ?></span>
		      	
			</div><!-- /#logo -->
		       
			<div id="navigation" class="fr"> 
	
				<div class="nav">

				<?php
				if ( function_exists( 'has_nav_menu' ) && has_nav_menu( 'primary-menu' ) ) {
					wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'theme_location' => 'primary-menu' ) );
				} else {
				?>
		        <ul>
					<?php 
		        	if ( isset( $woo_options['woo_custom_nav_menu'] ) AND $woo_options['woo_custom_nav_menu'] == 'true' ) {
		        		if ( function_exists( 'woo_custom_navigation_output' ) )
							woo_custom_navigation_output();
		
					} else { ?>
		            	
			            <?php if ( is_page() ) $highlight = 'page_item'; else $highlight = 'page_item current_page_item'; ?>
			            <li class="<?php echo esc_attr( $highlight ); ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php _e( 'Home', 'woothemes' ); ?></a></li>
			            <?php 
			    			wp_list_pages('sort_column=menu_order&depth=6&title_li=&exclude='); 
		
					}
					?>
		        </ul>
		        <?php } ?>
		      	</div><!-- /.nav -->
	    	    
		    </div><!-- /#navigation -->  
		    <div class="fix"></div>
       
		</div><!-- /#header -->
</div><!-- /#header-container -->

here's the code for the css

/* 
WOO CUSTOM STYLESHEET
---------------------

Instructions:

Add your custom styles in this file instead of style.css so it 
is easier to update the theme. Simply copy an existing style 
from style.css to this file, and modify it to your liking. */

body, #footer-container {
    background-image: url("http://www.thewattletree.com/wp-content/uploads/2013/06/bg-soft-white1.jpg");
}

p.demo_store {
    background: none repeat scroll 0 0 #CCCC99;
    color: #9D725E;
    left: 0;
    padding: 0.3em 0;
    position: fixed;
    right: 0;
    text-align: center;
    top: 0;
    z-index: 999999;
}
a, #comments .comment-head .name, .slide-content .title {
    color: #9D725E;
}
#footer {
    color: #9D725E;
}
h1, h2, h3, h4, h5, h6, .widget h3, .post .title, .nav a, .section .post .title, .archive_header {
    font-family: 'Lora',arial,sans-serif;
	font-weight: lighter;
	text-align: left;

}
.nav a {
    color: #9D725E;
}
#footer-widgets-container {
    background-image: url("http://www.thewattletree.com/wp-content/uploads/2013/06/bg-soft-white1.jpg");
}
#footer-widgets .widget h3 {
    border-color: #263848;
    color: #9D725E;
}
.nav a {
    color: #9D725E;
}
#slides, #title-container {
    background-image: url("http://www.thewattletree.com/wp-content/uploads/2013/06/bg-soft-white1.jpg");
    border-bottom: 1px solid #D4DCE2;
    border-top: 1px solid #DCE4EB;
}
#main h2.section-title {
    font-size: 1.0em;
    font-weight: lighter;
    line-height: 1em;
    margin-bottom: 20px;
}
a:hover, .archive_header, .post .title, .page .title, h1.title, .post .title a:link, .post .title a:visited, .single .title a:link, .single .title a:visited {
    color: #9D725E;
}
.post .title a:link, .post .title a:visited, .single .title a:link, .single .title a:visited {
    color: #9D725E;
}
h1, h2, h3, h4, h5, h6 {
    color: #9D725E;
    font-family: 'Lora',arial,serif;
    font-weight: lighter;
    line-height: 1.1em;
    margin: 0;
}
.section .post .title {
    font: 16px/22px 'Lora',sans-serif;
}
#portfolio .post h3 {
    font-size: 16px;
    font-weight: regular;
    text-align: center;
}
#portfolio .post h3 {
    font-size: 15px;
    font-weight: regular;
}
.nav li ul li a {
    background: none repeat scroll 0 0 transparent;
    color: #9D725E !important;
    font-size: 0.8em;
    padding: 8px 15px;
    width: 150px;
}
.post-type-archive-product #main {width:100% !important}

.post-type-archive-product #sidebar {display:none !important}
#mycustomwidgetarea aside {
   display: inline-block;
};
#mycustomwidgetarea aside {
width: 300px;
display: inline-block;
margin-left: 20px;
}

.onsale {
left: 6px;
top: 6px;
}

.homepage-widget-area { float: left; width: 100%; clear: both;text-align: center; }
.homepage-widget-area aside { width: 50%; float: left; }
#mc_embed_signup{background-image: url("http://www.thewattletree.com/wp-content/uploads/2013/06/bg-soft-white1.jpg"); clear:left; font:14px Lora; }
#mc_embed_signup h2 {
    font-size: 1.4em;
    font-weight: lighter;
}
#footer-widgets .widget h3 {border-bottom:1px dotted #9D725E; color:#9D725E;font-weight: lighter;}
#footer-widgets .widget p {color:#9D725E;}
#footer-widgets { text-align: left; }
.widget_woo_twitter p { padding: 10px 0 0 5px; font-weight: lighter; color:#777; }
.slide .slide-content.video p  { color: #9D725E;font: 13px/1.5em sans-serif; }
#logo { text-align: center; }
#content{ padding:20px 0; min-height: 150px; }
.single-product #title-container {display:none !important}
.styled-select {
    height: 21px;
    line-height: 21px;
    overflow: hidden;
    border: 1px solid #27292c;
    border-radius: 3px;
    background: url('bg.png') no-repeat right #494849;
    box-shadow:inset 0 0 1px #393939;
    -moz-box-shadow:inset 0 0 1px #393939;
    -webkit-box-shadow:inset 0 01px #393939;
}
.styled-select select {
    -webkit-appearance: none;
    -moz-appearance: window;
    background: transparent;
    width: 100%;
    wid\th: 112%;   /* IE hack */
    padding: 1px 20px 0 3px;
    border: 0;
}
#logo  { float:left; }
#top { background-image: url("http://www.thewattletree.com/wp-content/uploads/2013/06/bg-soft-white1.jpg"); } 

#top .nav a {
    border: medium none;
    color: #9D725E;
    line-height: 18px;
    padding: 8px 10px;
    text-decoration: none;
    text-shadow: none;
}
#navigation #searchform{
display:none;
}
#top-nav{
width:100%;
}

#top-nav li.wcmenucart-display-right, #top-nav li{
float:right;
}

#top-nav li.menu-item{
float:left;
}
#custom { width: 960px;margin: 0 auto; text-align: right;}
Link to comment
https://forums.phpfreaks.com/topic/281150-search-box-alignment/
Share on other sites
PravinS Member

PravinS

Posted
Posted

search this code

<div><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s">
<input type="submit" id="searchsubmit" value="Search">
</div>

replace it with

<div align="right"><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s">
<input type="submit" id="searchsubmit" value="Search">
</div>

may this works for you

ausdigitalmedia Newbie

ausdigitalmedia

Posted
  • Author
Posted

Thanks for replying but that change made no effect.

Here is the new code with the change.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html <?php language_attributes(); ?>>
<head profile="http://gmpg.org/xfn/11">

<title><?php woo_title(); ?></title>
<?php woo_meta(); ?>
<?php global $woo_options; ?>

<link rel="stylesheet" type="text/css" href="<?php bloginfo( 'stylesheet_url' ); ?>" media="screen" />
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php if ( $woo_options[ 'woo_feed_url' ] ) { echo $woo_options['woo_feed_url']; } else { echo get_bloginfo_rss( 'rss2_url' ); } ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
      
<?php wp_head(); ?>
<?php woo_head(); ?>


</head>

         </div>

<body <?php body_class(); ?>>
<?php global $woocommerce; ?>
 

<?php woo_top(); ?>

<div id="wrapper">


	<?php if ( function_exists( 'has_nav_menu') && has_nav_menu( 'top-menu' ) ) { ?>
    
	
	<h1> </h1>
	<div id="top">
		<div class="col-full">
        
			<?php wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'menu_id' => 'top-nav', 'menu_class' => 'nav fl', 'theme_location' => 'top-menu' ) ); ?>
	  </div>
</div><!-- /#top -->
	
    <?php } ?>
    
    <div id="custom">
	<?php global $woocommerce; ?>
 
<a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e('View your shopping cart', 'woothemes'); ?>"><?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count);?> - <?php echo $woocommerce->cart->get_cart_total(); ?></a><form role="search" method="get" id="searchform" action="http://www.thewattletree.com/">
<div align="right"><label class="screen-reader-text" for="s">Search for:</label>
<input type="text" value="" name="s" id="s">
<input type="submit" id="searchsubmit" value="Search">
</div>
</form>
     <div>      
	<div id="header-container"> 
    
          
		<div id="header" class="col-full">
        
 		       
			<div id="logo">
		       
			<?php if ($woo_options[ 'woo_texttitle' ] <> "true") : $logo = $woo_options['woo_logo']; ?>
				<a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'description' ) ); ?>">
					<img src="<?php if ( $logo ) echo esc_url( $logo ); else { echo esc_url( get_template_directory_uri() . '/images/logo.png' ); } ?>" alt="<?php echo esc_attr( get_bloginfo( 'name' ) ); ?>" />
				</a>
	        <?php endif; ?> 
	        
	        <?php if( is_singular() && !is_front_page() ) : ?>
				<span class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo( 'name' ); ?></a></span>
	        <?php else : ?>
				<h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php bloginfo('name' ); ?></a></h1>
	        <?php endif; ?>
				<span class="site-description"><?php bloginfo( 'description' ); ?></span>
		      	
			</div><!-- /#logo -->
		       
			<div id="navigation" class="fr"> 
	
				<div class="nav">

				<?php
				if ( function_exists( 'has_nav_menu' ) && has_nav_menu( 'primary-menu' ) ) {
					wp_nav_menu( array( 'depth' => 6, 'sort_column' => 'menu_order', 'container' => 'ul', 'theme_location' => 'primary-menu' ) );
				} else {
				?>
		        <ul>
					<?php 
		        	if ( isset( $woo_options['woo_custom_nav_menu'] ) AND $woo_options['woo_custom_nav_menu'] == 'true' ) {
		        		if ( function_exists( 'woo_custom_navigation_output' ) )
							woo_custom_navigation_output();
		
					} else { ?>
		            	
			            <?php if ( is_page() ) $highlight = 'page_item'; else $highlight = 'page_item current_page_item'; ?>
			            <li class="<?php echo esc_attr( $highlight ); ?>"><a href="<?php echo esc_url( home_url( '/' ) ); ?>"><?php _e( 'Home', 'woothemes' ); ?></a></li>
			            <?php 
			    			wp_list_pages('sort_column=menu_order&depth=6&title_li=&exclude='); 
		
					}
					?>
		        </ul>
		        <?php } ?>
		      	</div><!-- /.nav -->
	    	    
		    </div><!-- /#navigation -->  
		    <div class="fix"></div>
       
		</div><!-- /#header -->
</div><!-- /#header-container -->
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.