-
-
Notifications
You must be signed in to change notification settings - Fork 0
/
stripe.html
47 lines (41 loc) · 1.79 KB
/
stripe.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!-- Load Stripe.js on your website. -->
<script src="https://js.stripe.com/v3"></script>
$ <input type="text" size="2" id="quantity" value="10"> <!-- ADDED LINE - YOU CAN CHANGE CURRENCY AND DEFAULT AMOUNT -->
<!-- Create a button that your customers click to complete their purchase. Customize the styling to suit your branding. -->
<button
style="background-color:#6772E5;color:#FFF;padding:8px 12px;border:0;border-radius:4px;font-size:1em"
id="checkout-button-sku_FQkGdBj6c3phGm"
role="link"
>
Checkout
</button>
<div id="error-message"></div>
<script>
(function() {
var stripe = Stripe('pk_test_up7XBxmt0W2fKgzk1SxfQymR');
var quantity = document.getElementById('quantity'); // ADDED LINE
var checkoutButton = document.getElementById('checkout-button-sku_FQkGdBj6c3phGm');
checkoutButton.addEventListener('click', function () {
// When the customer clicks on the button, redirect
// them to Checkout.
stripe.redirectToCheckout({
items: [{sku: 'sku_FQkGdBj6c3phGm', quantity: quantity}], // REPLACED 1 WITH QUANTITY
// Do not rely on the redirect to the successUrl for fulfilling
// purchases, customers may not always reach the success_url after
// a successful payment.
// Instead use one of the strategies described in
// https://stripe.com/docs/payments/checkout/fulfillment
successUrl: 'https://your-website.com/success',
cancelUrl: 'https://your-website.com/canceled',
})
.then(function (result) {
if (result.error) {
// If `redirectToCheckout` fails due to a browser or network
// error, display the localized error message to your customer.
var displayError = document.getElementById('error-message');
displayError.textContent = result.error.message;
}
});
});
})();
</script>