Add-On Products
Add-On Products Selectors
Use these selectors to target add-on product elements.
Selectors work with Squarespace 7.1
Knowing the basics of CSS is recommended
Helpful starting points: Visit the free plugin library for pre-applied styles and helpful starting points for customizations.
Add-On Product Container
.product-details .pdp-product-add-ons .add-on-card
Add-On Product Image
.product-details .pdp-product-add-ons .add-on-thumbnail
Add-On Product Title
.product-details .pdp-product-add-ons .add-on-details .add-on-title
Add-On Product Price
.product-details .pdp-product-add-ons .add-on-details .product-price
Add-On Product Variant Dropdown
.product-details .pdp-product-add-ons .product-variants .variant-option select
Add-On Product Variant Text
.product-details .pdp-product-add-ons .product-variants .variant-option select
Add-On Product Variant Arrow (v)
.ProductItem .ProductItem-details .variant-select-wrapper::after
Add To Cart Button (Circle)
.product-details .pdp-product-add-ons .sqs-add-to-cart-button
Add To Cart Icon (+)
.product-details .pdp-product-add-ons .add-on-add-to-cart-wrapper .sqs-add-to-cart-button svg.plus-icon