Place Product Search box on header 1

swiftideas

ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

This topic has 17 replies, 3 voices, and was last updated 10 years by Mohammad – SUPPORT.

Viewing 15 posts - 1 through 15 (of 18 total)

1 2 →

Back to forum

Posted in: Neighborhood

April 9, 2014 at 8:38 pm #65788

mariospavlou

Member

Post count: 22

Hello ,

I am trying to put product search box on header but I can’t place it where I want.
I have added the the_widget( ‘WC_Widget_Product_Search’ ); into the sf-header.php but I am getting the search box at top of everything. see attachment 1 but I want to place it like the attachment 2.

Can you help me with that please ?

Thanks
Marios

April 10, 2014 at 8:09 am #65864

Kyle – SUPPORT

Moderator

Post count: 35880

It’s possible because you have at least got it into the header, but you need to have knowledge of html/css so that position it where you want it.

Unfortunately as it’s not part of the current theme functionality, we can not support you with that. You will need to add extra divs and css to position it there, and it is beyond the customisations that we can support.

– Kyle

April 10, 2014 at 8:17 am #65866

mariospavlou

Member

Post count: 22

Hi kyle,

I have the knowledge of html/css but because the swift framework is custom I can’t do much without any guidelines.

The only thing I need is to tell me how I can place this

<div class="widget woocommerce widget_product_search"><form role="search" method="get" id="searchform" action="http://incarunlimited.com/">
			<div>
				<label class="screen-reader-text" for="s">Search for:</label>
				<input type="text" value="" name="s" id="s" placeholder="Search for products">
				<input type="submit" id="searchsubmit" value="Search">
				<input type="hidden" name="post_type" value="product">
			</div>
		</form></div>

inside header-left span4

 
<div class="header-left span4"><nav class="header-menu">
<ul class="menu">
<li class="tb-welcome">Welcome mariospavlou</li>
<li class="hs-woo-custom clearfix"><a class="swift-search-link" href="#"><i class="fa-search-plus"></i><span>VEHICLE AND BRAND FILTER</span></a></li>
</ul>
</nav>
<div class="widget woocommerce widget_product_search"><form role="search" method="get" id="searchform" action="http://incarunlimited.com/">
			<div>
				<label class="screen-reader-text" for="s">Search for:</label>
				<input type="text" value="" name="s" id="s" placeholder="Search for products">
				<input type="submit" id="searchsubmit" value="Search">
				<input type="hidden" name="post_type" value="product">
			</div>
		</form></div></div>

April 10, 2014 at 8:22 am #65871

Kyle – SUPPORT

Moderator

Post count: 35880

You need to open up sf-header.php and find this:

