How to sell your products on ClickFunnels with Quaderno Checkout

Quaderno Checkout is an embeddable payment form for your ClickFunnels site. It works within your site seamlessly, allowing customers to pay in-place without being redirected away anywhere else. It looks pretty great, to boot!

Use Quaderno Checkout on your ClickFunnels site if you want to:

  • Add taxes on top of you prices depending on your customer's location.
  • Charge your customers via Stripe or Braintree.
  • Send beautiful receipts automatically.  
  • Automate your accounting by exporting all your reports to CSV files or Xero, or sharing them with your accountant.

Note: Quaderno Checkout does not support discount codes or the ClickFunnels affiliate program.

Embedding Checkout on ClickFunnels

To add the embed code to page elements in ClickFunnels:

1.  Create your custom Checkout form.

2. Copy the embed code that's generated:

<script src="https://checkout.quaderno.io/checkout.js"></script><button id="QuadernoCheckoutButton">Pay now</button><script>var handler=QuadernoCheckout.configure({key:"pk_test_PUzCU1nogJmZGesyUzET",locale:"en",color:"#4c7800",callback:function(data) { window.location = "/thank-you-page.html";}});document.querySelector("#QuadernoCheckoutButton").addEventListener("click",function(e){handler.open({gateway:"stripe",type:"charge",taxes:"excluded",country:"GB",item_code:"CODE",currency:"USD",amount:"999",});e.preventDefault();});</script>

3. Within your ClickFunnels account, open the page where you want to embed the Checkout form and click on Settings > Tracking Code. 

4. Paste the first  <script> section of the embed code into the Header Code field.

<script src="https://checkout.quaderno.io/checkout.js"></script>

5. Save your changes.

6. Click on Elements > Manage and add a Custom HTML / JS element where you want to embed the Checkout form.

7. Click open code editor and paste the button and the second <script> section in the page:

<button id="QuadernoCheckoutButton">Pay now</button><script>var handler=QuadernoCheckout.configure({key:"pk_test_PUzCU1nogJmZGesyUzET",locale:"en",color:"#4c7800",callback:function(data) { window.location = "";}});document.querySelector("#QuadernoCheckoutButton").addEventListener("click",function(e){handler.open({gateway:"stripe",type:"charge",taxes:"excluded",country:"DE",item_code:"###",currency:"USD",amount:"999",});e.preventDefault();});</script>

8. Save your changes. 

Since ClickFunnels disables JavaScript in its dashboard, you need to preview your page separately to see the Checkout form that you've added.