Change Buy now button border’s opacity without affecting other buttons

Solved

Change Buy now button border’s opacity without affecting other buttons

MiguelMaya
Tourist
46 0 4

Id like having 80% border opacity for the home page button, but i want all the other buttons’ borders remain 100%, like the Buy now (Compra ahora) buttons both in the product, cart and cart notification pages. These are not separate settings on the Dawn Theme, it changes the border opacity for anll buttons. Are you able to help change it just for the homepage button?

 

Using Dawn 15 misteri.ca

 

IMG_0122.jpeg

Accepted Solution (1)

BSS-TekLabs
Shopify Partner
668 186 217

This is an accepted solution.

Hi @MiguelMaya,

You can follow these steps to make 80% border opacity for just the home page button

1. Open Online Store > Theme > Edit Code

2. Find and open the base.css (or theme.css, custom.css) file

3. Paste the code snippet below at the bottom of the file and hit save

 

.banner__buttons .button--secondary:after {
   --border-opacity: 0.8;
}

 

4. Open Sales Channels > Online Store > Select your current theme > Customize

5. Open Theme Settings > Buttons > Border

6. Set the value for opacity back to 100% to set all other buttons to default

Hope this helps you solve the issue.

Please don't forget to Like and Mark it as an Accepted Solution if you find this helpful. Thank you!

 

 
If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

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

Reply 1 (1)

BSS-TekLabs
Shopify Partner
668 186 217

This is an accepted solution.

Hi @MiguelMaya,

You can follow these steps to make 80% border opacity for just the home page button

1. Open Online Store > Theme > Edit Code

2. Find and open the base.css (or theme.css, custom.css) file

3. Paste the code snippet below at the bottom of the file and hit save

 

.banner__buttons .button--secondary:after {
   --border-opacity: 0.8;
}

 

4. Open Sales Channels > Online Store > Select your current theme > Customize

5. Open Theme Settings > Buttons > Border

6. Set the value for opacity back to 100% to set all other buttons to default

Hope this helps you solve the issue.

Please don't forget to Like and Mark it as an Accepted Solution if you find this helpful. Thank you!

 

 
If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

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


BSS Commerce - Full-service eCommerce Agency