Setup Prebuilt

Learn how to setup Prebuilt to work with your website.

1. Download Dependencies

Start by downloading the prebuilt.min.css and prebuilt.min.js.

2. Transfer the files to your website

Transfer the files to your website using SFTP or SSH.  You will reference these files in step #3.

3. Reference the library files and add your configuration snippet

Reference the files from Step #2 in your HTML.  Then, login to the application.  Navigate to the Dashboard.  Under "Getting Started", click on the link titled "Javascript Initialization Snippet".  Paste that above your JS reference.  See example below.

<!DOCTYPE html>
<html lang="en" dir="ltr">

<head>

<!-- Prebuilt CSS --> <link type="text/css" href="path-from-step-2/prebuilt.min.css" rel="stylesheet">
</head> ... </body>

<!-- Prebuilt initialization snippet -->
<script>var prebuilt = prebuilt || {};prebuilt.data = {...};</script>

<!-- Prebuilt JS --> <script src="path-from-step-2/prebuilt.min.js"></script>
</html>

4. Create a product button or form and add it to your page

Create a button or form using the Prebuilt application.  When you are ready to add it to your page, click the <> icon next to the product button or form.  This provides you with a snippet of code to generate the button.

<button 
 data-id="XXXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXX" 
 data-type="subscribe"
 data-alternate-tax-rate="0" 
 data-description="Demo Subscription - $10/month"
 data-shipped="false" 
 data-plan="plan_fromstripe12345" 
 class="prebuilt-purchase-button" prebuilt-subscribe>Subscribe</button>

That's it!  Prebuilt will take care of the rest.  Need help? We are here for you. Get in touch using the form below.