How can I modify the font and size of my ATC button?

Store Design
1

Hi guys, my ATC currently is very small in font size and I do not like the font, what can I do to keep the button the same length and width but change the font and font size.

2

@michaelhopper17

Can you please share the store url? So that i can look into it and give you best solution.

Thanks

3
4

Hi @michaelhopper17 welcome to the Shopify Community,

Please add the below code to your theme customizer and adjust the font size according to your requirement.

product-form .quick-add__submit span, product-form .product-form__submit span {
    font-size: 22px !important;
}

Theme Customizer:

![2024-02-02 10_21_57-.png|1340x607](upload://cnM7NVNVR9qnN9kSsvaag0J7Vep.png)

Results:

2024-02-06 14_09_33-Window.png
2024-02-06 14_09_33-Window.png1120×586 99.5 KB

Thanks

5

Hi, thank you for your reply. It still doesn’t seem to work maybe because for my home page I am using gem pages, can we add this code on to product pages directly?

6

Never mind I’ve sorted it thank you for that, the other question I had was how can I change the font on the ATC button?

7

@michaelhopper17

Yes you can change it.

8

How can I change the font?

9

@michaelhopper17

please open this for your futher help GemPages

THanks

10

Hi @michaelhopper17 ,

To change the font on GemPages, follow these steps:

Open the GemPages Editor: Go to the page you want to edit from your GemPages dashboard.
Select the Element: Click on the element (text, header, etc.) for which you want to change the font.
Font Settings: In the left sidebar, locate the “Typography” or “Font” section within the settings for the selected element.
Choose Font: Select your desired font from the dropdown menu. You can also adjust the font size, weight, and style here.
Apply Changes: Make sure to save your changes.

For more detailed instructions, you can visit the GemPages help center.

Best regards,
GemPages Support Team