Magento:: Popup search box on right sidebar

1-Copy the form.mini.phtml make some changes and create a new file form.mini_popup.phtml as follow:

<div class="search">

<form id="search_mini_form_sidebar" action="<?php echo $catalogSearchHelper->getResultUrl() ?>" method="get">

<div class="form-search_sidebar">

<input id="search_sidebar" type="text" name="<?php echo $catalogSearchHelper->getQueryParamName() ?>" value="<?php echo $catalogSearchHelper->getEscapedQueryText() ?>" class="input-text search_sidebar" maxlength="<?php echo $catalogSearchHelper->getMaxQueryLength();?>" />

<button type="submit" title="<?php echo $this->__('Search') ?>" class="button srch_btn"><span><span><i class="fa fa-search_sidebar"></i></span></span></button>

<i id="searchRemove" title="Close" class="fa fa-times"></i>

<div id="search_autocomplete_sidebar" class="search-autocomplete"></div>

<script type="text/javascript">

//<![CDATA[

var searchForm = new Varien.searchForm('search_mini_form_sidebar', 'search', '<?php echo $this->__('Search entire store here') ?>');

searchForm.initAutocomplete('<?php echo $catalogSearchHelper->getSuggestUrl() ?>', 'search_autocomplete_sidebar');

//]]>

</script>

</div>

</form>

</div>

<script type="text/javascript">

jQuery(window).load(function(){

jQuery(function() {

jQuery('.popup-tool .search').hover(function(){

jQuery('.popup-tool #search_sidebar').animate({

width : '800px'

}, 300 );

jQuery('.popup-tool #search_sidebar').animate({

'marginLeft' : "-=285px" //moves left

});

}, function() {

jQuery('.popup-tool #search_sidebar').animate({width:'580px'}, 300);

jQuery('.popup-tool #search_sidebar').animate({

'marginLeft' : "+=285px" //moves left

});

});

});

});

</script>

2-write down following code in catalogsearch.xml

<block type="core/template" name="top.search_sidebar" as="Search_sidebar" template="catalogsearch/form.mini_popup.phtml"/>

3-call it on header.phtml as follow

getChildHtml('Search_sidebar')?>