Jump to content

How to have the custom form 'add to cart button' on a product page be different than the add to cart button on the main shop page

Go to solution Solved by tuanphan,

Recommended Posts

I have the custom form enabled on this product as well as customizing the "add to cart" button text. My goal on the main product page was for it to say "continue to add details" and then on the custom form it would say "add to cart" or "pay now". 

I tried using the :before tag with the "content" change and that didn't seem to work. 

Could use an expert coder here! 

Screen Shot 2023-08-01 at 2.46.38 PM.png

Screen Shot 2023-08-01 at 2.46.46 PM.png

Link to comment

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

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

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • Solution

I guess rename add to cart text would be easier.

If you need to rename add to cart text, use this CSS code

/* rename add to cart */
.sqs-add-to-cart-button-inner {
    font-size: 0 !important;
}
.sqs-add-to-cart-button-inner:before {
    content: "New Add to Cart";
    font-size: 18px !important;
    display: block;
}

If you want this code run on one product only, edit Additional Info > Paste this

<style>
  /* rename add to cart */
.sqs-add-to-cart-button-inner {
    font-size: 0 !important;
}
.sqs-add-to-cart-button-inner:before {
    content: "New Add to Cart";
    font-size: 18px !important;
    display: block;
}
</style>

 

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.