WooCommerce Search Results - Image Size

Support
#1

Hello,

I saw in a previous post that to make SKU’s searchable i had to install a third-party plug-in. I did that, and the product I’m testing does show up in the search results.

The problem is, the products featured image shows up full width, instead of it’s actual width. It’s just WAY too big. Is there any way to constrain images for products that display in search results? I’m assuming it would have been this large even if they’d used a search buy the product name as well, so it’s not a function of the plug-in.

https://stageusat.wpengine.com/?s=1102709

Please advise.

Jesse

#2

Hello Jesse,

Thanks for writing in!

By default, the search results page display the same layout format like the standard archive pages. You need to add CSS code into X > Theme Options > CSS if you want to display or style the layout.

You need to use the Google Chrome Developer Toolbar to check the live HTML code and find which CSS selector you need to use.

To get you started with your customization, you may use the following class selectors especially if you intend to style the search results page only:

.search .post {
  /* your styling css */
}

.search .has-post-thumbnail .entry-featured {
  /* your styling css */
}

.search .has-post-thumbnail .entry-wrap {
  /* your styling css */
}

You can use floats to have the featured image displaying on the left and the item details on the right. You can check this out:

We are unable to provide CSS code for the customization as it is outside of our support scope. The points above will be a good starting point and if you are interested you can learn more about CSS selectors and details here

Thank you for your understanding.

#3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.