How to create "add to cart" button or action to use in all of my product page sections? (Dawn theme)

Shopify Discussion

Topic summary

Goal: Make buttons in various product page sections perform the same Add to Cart/Buy Now action as the main product section, instead of linking to cart and showing an empty cart.

Proposed approaches:

  • Quick workaround: Have secondary buttons trigger a click on the main buy/add button via onclick/script.
  • Render the theme’s buy-buttons snippet in other sections: {% render ‘buy-buttons’ %}.
  • Replicate the existing buy-buttons code and ensure buttons target the main product form using the HTML button form attribute (form=“”).
  • Fallback: Scroll to the primary buy buttons instead of duplicating them.

Alternative code:

  • Wrap the button inside a product form: {%- form ‘product’, product -%} … {%- endform -%}.
    • Use the correct product variable (e.g., card_product). Adds only the default variant; won’t update with variant changes (color/size).

Implementation notes:

  • Add code in a template/section or custom-liquid block, not in CSS.
  • Replace the existing redirecting button with the form/button code; adding code elsewhere won’t change behavior.

Caveats:

  • Multiple accelerated checkout buttons can cause issues.
  • Cart counts, mini-carts, or drawers may not auto-update.

Status: Guidance shared; no confirmed working implementation yet. Discussion ongoing.

Summarized with AI on December 22. AI used: gpt-5.
1

Hi, we are building our product page and have different sections with information about our product. We want all the buttons in all our sections to have the same action as the “buy now/add to cart” button in our product section. We can link all the other buttons to go to cart, but does not add the product item in this action. So when you click the button, you go to cart and says “Your cart is empty”. Our buttons must do the “add to cart” action so that when people click in the buttons, they are sent to the cart with the product added here. Same way the button for the product section works. Help please :slightly_smiling_face:

2

Hi @mics_1 :waving_hand: This is an advanced theme customization that varies by theme.

Roughly the cheapest trick is to just make buttons that when they are clicked what they do is click the actual buttons using an onclick attribute or script.

Or in some themes you may just be able to put {% rendner ‘buy-buttons’ %} in a custom-liquid section/block or setting.

Otherwise you need to replicate the theme existing buy-buttons code to render in the different sections making sure they use the main product forms id in the buttons form attribute if any.

There can also be issues with having multiple accelerate checkout buttons on the page that should be test for.

Alternative is to make the page scroll to show the primary buttons on click.

If you need this customization then contact me by my email for services.
Contact info in forum signature.
ALWAYS please provide context, examples: store url, theme name, post url(s) , or any further detail in ALL correspondence.

3

Hi @mics_1
Please wrap your button like this in a product form

{%- form 'product', product -%}

    

{%- endform -%}

Please make sure replace product with card_product or some other variable that is being used in theme for product on product cards

Please press Like and Mark Solution if you find it helpful.

Thanks!

4

Where exactly should i add this? I need to enter it in the css code correct?

5

No you enter that either into a file itself or a custom-liquid block/section/setting.

keeping in mind this is static and may redirect , so may not update when the variant changes, may not automatically work with things like cart-counts, mini-carts, cart-drawers etc etc etc

Good Luck.

6

hi yes we need help

7

Thanks, and what info should i put on the button link? should i leave it empty or link it to the product?

8

ive added the code as a new custom liquid in the sections folder but nothing has changed

9

Hi @mics_1
I guess, you have to add this code in place of buton that redirecting you to empty cart (As per your question details). and yes, it is just to add a default variant, it won’t update with variant change (color or size change).

Please press Like and Mark Solution if you find it helpful.

Thanks!