Snipcart vs. Shopify Buy Button: E-Commerce Review

In 2015, our friends at Shopify released a cool new product called the Shopify Buy Button. Its aim was to allow new and existing users to enable e-commerce on any website.

As you may know, injecting products and a customizable shopping cart into any website is one of the core value proposition we offer at Snipcart. So it's no surprise that, since Shopify's button release, many merchants and developers have asked us:

How is Snipcart different from Shopify's Buy Button?

In this post, we'll try our best to provide a clear answer to this question. Let's jump right into it.

What is the Shopify Buy Button?

The Buy Button drifts a little away from Shopify's core product orientation, which allows non-technical users to build their online store easily. While the latter involves a fully hosted online store, the former focuses on embeddable products (generated code copy & paste) and a redirected, hosted checkout. Like many Shopify products—POS, Facebook Shop, Twitter Buy Now—its mission is to diversify sales channels for merchants.

The process is fairly simple: you sign up for an account, you create a product in the dashboard, Shopify generates an embeddable snippet of code for it, and you insert the snippet on any site/blog/web app you want. You can also put this button in emails if you'd like.

Once you've included the products on your site, you can easily enable a simple shopping cart on it through the Shopify dashboard. Here's a decent look at the Buy Button + cart in action:

snipcart-shopify-buy-button-ux

Notice that when it's time for checkout, a new checkout window pops up for the customer. We'll discuss this later.

All of your e-commerce operations are then managed directly through Shopify's comprehensive dashboard.

What is Snipcart?

snipcart-shopify-buy-button-snip-ux

See the live demo for this modal cart customization.

Snipcart is a shopping cart platform that can be integrated into any website with simple HTML and JavaScript. It offers a fully customizable frontend shopping cart, webhooks & APIs, and a full merchant back office to manage e-commerce operations. Read more about Snipcart's core features and benefits.

How much do they cost?

Shopify Buy Button pricing

The Buy Button is available on Shopify's smallest plan, the Lite plan.

