WP eStore plugin – Customize the product search box CSS

[subfight]

Hi, I have 3 questions…

1. I try to customize the search box that I have when I use this shortcode: [wp_eStore_product_search_with_add_to_cart_button]

Where can I change the background color of the input box (the search field) and the width? I’m unable to find it.

2. When I use the shortcode, [wp_eStore_category_products_fancy id=5 style=3 order=1]

I have the word “price:” written with the amount for each item.

It looks like this: “Price:$9.95” but I just want this: “$9.95”

I can’t find where I can delete that word.

3. How can I disable lightbox when I click the pictures of my items?

Your help should be really appreciated!!

Thanks

[subfight]

For my first question, you can forget it, I’ll ask to the designer of my new wp theme.

And for my second question I found where to disable lightbox.

So still only my third question about Price:

[admin]

Hi, I have made a slight change to the extra shortcodes addon which should allow you to hide the “price” label from the fancy product display.

Please delete the currently installed copy of the extra shortcodes addon then download a new copy from here:

https://support.tipsandtricks-hq.com/forums/download-addons.php

Once you install the newly downloaded copy, share a link to the page where you are displaying your products and I will tell you how to hide the price label.

[subfight]

Hi,

Ok it’s done, however as my site is under construction, I must give you a username and password to access my site. Where can I send you that?

Oh and finally, if you should be able to tell me what is the css class name to customize the search box it should be really helpul. thanks!

[admin]

Actually, I won’t need to… I can just tell you what CSS tweak to apply now. Please add the following CSS in eStore’s custom CSS file to hide the “price” label/text that is shown before a price amount in some product display template:

.eStore_price_label{

display: none;

}

The search submit button wrapped inside the “eStore_search_submit” class. So you can target the submit button like the following:

.eStore_search_submit input[type="submit"]{

//your custom css properties goes here

}

[subfight]

Hi,

Great it works for the label price

About the search box however it doesn’t work. It’s mostly the search field that I really need to customize, not the button…

[admin]

I added another CSS class to the product search input field. Please re-download the extra shortcodes addon and then you can target it using the “eStore_product_search_input_field” class.

[subfight]

Wow great, thanks a lot!!!

[subfight]

One last question about it: I’d like to have the field and button on the same line. I tried display:inline but it doesn’t work… Any idea?

[admin]

Try using “float”.

[Author]

Posts