How to change the 'Buy Now' button text?

Technical Q&A
,
1

Hello,

I’m trying to change the text of the “Buy Now” button to say “Preorder Now” instead. I’ve looked into various solutions, like the one mentioned here: https://community.shopify.com/c/technical-q-a/how-can-i-alter-the-buy-it-now-button-text-on-my-product-page/m-p/1703459 . However, it seems the code has changed, and I can’t find the button code in the file anymore.

I’d prefer to avoid using setTimeout tricks, as suggested in some answers I found, because they seem quite messy. But if anyone has a working example, I’ll take it and maybe add an event listener to make it cleaner.

I’m using the Dawn theme.

Thanks in advance and have a great day!

1 Like
2

This is Noah from PageFly - Shopify Page Builder App

Hi @Milan_5 I can help you. Please can you provide the website url. Thank you.

Best regards,

Noah | PageFly

3

Hi @Milan_5 ,

You can change the text of Buy it now button to Preorder now by following this guide:

  1. Go to your online stores

  2. Go to themes, and edit code

  3. Then find theme.liquid file

Add this code before tag

The result will look like this

BSSCommerceTA_0-1718902593440.png
BSSCommerceTA_0-1718902593440.png387×595 15.5 KB

Hope this will help you.

1 Like
4

Hi Noah,

Thanks for your message, of course : dearcolorist.com

Best,

Milàn

5

Thank you @BSSCommerce-TA this solved it for me.

6

Thanks a lot for your answer ! I like that it is a css trick, but unfortunately it does work only on desktop, because the “Buy with Apple Pay” button has a different class (and so on for different wallets I guess). In order to have a cross-platform fix, I came up with this little script at the end of the header instead :

Have a great day !

EDIT : finally I prefer your approach (the one of BSSCommerce-TA) beacause mine just above only work on first load page : if the user navigate and come back it does not work. I keep a combination of the two solutions to improve both aspect (consistency and cross-platformn)

1 Like