Variation Swatches in one line?

Is there an option in Woodmart to display variation swatches on one line on shop pages?

Perhaps only showing a few at a time with a < > carousel type thing?

I’m not seeing an option for something like this. For products with lots of variations it can start looking a little weird on shop pages.

Thanks!

Hello,

Yes you can use your attribute filters inside the shop sidebar. For the variable swatches you can follow the below documentation: https://xtemos.com/docs/woodmart/variable-products-swatches/

If it does not help then share some relevant screenshots by pointing out the specific sections and the URL of that page. So I can check it myself and help you out accordingly.

Best Regards.

I’m not sure if we are talking about the same thing. I attached a screenshot. As you can see, I’m getting multiple lines of swatches. Is there someway to display them in one line with arrows to view them?

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshot you attached. Unfortunately, there is no option available in theme settings to display the attribute swatches images in a carousel. It requires customization and this is beyond our limitations and support policy.

You can check the available product grid styles from Theme Settings >> Shop >> Product Styles.
Screenshot for Clarification: https://www.screencast.com/t/wzaetvMV

Best Regards.

Is there a way to just use CSS to only allow them on one line and hide the overflow as a quick fix?

Hello,

Please copy and paste the below given Custom CSS code to Theme Settings >> Custom CSS >> CSS code for Desktop and check your site after removing the browser cache.

.product-grid-item .swatches-on-grid {
    height: 25px;
    overflow: hidden;
}

And remember that this code only works for you for single line and hide the rest variations. If you wants to show complete variations as slider < > then this requires Customization and it is beyond our limitations.

Best Regards.

[Author]

Posts