Adjust/Style the search bar

aovivo · May 2016

Hi there - I wonder if there is a option to style the search bar. f.e. I would like to use a word like 'search' instead of the magnifying glass... some customers easily oversee the glas - but would recognize a type in field with a 'Seach' information

Can this be easily altered? If not, can you recommend a plug-in that offers such an option?

thanks in advanced

Pedro

Albert · May 2016

Hi Pedro,

we are sorry but we do not have an option to replace magnifying glass with the text. This requires files customization.

Thanks!

aovivo · May 2016

Ok. can you please guide me in how to:

1) remove the magnifying glass

2) remove the border around search field

3) adjust the word/field 'search' in accordance to the menu elements on the left as seen here: http://www.redreinhardt.com/blog/ -> somehow the element is slightly shifted downwards...

thanks

Pedro

Albert · May 2016

Ok. To do this then, you need to use:

#Top_bar a#search_button i.icon-search { display: none !important; }
#Top_bar a#search_button.has-input input { border: 0 !important; top: -7px !important; }

aovivo · May 2016

thats great, thanks!
how can I align the search box to the right border?
Can I change the font of the placeholder text?
thanks in advance

Albert · May 2016

Search is already adjusted to the right side and it is not possible to move it more. But to change font type of search, the font need to be selected under Theme options > Fonts section and all you need to change it is the following css:

#Top_bar a#search_button.has-input input { font-family: "FONT-NAME" !important; }

aovivo · May 2016

thanks!!

Albert · May 2016

You're welcome!

Adjust/Style the search bar

Comments