Hi,
Is there a way to change search icon with an image that has “search logo+text (seach)”.
There are some feedback that some users did not pay attention to the search icon, so they do not know how to do searching.
thanks
st
Or, Can I replace the icon with button, such as:
[vc_button title="SEARCH" color="btn-inverse" icon="wpb_arrow" size="wpb_regularsize"]
Where should I put that code to replace search icon?
thanks
st
Thanks Lucian,
Can you help me how to put the code, since the shortcode does not work.
thanks
st
Hi,
Add this code: http://pastebin.com/zMYQVeaA to the header-menu.php file like this: http://screencast.com/t/8bQeBbSvA ..then use the custom css from below to make it look like this: http://screencast.com/t/T0kLvJDK5nyS
.header-search-wrap .td-icon-search {
margin-bottom: -3px;
margin-left: 10px;
top: 0px;
position: relative;
width: 16px;
height: 16px;
line-height: 0px;
color: #ffffff;
padding-top: 14px;
padding-left: 14px;
display: inline;
font-size: 13px;
}
.header-search .wpb_button {
margin-top: 6px;
}Make sure you add the code like I did in the screenshot and remove the <i> tag: http://screencast.com/t/9oU00zbpO and if you don’t like the style of it you can change it as you like.
Thanks
Ok. Great.
It works perfectly.
thanks Lucian
st
Hi Lucian,
When I tried with firefox, it does not work. I click the icon, but there is no effect.
regards,
st
Hi,
I haven’t tested it so I wouldn’t know please send your site’s URL so I can inspect it and also look for js errors in your console and make sure you go over the changes you’ve made and see if notice something wrong.
Thanks
I’m looking for a similar solution. My site visitors do not see that the icon is intended for searching. They can’t find the search function. Do you have a more obvious search tool or can you help me with this code? Maybe a search page I can create and link to in menu? I played with the code above, but it persists on mobile browser and interferes with the logo. The above code is not responsive. Thank you!
