Make fonts within button same as overall theme

Make fonts within button same as overall theme

letsgetwasted
Excursionist
38 1 7

Hi,

 

The fonts in my "button" seem to have wider spacing and they go lighter grey - is there a way to make them have normal spacing + take the same colour as the body text of that theme? I can't see anywhere to adjust this. 

 

Screenshot 2024-06-26 at 9.35.16 AM.png

Screenshot 2024-06-26 at 9.35.19 AM.png

Shopify URL: https://65a186-44.myshopify.com/

Password: meerew

 

Thank you

Replies 3 (3)

BSSCommerce-B2B
Shopify Expert
551 110 133

Hi @letsgetwasted ,

 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

 

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

BSSCommerceB2B_0-1719366568234.png

 

Step 2: Search for the file base.css. And add this code snippet to the end of the file.

a.button.button--secondary {
    opacity: 1 !important;
    letter-spacing: 0 !important;
}

 

Step 3: Save your code and reload this page.

=>> The result: 

BSSCommerceB2B_1-1719366611075.png

 

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

 

 

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


B2B Solution & Custom Pricing |BSS: B2B Portal, Quote, Net 30 | BSS: B2B Login Lock Hide Price


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


BSS Commerce - Full-service eCommerce Agency

BSSCommerce-HDL
Shopify Expert
994 331 393

Hi @letsgetwasted,

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

BSSCommerceHDL_0-1719366580547.png

 

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

BSSCommerceHDL_1-1719366586263.png

 

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

 

 

.image-with-text__content.image-with-text__content--middle .button {
    opacity: 1 !important;
    letter-spacing: 0 !important;
}

 

Here is result: 

BSSCommerceHDL_2-1719366611369.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

PageFly-Richard
Shopify Partner
4394 1005 1657

Hi @letsgetwasted 

 

This is Richard from PageFly - Shopify Page Builder App

 

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
a.button.button--secondary {
  opacity: 1 !important;
    letter-spacing: 0 !important;
cursor: pointer;
}
</style>

PageFlyRichard_0-1719377156745.png

 

Hope this can help you solve the issue 

 

Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.