Frame to Size Attribute

Hi,
I want to make some changes to the filters on the Shop page.
I want to put the size names in the box. As in the attached picture.
How can I do that?

Hello,

Please attach the image, we will check if it is possible to do with the custom CSS.

Best Regards

Hi Elise,
Thank you for your interest

https://i.ibb.co/6YGcHF0/Ekran-Resmi-2022-02-07-23-15-03.png

Hello,

Please provide the shop page URL, if your site is under construction, insert the site admin access into the Private content below the message area. We will give you custom CSS.

Best Regards

Hi Elise,
I’m sorry for the late reply. I would be glad if you help.

Hello,

Please install free Classic widget plugin to fix this WordPress bug: https://gyazo.com/300e43a897f068fc822b1d4f0496dc38

Then add the WoodMart widget to the Shop page widget area and I will give you custom CSS: https://xtemos.com/docs-topic/widgets-and-sidebars/

Best Regards

Hi Elise,
I installed the Classic Widgets plugin. I added the plugin to the widget. What else do I need to do?
Can I make the box shape in this size chart on a single product page?

Attachments:

You must be logged in to view attached files.

Hello,

Sorry I have got you wrongly.

Please add this code to the Theme Settings > Custom CSS > Global:

.wd-swatch:after {
    display:none;
}
.swatch-on-single.swatch-enabled.active-swatch {
    border:2px solid #000000;
}
.swatch-on-single.swatch-enabled {
    border:2px solid #cecece;
}
.swatch-on-single.swatch-enabled.text-only{
		padding:5px;
    min-width: 35px;
}

Best Regards

Thank you Elise.
Do not worry. I explained it poorly.
Actually, I want to do this in both regions.
I did it on a single product page with the code you gave.
I can do it with CSS on the Shop page, but it happens with other filters as well.
I can’t separate them.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

.woodmart-woocommerce-layered-nav .with-swatch-text.chosen .layer-term-name:after {
display:none;
}

.woodmart-woocommerce-layered-nav .with-swatch-text.chosen .layer-term-name {
border:2px solid #000000;
}
.woodmart-woocommerce-layered-nav .with-swatch-text .layer-term-name {
border:2px solid #cecece;
}

This is for the shop page.

Best Regards

Elise thank you so much for helping 🙂

You are welcome! We are here to help.

Wish you a wonderful day!

[Author]

Posts