How to create a custom add to cart button for my theme?

Topic summary

A developer needed to create a custom \

Summarized with AI on November 24. AI used: claude-sonnet-4-5-20250929.

I am just trying to create an add to cart button to use on template and sections on my Shopify theme. Very simple.

Here is my code:

<form method="post" action="/cart/"
  <input name="id" value="1402808270917" type="hidden" />
  <input name="add" value="ORDER NOW" type="submit" />
</form>

Note: the value is the product id which I need to be able to hard code.

I’m not getting any errors, it’s just going to the cart page stating cart is empty. The weird thing is, if I have something in the cart already, it will add a duplicate of the product.

2 Likes

I’ve also tried to replace the hardcoded id with

{{ all_products['product-handle'].id }}

which successfuly pulls the id of the product I want to add a button for.

Figured out answer on my own, for others who come across this issue.

<form method="post" action="/cart/add">
  <input name="id" value="{{ product.variants.first.id }}" type="hidden" />
  <input name="add" value="ORDER NOW" type="submit" />
</form>
4 Likes

How can we remove hover effect from this customisation code any idea…