This topic has 8 replies, 3 voices, and was last updated 2 years, 4 months ago ago by Olga Barlow
I want to change the size of variation swatches (Size and color Attribute) to something large than what it is currently. If you could give me the relevant CSS code then I can adjust it.
Hello,
For Shop or Single Product page?
Regards
Shop page.
and is there a way to be able to represent the image instead of the color?
Here is an example:
https://drive.google.com/file/d/1lQiO7vnleTPHOuRtTYlMkAPYzdIoe72O/view?usp=sharing
Hello,
Add the next code in Theme options > Theme custom CSS:
.content-product .st-swatch-popup>.et_st-default-holder ul.st-swatch-size-normal li {
width: 24px !important;
height: 24px !important;
}
.et_st-default-holder {
margin-bottom: 10px;
}
.content-product .st-swatch-popup>.et_st-default-holder ul.st-swatch-size-normal li >span {
padding: 6px !important;
font-size: 11px !important;
}
you can select the Image type – https://prnt.sc/-l3cdgWZEecc
Regards
I used this css to change price color and size, but the unit prices without promotion are still the same. Please give me CSS to change its color and size.
https://drive.google.com/file/d/1iKBzIvZJ_wLAHMintqZ60GBk7Wwl7bOu/view?usp=sharing
And the original price CSS on the single product page.
https://drive.google.com/file/d/1asZ0zt4OX1jBUgdjJ5fIrkrEGREnR2W7/view?usp=sharing
Hello,
1/ Edit this custom CSS code https://prnt.sc/09Aon32uMh02
2/ Describe the desired result in more detail.
Regards
I will describe it in more detail.
I used this CSS to highlight the promotional price area and the original price area.
https://drive.google.com/file/d/1_RrUIISSBX7ywOVfmXu_dKc-2pgmxM0f/view?usp=sharing
But when entering the CSS, the promotion area changes according to my wishes, but the original price area of the products without promotion does not change.
You can see the arrow direction in the image below. I want the CSS to be able to change their colors
https://drive.google.com/file/d/1-zO7EiHsxgl8z7VrTzLWb8paRxx21IWv/view?usp=sharing
Hello,
Use the below code if you want to highlight both simple price and discount price
.content-product .price > .amount, .content-product .price ins span {
color: #fcaf16;
}
Regards
You must be logged in to reply to this topic.Log in/Sign up