BUY button ONLY

Hello,

I am new to Snipcart. I have built a single page website listing the products I want to sell on it. The design of this webpage is as I want it to look. I am looking to add shopping cart & subscription purchase feature to the website. it’s great to see that Snipcart provides this feature. However, the challenge I have is if I am to us snipcart, I have to add an entire button as shown below which changes the entire product look & feel. What I want is to add JUST the buy functionality. Is this possible?


Add to cart

Hi @rrk1234 ,

it doesn’t need to be a button - it can be any HTML element, like an a tag or a div.
All it needs is a snipcart-add-item class added to the element.

An example for a tag:

<a class="snipcart-add-item" href="#"
  data-item-id="starry-night"
  data-item-price="79.99"
  data-item-url="/paintings/starry-night"
  data-item-description="High-quality replica of The Starry Night by the Dutch post-impressionist painter Vincent van Gogh."
  data-item-image="/assets/images/starry-night.jpg"
  data-item-name="The Starry Night">
  Add to cart
</a>

Hi @rrk1234,

If I’m understanding correctly, you want to go directly to the checkout screen after a customer has clicked on a buy button?

If that’s the case, we don’t have anything built-in for this, but you could change the behavior of the cart to not show the cart after an item is added and use JavaScript to navigate directly to the checkout URL (/#/checkout) after an item.added event.

Cheers!

Hello,

Many thanks for the answers. WHat I am trying to achieve is to add the functionality of add to cart when the user clicks the buy button. I am not wanting to change the existing look & feel of the webpage.

The example from snip cart where creating a div or hyperlink with so many properties including description of the product etc will change the look & feel of my existing website. I don’t want those. I just want the add to cart functionality on the buy button. Something like what Ecwid provides. I need my existing BUY button to add items to cart

Please let me know if this is something I can do with snipcart.

Gotcha @rrk1234,

In that case, you can simply add snipcart-add-item class to any of your pre-existing buy button (by default, we don’t apply any styles to this class) as well as the required data-item attributes.

Let me know if that helps!