Topic summary
A user wants to center color swatches on their product cards and potentially move them below the product information.
A solution was provided involving CSS customization:
- Navigate to Online Store > Themes > Actions > Edit Code > base.css
- Add the following code at the bottom of the file:
.collection-product-card__variants {
justify-content: center;
}
This CSS rule centers the color swatches by adjusting their alignment. A screenshot demonstrates where to insert the code in the theme editor.
Status: The centering issue has a proposed solution; moving swatches below product information was not yet addressed.
Hi @flamontana ,
Go to Online Store > Themes > Actions > Edit Code > base.css
Add below code at the bottom of base.css file
.collection-product-card__variants {
justify-content: center;
}
