Partial.ly + Shopify: Checkout Script on Cart and/or Product Pages

by Michelle Moore

We recently made major changes to our Shopify integration. Merchants can install Partial.ly in 1 of 2 ways, both of which require a Zapier account.

Option #1: Add Partial.ly directly to your Shopify checkout page via Manual Payment Method. Learn more here: Partial.ly + Shopify: Manual Payment Method

Option #2 (This Option): Add Partial.ly directly to your product pages and/or cart page by adding a snippet of code to your Shopify theme. Learn more below.

For more FAQs on this update, please see see the following article: Shopify FAQs

This method involves:

  • Generating a code snippet with your Partial.ly account.
  • Adding the code snippet to your Shopify theme.
  • Creating 2 Zapier zaps with 2 actions each: One zap for creating the Shopify order, and one zap for marking the Shopify order as paid when the plan is paid in full.

How it works:

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

Benefits:

  • Keep Partial.ly script customizations.

Considerations:

  • Can only be placed on cart and/or product pages.
  • Not compatible with Shopify checkout (see other option), so limitations on shipping and taxes which must be set up within your Partial.ly account.
  • 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.

Set Up Instructions

Instructions include 3 parts:

  1. Generating the Snippet of Code within your Partial.ly Account.
  2. Adding the Code Snippet to your Shopify theme.
  3. Setting up the Zapier Zap with 2 Actions.

#1. Generating the Snippet of Code

  1. Log into your Partial.ly account at https://partial.ly/login.
  2. Create an offer.
  3. 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.

#2. Add Code Snippet to your Shopify theme

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

#3. Create the first Zapier Zap for creating the Shopify order

You can Install the Partial.ly zapier app from https://zapier.com/developer/public-invite/8510/a3dd1887e4eae5c893343d75981e8246/.

If already installed, make sure the latest version is installed (0.1.10).

Once in your Zapier account, click Create.

The Trigger:

  1. For the trigger, select Partial.ly.
  2. For the Event, select the Payment Plan Opened.
  3. Connect/Select your Partial.ly account. If connecting a new account, enter your Partial.ly API key. You can locate your Partial.ly API Key within your Partial.ly account under Settings > General > API Key.

*If you are testing on our demo server, from the Server environment dropdown, select demo.partial.ly. Otherwise you can leave the server environment on the default partial.ly.

Click Continue

Testing the Trigger:

  1. Click the Test trigger button to load test data. This will load some payment plans from your account, if you have any.
  2. Select a payment plan, then click the Continue with selected record option.

Setting Up the First Action:

From the events list, select Filter.

Filter for Shopify plans:

  • We want to filter on payment plans that have come from Shopify. To do this, in the first field labeled choose field. This will open a pop up with options. From the previous steps tab, selected by default, select the Integration field. There are a lot of fields (all the payment plan fields), so entering integration into the search field will narrow the results.
  • From the choose condition dropdown select the (Text) Exactly matches option.
  • In the next input labeled enter text, enter shopify,
  • Click +and to create another filter.

Filter for new plans:

  • For this second filter, we also want to make sure only newly opened plans create a Shopify order. For choose field, select is Reopened.
  • For choose condition, select (Boolean) is false.
  • then click continue.
  • This will test the filter from your test data. After the test is done, click continue again

Set Up the Second Action:

  1. For the action, select Shopify.
  2. For Events, select Create Order
  3. Connect/Select your Shopify account
  4. Click Continue

Configure the Second Action

Next we will need to configure all the fields sent to Shopify to create an order, most of which will be mapped from the Partial.ly plan_opened webhook.

  • Email: In the email field, either click the plus button or click the field then press the / key. In the pop up for data from previous steps, scroll to or search for customer email, then click it.

Line Items:

  • Product: Under line items, next to product, click the 3 dots next to the select and choose the custom option to enter a custom value. Then, in the insert data for Product popup, select the line items integration id field.
  • Product Variant: For product variant, click the 3 dots next to the dropdown and choose custom to enter a custom value. From the pop to insert data for product variant, click the Payment plan opened in Partial.ly, then scroll to or search for the line items variant id.
  • SKU: For the SKU field, map to the line items sku field from the Partial.ly webhook data.
  • Product Quantity: For the Product Quantity field, map to the line items quantity field from the Partial.ly webhook data
  • Product Title: For the Product Title field, map to the line items description field from the Partial.ly webhook
  • Product Price: For the Product Price field, marp to the line items amount from the Partial.ly webhook.

Tax Lines ( if using Partial.ly Tax Settings):

  • Title: For the title field under tax lines, map to the Tax Lines Description from the Partial.ly webhook.
  • Price: For the price field under tax lines, map to the Tax Lines Amount from the Partial.ly webhook.

Shipping Address:

  • Shipping Address - First Name: map to the Customer First Name field from the Partially webhook data
  • Shipping Address - Last Name: map to the Customer Last Name field from the Partially webhook data
  • Shipping Address - Phone: map to the Customer Phone field from the Partially webhook data (optional, only if collecting phone numbers at checkout is enabled in Partially settings)
  • Shipping Address - Address: map to the ShiptoAddress field from the Partially webhook data
  • Shipping Address - Address cont':  map to the Shipto Address 2 field from the Partially webhook data
  • Shipping Address - City:, map to the Shipto City field from the Partially webhook data
  • Shipping Address -  Country Code: map to the Shipto Country field from the Partially webhook data
  • Shipping Address – State/Provide/Region Code: map to the Shipto State field from the Partially webhook data
  • Shipping Address – Postal/Zip code: map to the Shipto Postal Code field from the Partially webhook data

Shipping Lines (if using Partial.ly Shipping Settings):

  • Title: For the title field under shipping lines, map to the Shipping Lines Description from the Partial.ly webhook.
  • Price: For the price field under shipping lines, map to the Shipping Lines Amount from the Partial.ly webhook.

Configure any other optional fields you want for how you'd like your order to be created, such as Note, Send Receipt, Send Fulfillment Receipt, Location, Inventory Behaviour, Financial Status, Fulfillment Status, or Source Name.

For example, if you want the Partial.ly payment plan number to appear on the Shopify order, you can add it as a note, or additional detail:

Publish

  1. Click Continue to go to the test page. You can only test if you created a  a test order in Shopify.If not, you can click Skip test.
  2. Click the Publish button to activate the zap.

#4. Create the second Zapier Zap to mark Shopify order as paid

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

The Trigger:

  1. For the trigger, select Partial.ly (0.1.10).
  2. For the Event, select the Payment Plan Paid.
  3. Connect/Select your Partial.ly account.
  4. Click Continue and Test the Trigger.

Setting Up the First Action:

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

Filter for Shopify plans:

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,

Set Up the Second Action:

  1. For the action, select Shopify.
  2. For Event, select Mark Order as Paid.
  3. Select/connect your Shopify account.
  4. Click Continue

Configure the Second Action


Order: click the thre dots and select Custom.

For the Order field, map to the Integration Id from the Partial.ly webhook.

Publish

  1. Click Continue to go to the test page. You can click Skip test.
  2. Click the Publish button to activate the zap.

Have More Questions?

Email us at support@partial.ly