Jump to content

How to change button font colour specifically within checkout payment gateway page

Go to solution Solved by paul2009,

Recommended Posts

Hi team, 

Are you able to help with the following?

Within the payment processing gateway of my website, I appear to be able to change the colour of the buttons (eg. the 'continue' button) however I appear unable to change the colour of the font within these buttons. 

As you can see in the attached photos, the font color is white which clashes with the button colour I want for the buttons. 

I have been utilising 'inspect element' within my Chrome browser and the custom CSS feature within Squarespace to update numerous elements within my website. Although I appear to have narrowed down on the exact name of these button block elements I want to update, when I add this exact information into the custom CSS feature in Squarespace, the updates don't work. 

I have attached images below to showcase how I can update the font color within 'inspect elements', proving I have the correct block name, however the same information doesn't change anything within my website.  

Is there any other code I can use here to update the font for these particular buttons? 

Alternatively, within the Squarespace design panel, which buttons am I looking at?

 

Thanks all. Please let me know if this doesn't make sense. 

Mon

Screenshot 2024-06-01 at 4.28.50 pm.png

Screenshot 2024-06-01 at 4.29.10 pm.png

Screenshot 2024-06-01 at 4.32.45 pm.png

Screenshot 2024-06-01 at 4.35.30 pm.png

Screenshot 2024-06-01 at 4.35.51 pm.png

Link to comment
  • Replies 2
  • Views 259
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

  • Solution
28 minutes ago, MonKinloch said:

Within the payment processing gateway of my website, I appear to be able to change the colour of the buttons (eg. the 'continue' button) however I appear unable to change the colour of the font within these buttons. 

You cannot change this.

The checkout page is completely locked down to protect the payment process. Currently, the only settings you can adjust are those shown in the styles panel in your screenshot. So, as you explain, you can only change the background colour of checkout page buttons, not the button text colour. There is not a workaround or solution for this issue because all code, including your CSS, is ignored on this page.

About me: I'm Paul, a SQSP user for over 18 yrs and a Circle Leader since 2017. I value honesty, transparency, diversity and good design ♥.
Work: Founder of SF.DIGITAL, providing high quality original extensions to supercharge your Squarespace website. 
Content: Views and opinions are my own. Links in my posts may refer to my own SF.DIGITAL products or may be affiliate links.
Forum advice is completely free. You can thank me by selecting a feedback emoji below. Buying a coffee is optional.

Book paid help with domains: Connect a GoDaddy domain. Connect a Squarespace Domain. Domain assistance

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.