Archived topic
Style WooCommerce Product Search Field
1 reply · Started by Roddy on June 9, 2020
Hi - hoping you can help me out.
I'm using GeneratePress with a child theme and Elementor. I'm trying to style the WooCommerce Product Search Field in the header section of my site. I have provided a link to the development site below. The top search box is a standard search form, styled the way I would ideally like to style the product search field. The second search box is the standard product search field with the default styling. The options to style the product search field using Elementor are extremely limited.
Could you advise on how I can style the product search field to look the same way I have styled the standard search form at the top?
Thanks!
Hi there,
Most of the style of the second search field is all coming from the WooCommerce Product Search plugin itself.
The theme does control the color of the border which you can change with this CSS:
.product-search input[type="text"] {
border-color: #000000;
border-radius: 5px;
}