How to change product image background color from black to white?

Pending
REHub - Price Comparison, Affiliate Marketing, Multi Vendor Store, Community Theme REHub - Price Comparison, Affiliate Marketing, Multi Vendor Store, Community Theme December 07, 2020
Login to reply
Igor Sunz Support Agent
3 years ago

Technically it’s possible but requires customization

Jordan Dayton
3 years ago

So hypothetically, could you copy/paste and take certaining components from one product layout and remove the current component of the layout being used?

e.g. if there is a dozen lines of code to use your image gallery and not the default one from WooCommerce, couldn't we just take your code bits and add them to our current layout, which happens to be using the default Woo image gallery?

Igor Sunz Support Agent
3 years ago

All files for product layouts are in inc/product_layout/... folder of
theme. I don't think that there is simple way to do this, because each
layout has unique principles and styles.

You can hire our customization team, price is $40 per hour of their work

Jordan Dayton
3 years ago

So how can I combine components that I like about one layout, with another. 

I can see how to select a different layout, on the product screen.

Is there a way to (like a block editor, or copying/pasting PHP snippets) to mix and match components from different templates?

e.g. maybe I could start with the template I'm using right now, but remove one component of the layout and replace it with the same component from a different layout, that looks the way we like?

Igor Sunz Support Agent
3 years ago

You can choose product layout in right panel. Or check documentation which
has screenshots.
https://rehubdocs.wpsoul.com/docs/rehub-theme/shop-options-woo-edd/product-layout/

Difference is that some product layouts use regular wooocommerce image
gallery and popups (like you have in current time), some layouts use our
own image gallery. You can't change this, you can choose product layout
which better fits to your needs

Jordan Dayton
3 years ago

Ahhhh. Thank you.

How can I apply that to my current product layout?

I don't quite understand how to substitute between layout components.

Do you have a good video that shows step by step how to do this?

Igor Sunz Support Agent
3 years ago
Jordan Dayton
3 years ago

Thank you for the input. I wish there were a native way to change the color so I wasn't having to do an override.

Did you see our other question?

Is there a way to see all the other gallery images in this full-screen view? It would be nice if the user saw all the alternative images in the gallery, below the images (in small thumbnail form) that they could click to see other images. Also... a right and left arrow to allow the user to click to the next or previous image in the gallery. 

I feel like I remember your theme doing this. Did we inadvertently turn off this feature?

Igor Sunz Support Agent
3 years ago

this is proper way to overwrite but not proper color. You should not edit
regular woocommerce lightbox if you want to have bug free products

Jordan Dayton
3 years ago

Perfect! That worked great. I had some old code in my CSS overrides that I wrote, which used to work:

.mobx-overlay {
    background-color: #fff !important;
}

Is there a PROPER way to do this?

Also, is there a way to see all the other gallery images in this full screen view?

Igor Sunz Support Agent
3 years ago

.pswp__bg{background:white !important}

you can place this in theme options - general options - custom css

Once you add this code, background will be white and all system elements will be not visible in popup. Use this on own risk, because this is not proper color for woocommerce popups

Jordan Dayton
3 years ago

When a user clicks on a product image to see the full-size view, the background color is black, by default. We’d like it to be white by default. Is there a setting where this could be changed instead of having to do a CSS override?

Additional Info

Link on page with issue (Optional): https://pickleballist.com/pickleball-paddles/paddletek-bantam-ex-l-pickleball-paddle/?preview