Installation

You first need to create a Snipcart account to get started. It's forever free in Test mode.

To get started, you need to include our assets—a JavaScript and CSS file—in your codebase.

We suggest using the assets on our CDN directly.

1. Include our default stylesheet

<link rel="stylesheet" href="https://cdn.snipcart.com/themes/v3.0.8/default/snipcart.css" />

2. Include Snipcart on your site

Here, you can decide where you want Snipcart's JS shopping cart to be located in your website.

<div hidden id="snipcart" data-api-key="<your_public_api_key>"></div>
<script src="https://cdn.snipcart.com/themes/v3.0.8/default/snipcart.js"></script>

We highly recommend using the hidden attribute. Especially if you count on customizing our templates.

Our script file should always be included after div#snipcart.

Example

Here's an example of a basic setup with Snipcart installed properly.

<!DOCTYPE html>
<html>
  <head>
    <title>Hello world</title>
    <link rel="stylesheet" href="https://cdn.snipcart.com/themes/v3.0.8/default/snipcart.css" />
  </head>
  <body>
    <div class="content">
      Your site content here
    </div>

    <div hidden id="snipcart" data-api-key="<your_public_api_key>"></div>
    <script src="https://cdn.snipcart.com/themes/v3.0.8/default/snipcart.js"></script>
  </body>
</html>

Next up

Now that you've installed Snipcart, you can start adding products to your site.