if ($header_layout == "header-1") {
		
		$header_output .= '<header id="header" class="clearfix">'. "\n";
		$header_output .= '<div class="container">'. "\n";
		$header_output .= '<div class="row">'. "\n";
		$header_output .= '<div class="header-left span4">'.sf_woo_links('header-menu', 'logo-left').'</div>'. "\n";
		$header_output .= sf_logo('span4 logo-center');
		$header_output .= '<div class="header-right span4">'.sf_aux_links('header-menu', TRUE).'</div>'. "\n";
		$header_output .= '</div> <!-- CLOSE .row -->'. "\n";
		$header_output .= '</div> <!-- CLOSE .container -->'. "\n";
		$header_output .= '</header>'. "\n";
		$header_output .= sf_mobile_search();
		$header_output .= '<div id="main-nav">'. "\n";
		$header_output .= sf_main_menu('main-navigation', 'full');
		$header_output .= '</div>'. "\n";

– Kyle

April 10, 2014 at 8:31 am #65877

mariospavlou

Member

Post count: 22

I found that one and I have place the search box as below but the search box is not placed at the header as expected.
Do I need to edit anything else ?

if ($header_layout == "header-1") {
		
		$header_output .= '<header id="header" class="clearfix">'. "\n";
		$header_output .= '<div class="container">'. "\n";
		$header_output .= '<div class="row">'. "\n";
		$header_output .= '<div class="header-left span4">'.sf_woo_links('header-menu', 'logo-left').'</div>'. "\n";
		$header_output .= sf_logo('span4 logo-center');
		$header_output .= '<div class="header-right span4">'.sf_aux_links('header-menu', TRUE).'</div>'. "\n";
		$header_output .=  the_widget( 'WC_Widget_Product_Search' );
		$header_output .= '</div> <!-- CLOSE .row -->'. "\n";	
		$header_output .= '</div> <!-- CLOSE .container -->'. "\n";
		$header_output .= '</header>'. "\n";
		$header_output .= sf_mobile_search();
		$header_output .= '<div id="main-nav">'. "\n";
		$header_output .= sf_main_menu('main-navigation', 'full');
		$header_output .= '</div>'. "\n";

April 10, 2014 at 8:32 am #65878

mariospavlou

Member

Post count: 22

or did I placed
$header_output .= the_widget( 'WC_Widget_Product_Search' );
in the wrong place ?

April 10, 2014 at 10:10 am #65921

Kyle – SUPPORT

Moderator

Post count: 35880

Try this:

if ($header_layout == "header-1") {
		
		$header_output .= '<header id="header" class="clearfix">'. "\n";
		$header_output .= '<div class="container">'. "\n";
		$header_output .= '<div class="row">'. "\n";
		$header_output .= '<div class="header-left span4">'.sf_woo_links('header-menu', 'logo-left') "\n";
		$header_output .= the_widget( 'WC_Widget_Product_Search' );.'</div>'.
		$header_output .= sf_logo('span4 logo-center');
		$header_output .= '<div class="header-right span4">'.sf_aux_links('header-menu', TRUE).'</div>'. "\n";
		$header_output .= '</div> <!-- CLOSE .row -->'. "\n";
		$header_output .= '</div> <!-- CLOSE .container -->'. "\n";
		$header_output .= '</header>'. "\n";
		$header_output .= sf_mobile_search();
		$header_output .= '<div id="main-nav">'. "\n";
		$header_output .= sf_main_menu('main-navigation', 'full');
		$header_output .= '</div>'. "\n";

You may need to add extra divs to separate the search box from the links.

– Kyle

April 10, 2014 at 11:47 am #65964

mariospavlou

Member

Post count: 22

I have try that one but it kills my site and I am getting a blank page.
Are you sure about that piece of code ?
` $header_output .= ‘<div class=”header-left span4″>’.sf_woo_links(‘header-menu’, ‘logo-left’) “\n”;
$header_output .= the_widget( ‘WC_Widget_Product_Search’ );.'</div>’.`

April 10, 2014 at 3:02 pm #66050

Mohammad – SUPPORT

Moderator

Post count: 27441

Hi,
Please find this code

$header_output .= the_widget( 'WC_Widget_Product_Search' );.'</div>'

Replace with 
$header_output .= the_widget( 'WC_Widget_Product_Search' ).'</div>';

Hopefully it should work 100% .

With Best Regards
Swift Ideas

April 10, 2014 at 3:58 pm #66073

mariospavlou

Member

Post count: 22

It still killing my site and I am getting black page. Below is the full block of code

$header_output .= '<header id="header" class="clearfix">'. "\n";
		$header_output .= '<div class="container">'. "\n";
		$header_output .= '<div class="row">'. "\n";
		$header_output .= '<div class="header-left span4">'.sf_woo_links('header-menu', 'logo-left') "\n";
		 //$header_output .= '<div class="header-left span4">'.sf_woo_links('header-menu', 'logo-left');
        $header_output .= the_widget( 'WC_Widget_Product_Search' ).'</div>'.;
		$header_output .= sf_logo('span4 logo-center');
		$header_output .= '<div class="header-right span4">'.sf_aux_links('header-menu', TRUE).'</div>'. "\n";
		$header_output .= '</div> <!-- CLOSE .row -->'. "\n";	
		$header_output .= '</div> <!-- CLOSE .container -->'. "\n";
		$header_output .= '</header>'. "\n";
		$header_output .= sf_mobile_search();
		$header_output .= '<div id="main-nav">'. "\n";
		$header_output .= sf_main_menu('main-navigation', 'full');
		$header_output .= '</div>'. "\n";

April 10, 2014 at 4:10 pm #66079

Mohammad – SUPPORT

Moderator

Post count: 27441

Hi,

Find this code 
$header_output .= the_widget( 'WC_Widget_Product_Search' ).'</div>'.;

Replace with
$header_output .= the_widget( 'WC_Widget_Product_Search' ).'</div>';

It will resolve the issue easily .

Thanks 🙂
With Best Regards
Swift Ideas

April 10, 2014 at 7:14 pm #66140

mariospavlou

Member

Post count: 22

Hi unfortunately the search box it’s still on top.

April 11, 2014 at 12:54 am #66167

Mohammad – SUPPORT

Moderator

Post count: 27441

Hi,
Please roll back all changes ,attach a marked screenshot and provide website so i can suggest you winning solution .

Thanks 🙂
With Best Regards
Swift Ideas

April 11, 2014 at 6:49 am #66189

mariospavlou

Member

Post count: 22

This reply has been marked as private.

April 11, 2014 at 7:04 am #66192

mariospavlou

Member

Post count: 22

This reply has been marked as private.

Back to forum

Posted in: Neighborhood

Viewing 15 posts - 1 through 15 (of 18 total)

1 2 →

You must be logged in and have valid license to reply to this topic.

License required for one of the following items

ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

Support Request

Support Policy

Privacy Policy