Product Price - Pill Style (For Half Layout)

---

1. Plugin Info

Add a pill style to the price on a product’s main page using half layout.

• Works with Squarespace 7.1

• Uses Custom CSS

---

2. Add this code to Custom CSS

// Product Price - Pill Style (Half Layout) - Ghost //

.pdp-layout .pdp-details .product-price {
  background: #31ce95 !important;
  border: 2px solid #31ce95;
  border-radius: 50px !important;
  padding: 10px 20px !important;
  display: inline-block !important;
}

---

3. Customizable Options

• Background Color

• Border Style

• Border Radius

• Padding

The price’s text color can be changed in Squarespace settings.

---

4. Plugin Notes

• Compatible with the half layout

---