fbpx
Want To Add Extra Images Per Product Variation For Free? Download Now

Color variations not showing, although they are working,

Mar Valles

Color variations are not showing on the page, but they are there, as I can click on it (blindly).

This is the page where I’m having the problem: https://www.nidittopiu.com/producto/bolsa-totebag_guacamayos-y-tucanes/

Captura de pantalla 2024-01-30 123352.png

 

The swathes are at the red circled area.

Thanks.

Hakik Zaman

Hi Mar,

Thanks for getting back to us. You are using BeTheme and they have built-in swatches support inside their theme.

You can’t use two different swatches feature on the same site. So, either you have to disable our or the built-in swatches feature from the theme settings.

Thank You

Mar Valles

Thanks a ton, I didn’t notice I was using the BeTheme ones… I’ve already disabled it and now it works perfectly.

It happens another problem though. I was using this code:

.woocommerce .mfn-variations-wrapper .mfn-vr ul.mfn-vr-options {
display: block;
}

So I can see the variations one on the top of another in this product: https://www.nidittopiu.com/producto/bienestar-enriquecimiento/

And now I see them one next to the other.

Do you know how can I change the code, so I see the variations of this particular product one on the top of the other again?

Thanks a million, you’re the best and super fast!

Hakik Zaman

Hi Mar,

Thanks for the clarification.

Please add the following CSS:

.woo-variation-swatches ul.variable-items-wrapper {
display: block;
}
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):last-child {
margin-right: 4px;
}

I hope this will help you to achieve the layout you described in your screenshot.

We get excited & honored when you use our plugin on your site.

If you found my support helpful, could you please leave your valuable review here: https://wordpress.org/support/plugin/woo-variation-swatches/reviews/?filter=5

Your rating keeps us inspired.

Thank You

Mar Valles

Thanks, this is working fine.

But it is also affecting to the first product we were talking about. Is there a way to apply it just on the second one?

Thanks.

Hakik Zaman

Hi Mar,

But it is also affecting to the first product we were talking about. Is there a way to apply it just on the second one?

Can you please give me a screenshot to understand it clearly?

Thank

Mar Valles

Hi, thanks for reaching out.

You can see it here: https://drive.google.com/file/d/1EMuEQB4oZIMK7xAdmJ50SGKl49FLJ2Ke/view?usp=sharing

I also attach the link of product: https://www.nidittopiu.com/producto/bolsa-de-tela-guacamayos-y-tucanes/

For this product I prefer the variables showing one next to the other.

 

But keeping the variations here ( https://www.nidittopiu.com/producto/bienestar-enriquecimiento/ ) one on top of the other (image: https://drive.google.com/file/d/1oKel7XNhWuDdu7Qx1KASM9qv5Y5tMufl/view?usp=sharing)

 

Thanks.

 

 

 

Hakik Zaman

Hi Mar,

Please replace the previous CSS with the following:

.woo-variation-swatches.postid-7582 ul.variable-items-wrapper {
display: block;
}
.woo-variation-swatches.postid-7582 .variable-items-wrapper .variable-item:not(.radio-variable-item):last-child {
margin-right: 4px;
}

Hope to hear from you soon.

Thank You

Hakik Zaman

Hi Mar,

Thank you so much for your kind words.

Please feel free to open a new ticket if you face any issues regarding our plugins.

For now, I am changing the status of the ticket to Resolved.

Have a great day!

Thank You