Solved

how to match these button styles?

empiricalarby
Trailblazer
173 1 30

I want every "add to cart" button to look like the big red button on my home page that says TRY A SAMPLE: https://empiricalwater.com/

 

Other buttons are found on any product you click on this page: https://empiricalwater.com/collections/all

they all need to be the most bold version of the font known as roboto condensed "black" italic, and all caps.

 

Thanks

Accepted Solutions (3)

BSSCommerce-HDL
Shopify Expert
733 243 255

This is an accepted solution.

Hi @empiricalarby ,

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css, theme.css or styles.css

Step 3: Insert the below code at the bottom of the file -> Save

button.product-form__submit.button {
    font-size: 22px !important;
    font-style: italic !important;
    font-weight: 900 !important;
}

 

Here is result: 

BSSTechVenture_0-1716011203992.png

Hope this can help you, 
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

pawankumar
Shopify Partner
541 70 95

This is an accepted solution.

Hi @empiricalarby 
Please put this code in theme.liquid before body closing tag </body>

<style>
.product-form__submit {
text-align: center;
font-weight: 900;
padding: 16px 22px;
font-style: italic;
font-size: 22px;
text-transform:uppercase
}
</style>

Thanks!

- Need a Shopify developer? Chat on WhatsApp +91-9467121281
- Coffee Tip: Buymeacoffee  | Email: thepkpawankumar@gmail.com
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Best regards,
Pawan

View solution in original post

BSSCommerce-HDL
Shopify Expert
733 243 255

This is an accepted solution.

Hi @empiricalarby , Pls insert this code to your file css : 

button[name="checkout"] {
    font-size: 22px !important;
    font-style: italic !important;
    font-weight: 900 !important;
}

Here is result: 

BSSTechVenture_0-1716012310044.png

Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

Replies 5 (5)

BSSCommerce-HDL
Shopify Expert
733 243 255

This is an accepted solution.

Hi @empiricalarby ,

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file base.css, theme.css or styles.css

Step 3: Insert the below code at the bottom of the file -> Save

button.product-form__submit.button {
    font-size: 22px !important;
    font-style: italic !important;
    font-weight: 900 !important;
}

 

Here is result: 

BSSTechVenture_0-1716011203992.png

Hope this can help you, 
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency
empiricalarby
Trailblazer
173 1 30

Thank you, can you apply this to the "Check out" button also for when product is in cart? And also the Pay now button at end of checkout.

BSSCommerce-HDL
Shopify Expert
733 243 255

This is an accepted solution.

Hi @empiricalarby , Pls insert this code to your file css : 

button[name="checkout"] {
    font-size: 22px !important;
    font-style: italic !important;
    font-weight: 900 !important;
}

Here is result: 

BSSTechVenture_0-1716012310044.png

Hope this can help you,
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

pawankumar
Shopify Partner
541 70 95

This is an accepted solution.

Hi @empiricalarby 
Please put this code in theme.liquid before body closing tag </body>

<style>
.product-form__submit {
text-align: center;
font-weight: 900;
padding: 16px 22px;
font-style: italic;
font-size: 22px;
text-transform:uppercase
}
</style>

Thanks!

- Need a Shopify developer? Chat on WhatsApp +91-9467121281
- Coffee Tip: Buymeacoffee  | Email: thepkpawankumar@gmail.com
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Best regards,
Pawan
empiricalarby
Trailblazer
173 1 30

Thank you, can you apply this to the "Check out" button also for when product is in cart? And also the Pay now button at end of checkout.

 

Thank you