Home /
Expert System /
How to enable default search instead of ajax search

How to enable default search instead of ajax search

This guide is for first version of the theme with Ajax search.

1. Disable the cache.

2. Please open
/ app / design / frontend / default / [YOUR THEME] / layout / local.xml

3. Find the following code

4. Replace it with the following code

5. Open the file
/ app / design / frontend / default / [YOUR THEME] / template / page/ html / header.phtml

6. Find the following code

7. Replace it with the following code

8. Open the folder
/ app / design / frontend / default / [YOUR THEME] / template /
and delete sub-folder "catalogsearch"

9. Open the file
/ skin / frontend / default / [YOUR THEME] / css / skin.css

10. Fine the following code

/*Form-search*/
div.search {
    position: relative;
    margin: 0px auto 0px auto;
    width: 60%;
    min-width: 360px;
    padding: 0;
    float: right;
}
#search_mini_form {
    display: block;
    margin: 0px 0px 2px 0px;
    padding: 0;
    position: relative;
    clear: none;
    width: auto;
}
#button-search {
    width: 103px;
    height: 40px;
    float: right;
    margin-left: 5px;
    margin-top: 8px;
     margin-right: 15px;
}
#form-search {
    margin-top: 8px;
    width: 0%;
    height: 40px;
    float:right;
    background: none;
}
.header .form-search {
    height: 25px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 10px;
    position: relative;
}
.header .form-search label {
    display: none;
}
.header .form-search input.input-text {
    height: 27px;
    text-indent: 7px;
    background: #dadada;
    border-radius: 3px;
    border: 0;
    margin: 0;
    padding: 0;
    float: left;
    position: relative;
    color: #000;
    font: 14px Arial, Helvetica, sans-serif;
    width: 100%;
}
.header .form-search input.input-text:focus {
    color: #000;
}
#button-search button.button {
    width: 103px;
    height: 27px !important;
    display: block;
    margin: 0px 0px 0px 0px;
    padding: 0;
    background: url(../images/search_btn.gif) no-repeat 0 0;
}
#button-search button.button:hover {
    opacity: .9;
    filter: alpha(opacity=90);
}
#button-search button.button span {
    display: none;
}
ul.links-advanced {
    font-size: 11px;
    line-height: 11px;
    text-transform: lowercase;
    margin-bottom: 4px;
    clear: both;
    float: none;
    display: none;
    position: absolute;
    right:0;
    bottom:0;
}
ul.links-advanced a:link, ul.links-advanced a:visited {
    padding-left: 7px;
    background: url(../images/header_links_sp.png) no-repeat 0% 70%;
}
#form-search.search-result {
    width: 22%;
}
#form-search.search-result ul.links-advanced {
    display: block;
}
/*search autocomplete fix*/

11. Replace it with the follwing code

/*Form-search*/
div.search {
    position: relative;
    margin: 0px auto 0px auto;
    width: 60%;
    min-width: 360px;
    padding: 0;
    float: right;
}
#search_mini_form {
    display: block;
    margin: 0px 0px 2px 0px;
    padding: 0;
    position: relative;
    clear: both;
    width: 100%;
}
.header .form-search {
    /*width: 100%;*/
    height: 25px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 10px;
    position: relative;
    /*float: right;
    right: 0;*/
      background: url(../images/search_input.gif) no-repeat 0 0;
}
.header .form-search label {
    display: none;
}
.header .form-search input.input-text {
    height: 25px;
    background: url(../images/search_input_bg.gif) repeat-x 0 0;
    margin: 0px 0px 0px 0px !important;
    padding: 0px 0px 0px 0px;
    float: left;
    position: relative;
    border: 0;
    color: #000;
    font:11px Arial, Helvetica, sans-serif;
    width: 100%;
}
.header .form-search input.input-text:focus {
    color: #6f6f6f;
}
.header .form-search button.button {
    position: absolute;
    right: 0;
    width: 39px;
    height: 25px !important;
    display: block;
    margin: 0px 0px 0px 0px;
    padding: 0;
    background: #a90000 url(../images/search_btn.gif) no-repeat 0 0;
}
.header .form-search button.button:hover {
    opacity: .9;
    filter: alpha(opacity=90);
}
.header .form-search button.button span {
    display: none;
}
ul.links-advanced {
    font-size: 11px;
    line-height: 11px;
    text-transform: lowercase;
    margin-bottom: 4px;
    clear: both;
    float: left;
}
ul.links-advanced a:link, ul.links-advanced a:visited {
    padding-left: 7px;
    background: url(../images/header_links_sp.png) no-repeat 0% 70%;
}
/*search autocomplete fix*/

12. Download old_search_images.zip ("search_btn.gif", "search_input.gif") and unpack it to images/ folder:
/ skin / frontend / default / [YOUR THEME] / images

13. Clear your browser cache. Refresh the page.

This is a step-by-step guide on how to enable default search instead of AJAX search in the Full-width theme.

Full-width is premium responsive Magento theme with unlimited colors which can be used according to your needs and requirements. Compatible with Community Magento Edition 1.9.x, 1.8.x, 1.7.x, 1.6.x, 1.5.x, 1.4.x.

Back

Go to contents Back to previous page

Tags:

Share on Facebook google icon

Share on Google

Twitter