# Change add to cart to tertiary button style

**URL:** <https://community.elfsight.com/t/change-add-to-cart-to-tertiary-button-style/99513>\
**Category:** Platform Tips\
**Tags:** squarespace\
**Created:** [February 7, 2025, 12:58am UTC](https://community.elfsight.com/t/change-add-to-cart-to-tertiary-button-style/99513 "2025-02-07T00:58:10Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![tuanphan](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/tuanphan/32/3165_2.png) [@tuanphan](https://community.elfsight.com/u/tuanphan)\
**Post date:** [February 7, 2025, 12:58am UTC](https://community.elfsight.com/t/change-add-to-cart-to-tertiary-button-style/99513/1 "2025-02-07T00:58:10Z")

</div>

By default, Add to Cart uses Primary Button Style.

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/4/a/4a47aadbe8a1fd9acc29099bb633adc28ee6344e.png)

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/b/c/bc616b3fb28d0e9255968464a2f5152daa52e0a2.jpeg)

If you want to change it to

Tertiary Style.

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/5/c/5c93a96024a4a67819eec234ea615fd9279008b5.jpeg)

You can use this code to Code Injection \> Footer.

If code doesn’t work, you can comment below, [message](https://community.elfsight.com/u/tuanphan/) or [email me](mailto:info@beaverhero.com).

```auto
<script>
document.addEventListener('DOMContentLoaded', function() {
 let cartButton = document.querySelector('.sqs-add-to-cart-button');
 if (cartButton) {
  cartButton.className = 'sqs-add-to-cart-button sqs-suppress-edit-mode sqs-editable-button sqs-button-element--tertiary';
 }
});
</script>

```

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/1/4/1465c0c3681bb3b5019c21c8e9eeb1b50b2be96a.png)

Result

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/c/a/ca52ad1a838000aa1d1a6301fbf05f46f6156d16.png)