Replace Magnifying Glass icon with search box in Store locator

[busylizzy.co.uk]

Hi there,

I’ve had a few cases where users have entered their address in the store locator, but not clicked the magnifying glass icon to complete the search, so nothing happens. Is it possible to replace the magnifying glass with a simple search box. I’m using the modern store locator style which i prefer. Any help would be appreciated. Map here: https://busylizzy.co.uk/local/

Thanks

[[email protected]]

Hi there,

Thank you so much for getting in touch.

Just to confirm, am I understanding correctly that you would like to change the search icon into a search button instead?

To do this, could I kindly ask you to add the following CSS to Maps > Settings > Advanced Settings > Custom CSS;

.wpgmza_sl_search_button i,
.wpgmza_sl_reset_button_div i {
display: none;
}
.wpgmza_sl_search_button:after {
content: ‘Search’;
padding: 5px 10px;
background-color: #181B20;
text-transform: uppercase;
font-size: 13px;
color: #ffffff;
}
.wpgmza_sl_reset_button_div:after {
content: ‘Reset’;
padding: 5px 10px;
background-color: #181B20;
text-transform: uppercase;
font-size: 13px;
color: #ffffff;
}
.wpgmza_sl_search_button:hover:after,
.wpgmza_sl_reset_button_div:hover:after{
color: #ffffff;
background-color: rgba(24,27,32,0.92);
}

After adding and saving this, could I kindly ask you to have another look and please let me know if this works as expected for you?

Thanks.

Kindest regards,
Dylan

[Author]

Posts