Jump to content

Change font of form 'submit' button and header CTA using CSS

Recommended Posts

Add to Home > Design > Custom CSS

@font-face {
	font-family: tuan;
	src: url(upload font to your site and paste font file url here);
}
.header-actions-action a {
    font-family: tuan !important;
}
.sqs-block-button-element {
    font-family: tuan !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 3 months later...
  • 7 months later...

hey @tuanphan same problem here, i'm trying to change font colour of CTA but only within the search page header. this is what I have but it's not working - any ideas? 

 

.sqs-search-page 
.header-actions-action a {
  color: #000000 !important;
}

 

this code works on my other pages so am I targeting the search page incorrectly? 

I've also tried it with body#search too

Edited by spongebob-smc
Link to comment
On 3/5/2021 at 11:38 PM, spongebob-smc said:

hey @tuanphan same problem here, i'm trying to change font colour of CTA but only within the search page header. this is what I have but it's not working - any ideas? 

 

.sqs-search-page 
.header-actions-action a {
  color: #000000 !important;
}

 

this code works on my other pages so am I targeting the search page incorrectly? 

I've also tried it with body#search too

Hi. Can you share site url?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Is there a way to change the form submit button on a specific form in css and not all of them? I've used this basic css before...

.form-wrapper input[type=submit]

But this changes all the form Submit buttons. How do I point that at a specific form ID? I'm assuming it would have to do with...

formId: '#'

But I can't seem to find the answers I'm looking for. Thanks in advance for your help! 

 

Link to comment

@jedoublef

The short answer is yes.

Please post the URL for the page on your site where you want to change the form.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password is not a security breach. Please read the documentation at the link provided to understand how it works.

We can then take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
On 3/5/2021 at 4:38 PM, spongebob-smc said:

hey @tuanphan same problem here, i'm trying to change font colour of CTA but only within the search page header. this is what I have but it's not working - any ideas? 

 

.sqs-search-page 
.header-actions-action a {
  color: #000000 !important;
}

 

this code works on my other pages so am I targeting the search page incorrectly? 

I've also tried it with body#search too

can anyone help with this? just need to figure out how to target search button CTA in header menu but only on search page? 

 

https://mouse-trout-epjy.squarespace.com/search

pw: spong123

Link to comment
On 3/16/2021 at 6:32 PM, spongebob-smc said:

can anyone help with this? just need to figure out how to target search button CTA in header menu but only on search page? 

 

https://mouse-trout-epjy.squarespace.com/search

pw: spong123

Hi. Do you still need help on this?

Search page has no specific class, so you need to use Script code to add class, then use CSS to target search text in header.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.