With the Lite plan, for online transactions, you pay:

  • A flat fee of 9$/month
  • A transaction fee of 2.9% + 30 cents/transaction (if you're using Shopify Payments, fees stop here)
  • An additional fee of 2%/transaction (if you're using any other payment gateway—decreases with higher paid plans)

We're comparing the Shopify Buy Button use case with Snipcart here. So we'll only discuss the features available for the Lite plan, assuming the user isn't interested in using Shopify to host a full online store. Rather, he or she would already have a website to add e-commerce on.

Snipcart pricing

2% + payment gateway fees (2.9% + 30 cents)/transaction

With Snipcart's standard pricing, you pay 2% of monthly transactions, plus payment gateway fees. If, say, you were using Stripe as a gateway for your Snipcart, your total pricing would be: 4.9% + 30 cents / transaction.

Note: The 2% can't go under 10$ per month. We also offer custom-tailored monthly pricing for merchants with high-volume & seasonal sales. See our pricing page for details.

Use cases handled by both e-commerce solutions

The Buy Button and Snipcart share many resemblances. As we already said, each of them is used to add products and a shopping cart to an existing site. With both of them, you:

  • Create and handle your own website (design/development/hosting)
  • Get a store up and running quickly
  • Get a hosted merchant dashboard to manage e-commerce operations
  • Sell products all over the world
  • Process secure online transactions
  • Can offer customer accounts
  • Offer a responsive shopping experience

Overview of important distinctions

Advantages of Shopify's vast underlying ecosystem

Thanks to a free Shopify app, it's super easy to set up and sell digital goods with the Buy Button. Digital files can be uploaded rapidly in the dashboard. Snipcart, on the other hand, would require the use of webhooks to accomplish that.

The Lite plan on Shopify also gives you access to other cool sales channels. Merchants looking to sell products in real life can use the POS app, and a Facebook store for social media. As of right now, Snipcart does not support these scenarios. It's honestly something we're interested in experimenting with. But in our 3+ years of growing our business, we've never had user requests and suggestions regarding these. And since we're a small team, we need to prioritize popular and key feature development beforehand.

And of course, thanks to Shopify's impressive workforce, you get 24/7 phone, chat & email support.

Native e-commerce features for Snipcart

The Buy Button doesn't offer advanced discount scenarios out of the box (alternate pricing lists, specific product and order-related triggers). Snipcart offers these varied discounts options directly in the merchant dashboard. However, there are a few paid apps on the Shopify marketplace that can enhance your store's discounts capabilities.

Unlike Snipcart, the Buy Button doesn't handle native subscriptions and recurring payments. You'll need to purchase apps (20$/month) to help you do that.

With Snipcart, you have direct access to a list of abandoned carts on your store. Through your merchant dashboard, you can contact these customers and remind them about their uncompleted orders, offer them promotions, etc. Shopify's Buy Button (on the Lite plan) doesn't offer cart abandonment recovery. You'd need to select a bigger monthly plan to access this feature. The exact same thing goes for real time shipping estimates: Snipcart offers them out of the box, and Shopify offers them only on their Advanced Shopify plan (299$/mo).

While Shopify's Buy Button can offer some cool e-commerce features through more expensive pricing plans or their app marketplace (a dynamic similar to WooCommerce here), Snipcart offers the ones listed above out of the box for standard or custom pricing.

An important difference in shopping UX

While conceptually similar, both solutions are technically different. Take the products, or buy buttons for instance. The Buy Button provides you an embeddable snippet of code over which you have little control:

snipcart-shopify-buy-button-code

As for Snipcart, it allows you to define product attributes on any HTML element on your code (could be a button, a text link, an image, etc.). In this sense, you're in charge of displaying product and product pages however you'd like!

The Shopify Buy Button comes with a simple shopping cart, as we've seen in the .gif earlier. However, the real checkout process is separated from the cart itself. When a customer hits the "checkout" button, a new window pops up, prompting a different URL than the merchant's site. There's definitely an important clash in the user experience here.

Snipcart, on the other hand, handles the whole shopping experience (from adding items to the cart to completing a credit card transaction) directly on the merchant's site. And since developers can customize Snipcart's look and feel however they want, the checkout steps still feel like a part of one seamless browsing and buying experience.

Note: Our modal shopping cart project is open source on GitHub. We're betting developers familiar with Gulp & Sass will enjoy the frontend customization workflow we put forward!

Here's an example of an advanced Snipcart customization:

snipcart-shopify-buy-button-advanced-snip-customization

Now there is a certain amount of customization for Shopify's embed cart that comes with the Buy Button. But it's limited compared to what you can achieve with Snipcart. However, it's only fair to mention that Shopify has recently released a Buy JS SDK, allowing a bit more on-site customization for developers. Again, though, the checkout part remains hosted on the Shopify URL we showed earlier.

There's a notion of customization, control and developer freedom that's more present with Snipcart. It's a pattern that shows up in many of our product comparisons, like this one with Stripe Checkout for instance.

Conclusion

The Buy Button, like Shopify's other products, is indeed a quality product. Much like Snipcart, it offers lots of value when you're using it to fast track e-commerce implementation and customization on your own website. If you're adamant on selling through a POS + social media; it might be a very cool fit for you. And it is easier to use than Snipcart for non-technical folks; that's for sure. It's perfectly fine by us: we've always tried to remain as developer-centric as possible.

So it's safe to say that the biggest difference here is the higher level of shopping cart customization Snipcart offers. This, and the fact that our solution keeps the whole checkout process on-site, in the same environment.

If you want to push the Buy Button's e-commerce power further, you'll either need to upgrade your Shopify plan to a higher fee, or purchase apps in their marketplace. If you want to do the same with Snipcart and set up deeper integration with external systems, you'll need to write a few lines of code and use webhooks!

At this point, what you prefer is up to you. :)


I do hope this post puts in a clearer light the differences between Shopify's Buy Button and Snipcart. If you enjoyed it and found it valuable, take a second to share it on Twitter. If you believe I've missed some key points, by all means, let me know! We'd also love to know your thoughts and experiences with either Snipcart or the Buy Button in the comments.

Suggested posts: