The Partial.ly checkout button is a small bit of javascript you can use to embed a Partial.ly checkout button on your shopping cart, product landing, or any other page. The Partial.ly checkout button has many options to customize its appearance and behavior, detailed below.
partially checkout button

General setup

The general set up consists of an element to render the Partial.ly checkout button inside of, a javascript configuration object, and loading the Partial.ly checkout button script. Below is an example.

<div id="partiallyCheckoutBtn"></div>
<script>
document.partiallyButtonConfig = {
    offer: '<your offer id>',
    amount: 500.99,
    currency: 'USD',
    renderSelector: '#partiallyCheckoutBtn',
    meta: {
        items: [
            {
                id: 123,
                name: 'Sample product',
                quantity: 1,
                price: 500.99,
                total: 500.99,
                sku: 'samplesku',
                image: 'https://example.com/image.jpg'
            }
        ]
    }
};
(function() {
 var script = document.createElement('script');
 script.type = 'text/javascript';
 script.src = 'https://partial.ly/js/partially-checkout-button.js';
 script.async = true;
 document.head.appendChild(script);
})();
</script>

Configuration options

  • offer string the offer id to use when checking out. Use the integration tool for the offer you want to use in the Partial.ly merchant portal
  • amount double the total amount of the payment plan
  • currency string currency to use, defaults to USD, or the currency specified in the offer
  • language string language for partial.ly checkout interface; de, en, es, fr, pt, or it. Defaults to en
  • imageUrl string absolute url to an image to use when rendering the checkout button
  • returnUrl string absolute url for links in Partial.ly checkout to cancel checkout and return to the merchant's site
  • returnConfirmedUrl string absolute url for link to return to merchant's site from the payment plan confirmed page
  • renderSelector string css selector for the element to render checkout button inside of
  • quantitySelector string css selector for a quantity input element. When using the checkout button on a product landing page it will automatically adjust the payment plan amount when the quantity is changed
  • attachSelector string css selector for an element to attach to and automatically set the href element. Use this option to not render an image inside the checkout button and use your own custom html
  • meta object meta information about the plan, such as source and items. See meta object details below
  • customer object send default customer information
  • shopifyCart object automatically set the meta information based on a shopify cart object
  • shopifyProduct object automatically set the meta information based on a partially product object
  • shopifyVariant object automatically set the meta item variant information
  • woocommerceProduct object automatically set the meta information based on a woocommerce product. Not needed if using our Partial.ly payment plan plugin for woocommerce

Meta object options

  • source string the source of the payment plan, if integrating with another software, such as shopify or woocommerce
  • description string an optional description for the payment plan
  • items array array of line items, see below for details of the LineItem object. This is only necessary if integrating with a shopping cart platform, such as shopify or woocommerce
  • note string an optional note for the order
  • attributes object optional map of attributes for the order

LineItem object options

  • name string description of the item
  • price double price of item
  • quantity integer quantity
  • total double line item total
  • product_id string product id
  • variant_id string optional variant id
  • image string absolute url for item image
  • sku string product sku
  • weight double item weight
  • weight_units string weight units, g, kg, oz, or lbs
  • properties object optional map of configurable properties

Customer object options

  • email string preset the customer email address for checkout