<div id="partiallyCartButtonContainer"></div>
<script>

var items = {{{json cart.items}}};

var eligibleProductIds = [120, 121, 122, 123]; 

var eligibleItemExists = items.some(item =>
  eligibleProductIds.includes(item.product_id)
);

if (eligibleItemExists) {
  document.partiallyButtonConfig = {
    offer: 'OFFER-ID',  
    amount: '{{cart.grand_total.value}}',
    returnUrl: '{{settings.secure_base_url}}/cart.php',

    cssButton: true,
    cssButtonText: 'Purchase with',
    cssButtonShowLogo: true,
    cssButtonLogoType: 'full',
    cssButtonLogoPlacement: 'after',

    renderSelector: '#partiallyCartButtonContainer',

    bigcommerceCartItems: items
  };

  (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);
  })();

} else {
  var container = document.getElementById('partiallyCartButtonContainer');
  if (container) container.style.display = 'none';
}
</script>

<div id="partiallyCartButtonContainer"></div>
<script>

var offerId = 'DEFAULT-OFFER-ID';

{{#any cart.items product_id=PRODUCT-ID}}
offerId = 'PRODUCT-OFFER-ID';
{{/any}}

document.partiallyButtonConfig = {
     offer: offerId,
     amount: '{{cart.grand_total.value}}',
     returnUrl: '{{settings.secure_base_url}}/cart.php',

     cssButton: true,
     cssButtonText: 'Purchase with',

     cssButtonShowLogo: true,
     cssButtonLogoType: 'full',
     cssButtonLogoPlacement: 'after',

     renderSelector: '#partiallyCartButtonContainer',

    bigcommerceCartItems: {{{json cart.items}}}
};
(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>

<div id="partiallyCartButtonContainer"></div>
<script>

var items = {{{json cart.items}}};
var targetFieldName  = "CUSTOM-FIELD-NAME";
var targetFieldValue = "CUSTOM-FIELD-VALUE";

var eligibleItemExists = items.some(item =>
  (item.custom_fields || []).some(field =>
    field.name === targetFieldName &&
    field.value === targetFieldValue
  )
);

if (eligibleItemExists) {
  document.partiallyButtonConfig = {
    offer: 'OFFER-ID',
    amount: '{{cart.grand_total.value}}',
    returnUrl: '{{settings.secure_base_url}}/cart.php',

    cssButton: true,
    cssButtonText: 'Purchase with',
    cssButtonShowLogo: true,
    cssButtonLogoType: 'full',
    cssButtonLogoPlacement: 'after',

    renderSelector: '#partiallyCartButtonContainer',

    bigcommerceCartItems: items
  };

  (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);
  })();

} else {
  var c = document.getElementById('partiallyCartButtonContainer');
  if (c) c.style.display = 'none';
}

</script>

<div id="partiallyCartButtonContainer"></div>
<script>

var offerId = 'DEFAULT-OFFER-ID';
var items = {{{json cart.items}}};

if (items.some(item => 
  item.custom_fields && 
  item.custom_fields.some(f => f.name === 'CUSTOM-FIELD-NAME' && f.value === 'CUSTOM-FIELD-VALUE')
)) {
  offerId = 'CUSTOM-FIELD-OFFER-ID';
}

document.partiallyButtonConfig = {
  offer: offerId,
  amount: '{{cart.grand_total.value}}',
  returnUrl: '{{settings.secure_base_url}}/cart.php',

  cssButton: true,
  cssButtonText: 'Purchase with',

  cssButtonShowLogo: true,
  cssButtonLogoType: 'full',
  cssButtonLogoPlacement: 'after',

  renderSelector: '#partiallyCartButtonContainer',

  bigcommerceCartItems: items
};

(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>

If you are on an automatic schedule, you will recieve an email on the day of processing to confirm the crypto payment.

To make payments manually, log into partial.ly/login and click the 'make a payment' link next to your plan.

You will see the option to use your crypto wallet if it was used to open the plan.

• Generating a code snippet with your Partial.ly account.
• Adding the code snippet to your Shopify theme.
• Creating 2 Zapier Pro zaps.

* If you are a merchant who was using our Shopify integration prior to this change, this option allows you to keep your Partial.ly checkout buttons as is. You only need to create the Zapier Pro zaps to create the Shopify order.

With this method, a snippet of code is added to your Shopify theme. This code will generate a Partial.ly checkout button for your store. The first Zapier zap will listen for plan_opened webhook events from Partial.ly and create an associated Shopify order. The second Zapier zap will listen for plan_paid webhooks events from Partial.ly and mark the Shopify order as paid.

• Ability to keep/create Partial.ly script customizations.
• Place Partial.ly directly on your product pages.

• Can only be placed on cart and/or product pages.
• Not compatible with Shopify checkout, so limitations on shipping and taxes, which must be set up within your Partial.ly account.
  (If you need the features of Shopify Checkout, see our other integration option to add Partial.ly as a Manual Payment Method to your Shopify Checkout page).
• Won't work with Shopify discounts.
• Limitations on inventory management: You can set up the Zapier zap to obey your inventory rules when creating the Shopify order. However, Partial.ly cannot follow your inventory rules. This means the customer may be able to open the plan if there is no stock, but the Shopify order will fail. We recommend "hiding" out of stock products to prevent this.

• Log into your Partial.ly account at https://partial.ly/login.
• Go to the integration tool of your offer and select from the dropdown menu the option to generate code for the cart or product pages.

* New? Learn about setting up your account at https://support.partial.ly/shopify-faq/

Example Image:

Learn more here: https://support.partial.ly/shopify-add-code/

* This option will only work if the order was created with financial status "pending" or "authorized". Be sure to review your prior zap has this.

Image of Zap

Create and Test Trigger

• For the Trigger, select Partial.ly (0.1.11).
• For the Event, select the Payment Plan Paid.
• Connect/Select your Partial.ly account.
• Click Continue and Test the Trigger.

Image Example

Action #1: Filter for Shopify

Similar to the first Zap, from the events list, select Filter.

We want to filter for payment plans that created a Shopify order:

• For choose field, select the Integration field.
• For choose condition, select the (Text) Exactly matches.
• In the next input labeled 'enter text', enter shopify.

Image Example

Action #2: Get Shopify Order ID

Set up the Action:

• For the Action, select Shopify.
• For Event, select Get Order ID.
• Select/connect your Shopify account.
• Click Continue.

Image Example

Configure the Action:

• For Order ID, select Integration Id from the Partial.ly webhook data
• Leave the rest of the data on default and Continue

Image Example

Test the step if you need to pull data from Shopify, or skip the test and Continue

Actions #3: Filter for Financial Status

We now need to filter for Shopify orders that have a pending financial status.

• For choose field, select the Display Financial Status field from Shopify.
• For choose condition, select the (Text) Exactly matches.
• In the next input labeled 'enter text', enter pending.

Image Example

Action #4: Marking Order As Paid

Set up the Action:

• For the Action, select Shopify.
• For Event, select Mark Order as Paid.
• Select/connect your Shopify account.
• Click Continue.

Image Example

Configure the Action:

For Order, click the three dots and select Custom.

Image Example

Map to the Integration ID from the Partial.ly webhook.

Image Example

• Adding a manual payment method to Shopify checkout.
• Configuring it in your Partial.ly account.
• Creating 2 Zapier Pro zaps.

The Zapier zap will listen for new Shopify orders using the manual payment method. The zap will then trigger Partial.ly to create a new payment plan from the order and email a payment plan request to the customer.

Partial.ly will be located directly on Shopify checkout, allowing the full benefits of Shopify rules and checkout, including:

• Shipping
• Taxes
• Discounts
• Inventory Management
• Draft order capabilities (would need to create a zap)

• The Shopify order is opened while the plan is emailed to the customer.
• The customer must open the plan from their email to complete the order. You may need to follow up with them if it is not opened in a certain amount of time.
• Restrictions on offer customizations and limitations.
• If you wish to limit when Partial.ly is available at checkout, payment methods can be dynamically disabled for Shopify Plus merchants. If you are not a Shopify Plus merchant, you may be able to find a third party app that can do this.

* If this option does not work for you, please check out our other integration option: Adding the Partial.ly checkout button to your product pages and/or cart page

Image Example:

• Log into your Shopify account at https://www.shopify.com/store-login
• Go to Settings > Payments > Manual Payment Methods.
• Click + Manual Payment Method.
• Select Create Customer Payment Method and fill out the following:
• Custom Payment Method Name (You will need this later.)
• Additional Details
• Payment Instructions
• Click Activate

Image Example:

How the Customer Sees This Info:

• The payment method name will be shown to the customer on the Shopify checkout page.
• The additional details text will be shown when they select the manual payment method.

Image Example:

• The payment instructions text will be show on the order confirmation page:

Image Example:

Reminder: It is recommended to let the customer know their order will not be complete until the payment plan is opened. They will be emailed the payment plan and can also open it from their customer account at partial.ly/login under Other Payment Plans.

* New? Learn about setting up your account at https://support.partial.ly/shopify-faq/

• Log into partial.ly/login.
• Go to Settings > Integrations > Shopify Settings.
• In the payment method name field, enter the exact name of the payment method you configured in Shopify (important it must be exactly the same, or else the plan will not be created).
• Select the offer to apply to payment plans created from Shopify (currently, this cannot be dynamically changed but we are testing improvements, please reach out to support for updates).

Image Example:

* Remember, this will create and email the plan to the customer. The customer must open the plan from their email to complete the order.

Image of Zap:

Create the Trigger:

• For the trigger, select Shopify
• For event, select New Order
• Connect/Select your Shopify account
• Click Continue

Image Example:

Create Action:

From the event list, select Custom > Webhooks.

Image Example:

Select Custom Request for the event and click Continue.

Image Example:

Configure Custom Request:

Image Example:

• For method, select the POST option.
• For the URL, enter https://partial.ly/api/payment_plan/from_shopify (if you are testing with our demo server, enter https://demo.partial.ly/api/payment_plan/from_shopify).
• For Data Pass-Through?, select True.
• Leave the Data field empty.
• For Unflatten, select No.
• Leave the Basic Auth field empty.
• For the Headers section:
• Box 1: Enter Accept, then application/json
• Box 2: Enter Content-Type, then application/json
• Box 3: Enter Authorization, then Bearer , making sure to replace with your Partial.ly API key (important, it must be “Bearer” then a space, followed by the API key). You can find your Partial.ly API key within your Partial.ly account at partial.ly/login under Settings > General >API Key.

* click + Add value set to add additional boxes.

Image Example:

* This option will only work if the order was created with financial status "pending" or "authorized".

Image of Zap

Create and Test Trigger

• For the Trigger, select Partial.ly (0.1.11).
• For the Event, select the Payment Plan Paid.
• Connect/Select your Partial.ly account.
• Click Continue and Test the Trigger.

Image Example

Action #1: Filter for Shopify

Similar to the first Zap, from the events list, select Filter.

We want to filter for payment plans that created a Shopify order:

• For choose field, select the Integration field.
• For choose condition, select the (Text) Exactly matches.
• In the next input labeled 'enter text', enter shopify.

Image Example

Action #2: Get Shopify Order ID

Set up the Action:

• For the Action, select Shopify.
• For Event, select Get Order ID.
• Select/connect your Shopify account.
• Click Continue.

Image Example

Configure the Action:

• For Order ID, select Integration Id from the Partial.ly webhook data
• Leave the rest of the data on default and Continue

Image Example

Test the step if you need to pull data from Shopify, or skip the test and Continue

Actions #3: Filter for Financial Status

We now need to filter for Shopify orders that have a financial status of pending or authorzied.

• For choose field, select the Display Financial Status field from Shopify.
• For choose condition, select the (Text) Exactly matches.
• In the next input labeled 'enter text', and enter the status you assigned your Shopify orders opened with Partial.ly( pending or authorized.)

Image Example

Action #4: Marking Order As Paid

Set up the Action:

• For the Action, select Shopify.
• For Event, select Mark Order as Paid.
• Select/connect your Shopify account.
• Click Continue.

Image Example

Configure the Action:

For Order, click the three dots and select Custom.

Image Example

Map to the Integration ID from the Partial.ly webhook.

Image Example

Log into your shopify admin and go to your theme for editing under online store > themes > actions > edit code.

Use the search box to locate the liquid file that contains your cart info. There may be several files used for your cart.

You will want to locate the file that contains the code for your additional checkout buttons. This can be the cart.liquid file, cart-template.liquid, main-cart-footer.liquid, etc. Depending on your theme, the file may be named something else. You can use the find feature to search the document (ex. Ctrl-F).

Once you locate where in the template you want the Partial.ly button to appear (typically above the code for additional checkout buttons), paste the code from the integration tool. Use the preview feature of your Shopify theme to view the update.

Image Example

Similar to how you add Partial.ly to your cart page, locate the liquid file that contains your product info. There may be several files used for your product pages. You will want to locate the file that contains the code for your 'add to cart' button. This can be the product-template.liquid file, main-product.liquid file, product-form.liquid file, etc. Depending on your theme, the file may be named something else.

Once you locate where in the template you want the Partial.ly button to appear (typically below the code for the add to cart button), paste the code from the integration tool. Use the preview feature of your Shopify theme to view the update and adjust as needed.

Image Example

*Partial.ly may not work on product pages with variables (ex. size, color, date select, etc.) If your products have variables, we recommend you only use Partial.ly on the cart page to ensure customer choices are saved. You can always test with our demo site at https://demo.partial.ly

Yes, when in the integration tool, there will be various options to configure the checkout button, such as color and editing the text.

Your changes will automatically update the code. Once you have your configurations set, you can copy and paste the code into your Shopify theme.

Yes, when in the integration tool, you can set a minimum order requirement by selecting 'Only display with minimum amount' and entering a value. The generated code will update with this new info. If you already installed the button code onto your theme, you will need to copy and paste the updated code.

The Partial.ly widget is a small bit of javascript code that you place on your product pages to let customers know they can purchase with a Partial.ly payment plan. The widget allows customers to interactively see the payment plan options available to them. You can read more about the Partial.ly widget here: About the Partial.ly Widget.

Image Example

Learn more at: Partial.ly Widget for Shopify

Yes. Partial.ly will appear in English by default. If you need Partial.ly checkout to appear in another language, simply add the following line of code to the Partial.ly code snippet:

language: 'fr',

Use the abbreviation of the language you need. For example, fr is for French.

var partiallyButtonConfig = {
     offer: 'abc123-def456-ghi789-jkl1011',
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',
  language:'fr',

Yes. First, ensure that multi-currency is configured correctly on your shop: multiple currency setup

Once confirmed, you can add the following line of code to your Partial.ly script:

currency: '{{cart.currency.iso_code}}',

document.partiallyButtonConfig = {
     offer: 'abc123-def456-ghi789-jkl1011',
     returnUrl: '{{shop.url}}/cart',
     returnConfirmedUrl: '{{shop.url}}/cart/clear',
     currency: '{{cart.currency.iso_code}}',

For details on configuring the checkout button, please see our article on the Partial.ly Checkout Button: Partial.ly Checkout Button

For more on limiting Partial.ly, you can view samples of custom code in the following articles:

Samples of Custom Code for Shopify Cart

Samples of Custom Code for Shopify Product Pages