I am using my own version of the magento 1.9 RWD theme and I want to edit the search at the top so instead of the default search icon there is a button that says 'search' that i can style by myself in CSS. Do I need to edit something in form.mini.phtml? Or how would I go about doing this?



By default the RWD theme (I can see in Magento version does style the search button with an icon.

If you re-enable the RWD theme temporarily on local copy of the site you should be able to see the CSS which it uses to style the button.

If you look in /skin/frontend/rwd/default/css/styles.css and at line 3687 you should some CSS for "#search_mini_form .search-button {...." and there is about lines of CSS which styles the button.

  • I can see that styles the button but I need to get rid of that icon before I can style it how I want
    – Oli Tuck
    Mar 17 '16 at 16:11
  • I also need there to be text saying something like 'search' in place of the icon
    – Oli Tuck
    Mar 17 '16 at 16:13
  • So what you need to do is copy the styles.css file into your own theme and then remove the styles for "#search_mini_form .search-button:before" and replace it your own style. Also on about line 1121 you need to remove "#search_mini_form .search-button:before" from the list of CSS selectors for " background-image: url(../images/icon_sprite.png);" Mar 17 '16 at 16:16
  • I have had the styles.css copied into my theme from the start. thank you for the help btw. I just tried removing "#search_mini_form .search-button:before" from the sprites part of the css and reuploaded but it somehow made no difference (i have caching disabled while developing the site)
    – Oli Tuck
    Mar 17 '16 at 16:20
  • Ok I had to do it for the @mediascreen css as well even though i thought that was only for the smaller version of the page
    – Oli Tuck
    Mar 17 '16 at 16:22

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.