Package Exports

checkout.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (checkout.js) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Checkout.js

Our checkout widget makes it possible to start taking pre-orders in minutes, and is quite customizable.

Preview

Checkout.js Image

Install

$ npm install checkout.js

Usage

Set the href of your button to #checkout.

<a class="btn" href="#checkout">Buy Now</a>

Configure the checkout widget however you'd like.

<script src="https://cdn.rawgit.com/crowdstart/checkout.js/v2.1.6/checkout.min.js"></script>
<script>
  // Create a new client for Crowdstart API.
  var api = new Crowdstart.API('eyJhbGciOiJIUzUxMiIsInR5cCI6IkpXVCJ9.eyJiaXQiOjI0LCJqdGkiOiJVMDc0RlU3MHVhWSIsInN1YiI6IkVxVEdveHA1dTMifQ.g_MqPv2s0DnyFdhkUMzYn9mtKaXNwmlEM14WcFq_s5Yd2eqH16TB9thxOdDE8ylcoBMgyI3eimSHJxGq7oj-EA')

  // Create default order, should match whatever the user is trying to pre-order
  var order = new Crowdstart.Order('usd',[
    new Crowdstart.ItemRef('84cRXBYs9jX7w', -1),
    new Crowdstart.ItemRef('doge-shirt', 100)
  ]);

  // Create default user (pre-populated in form fields)
  var user = new Crowdstart.User('joe@fan.com', 'Joe', 'Fan')

  // Social sharing settings
  var config = {
    facebook:   'suchtees',
    googlePlus: 'suchtees',
    twitter:    'suchtees',
  }

  // Customize theme
  Crowdstart.setTheme({
    borderRadius: 5,
  })

  // Instantiate widget, can be called multiple times, overriding order in widget.
  Crowdstart.Checkout('checkout', api, order, user, config);
</script>

Examples

You can find examples in the Github repo. You can also see it in action in the Crowdstart documentation.