How to Add / move magento Search bar in navigation in Magento

Re-Share This Post:

If you would like to have the Search block within the navigation menu , Follow These Simple steps

Method 1

1. Navigate to app/design/frontend/hamjjaa/default/template/catalog/navigation (Here hamjjaa is the template name )
2. Open top.phtml
3. Enter the following Code

 <form id="search_mini_form" action="<?php echo $this->helper('catalogSearch')->getResultUrl() ?>" method="get">  
   <fieldset class="mini-search">  
   <legend><?php echo $this->__('Search Site') ?></legend>  
     <input id="search" type="text" class="input-text" name="<?php echo $this->helper('catalogSearch')->getQueryParamName() ?>" value="<?php echo $this->helper('catalogSearch')->getEscapedQueryText() ?>"/>  
     <input type="image" src="<?php echo $this->getSkinUrl('images/btn_mini_search.gif') ?>" alt="<?php echo $this->__('Search') ?>"/>  
     <div id="search_autocomplete" class="search-autocomplete"></div>  
     <script type="text/javascript">  
       var searchForm = new Varien.searchForm('search_mini_form', 'search', '<?php echo $this->helper('catalogSearch')->__('Search entire store here...') ?>');  
       searchForm.initAutocomplete('<?php echo $this->helper('catalogSearch')->getSuggestUrl() ?>', 'search_autocomplete');  
     </script>  
   </fieldset>  
 </form>  

Method 2

The Default code of magento search bar which is used to call the magento search in header is

 <?=$this->getLayout()->getBlock('top.search')->toHtml()?>   

try to call the following code instead of above code

 <?=$this->getChildHtml('topSearch')?>   

so you’ll be able to put the search bar anywhere in your template.

Method 3

Move to line no 32 of app/design/frontend///layout/catalog.xml. Here look for this code

 <reference name="header">  
 <block type="core/template" name="top.search" as="topSearch" template="catalogsearch/form.mini.phtml"/>  
 </reference>  

Modify the above code with the following code

 <reference name="left">  
 <block type="core/template" name="top.search" as="topSearch" template="catalogsearch/form.mini.phtml"/>  
 </reference>  

Check if you got it or not. If not then check either you have disabled your Cache or not, by going to system->cache management . Disable Cache and clean the cache. and Check again ( You are done ).

One Important Thing first remove the .form-search { position: absolute; right: 10px; top: 100px; }
 from Css
and Change it with .form-search { position: relative;  } and stylize it with you own css