How can I customize dynamic Buy Now buttons in product-template.liquid?

Technical Q&A

Topic summary

A developer seeks to customize the dynamic Buy Now button ({{ form | payment_button }}) in Shopify’s Debut theme to display separate buttons for Add to Cart, Buy Now (direct checkout), PayPal, and More Payment Options.

Key Points:

  • The {{ form | payment_button }} code cannot be directly edited as it auto-renders based on payment settings
  • Solution involves creating a custom Buy Now button that redirects to checkout

Resolution:
LitExtension provided working code to add to product-template.liquid that replaces the payment_button filter with custom HTML/Liquid markup. The code includes:

  • Standard Add to Cart button
  • Custom Buy Now button with direct checkout redirect
  • PayPal and additional payment option buttons

The original poster successfully implemented the solution. A follow-up question asks whether this customization can be done programmatically through a Shopify app, which remains unanswered.

Summarized with AI on October 25. AI used: claude-sonnet-4-5-20250929.
1

I would like to edit the code inside here: {{ form | payment_button }} found in the product-template.liquid in the sections folder of debut.

My goal is to have an Add to Cart Button, Buy Now Button (which takes you straight to checkout), a Paypal button (always not dynamic) and text button saying More Payment Options .
I can’t seem to find a way to edit this {{ form | payment_button }} code

Another solution would be making my own Buy Now Button that takes you straight to checkout however I can figure out how to do this either

Any help in a solution would be great!
I want to go from the left image to the right

Untitled.png
Untitled.png1636×562 194 KB

2

Hi @timmycodes88 ,

You cannot edit the code at ‘{{ form | payment_button }}’, the code is rendered automatically according to your payment settings.

So you can just change the payment settings, let it support only PayPal, or customize the button to go straight to the checkout page like your suggestion.

Hope it is clear to you.

3

Is it possible that I can code a button that is similar to the buy now
button seen in the customizer. I don’t understand Shopify’s JS yet and
can’t find a Buy Now Button solution online

I feel like it has to do with a form to post the product and a redirect to
checkout

Thanks

4

Hi @timmycodes88 ,

You can totally add code to show buy now. What theme are you using? Please send me the theme name, I will help you check it.

5

Yes simply Debut!

Thank you Lit!!

6

Hi @timmycodes88 ,

Please go to product-template.liquid file, find ‘payment_button’ and change code here:

before
before993×523 40.4 KB

after
after1040×718 54.5 KB

Code:

Hope it helps!

1 Like
7

So grateful, I was able to implement exactly what I wanted!!

Thank you LitExtension!!

1 Like
8

Hey, can I customize this file programmatically? Is the store owner allowed to do this through a shopify app?