💡 ClickFix | Generating Payable Invoices

LOGIN

Case Study : INVOICING & E-COMMERCE

Part 2 : Generating Payable Invoices

Summary : Building upon Part 1 : Pay What You Want of our Case Study, in the part we delve into the intricacies of generating payable invoices using Ontraport and ClickFix, so you can send your clients :

A payment link : https://rdirct.me/q-P7cR/invoice
A downloadable PDF Invoice : https://rdirct.me/cDRRay/receipt

Why Use This : Invoicing is a crucial aspect for any business that values streamlined financial processes and enhanced customer interaction. This segment highlights the transformational impact of efficient invoicing on business operations and customer relationships.

Use Cases for Generating Payable Invoices :

Freelance or Contract Work: Create and send invoices directly to clients post-service delivery or upon project completion, ensuring timely payments*

Membership or Subscription Services: Regularly generate invoices for recurring services, maintaining a steady cash flow and simplifying subscription management.

Event Ticketing: Issue invoices for event tickets, enabling customers to secure their spots while managing cash flow efficiently.

Online Courses or Webinars: Send invoices to participants for educational content, ensuring easy payment processing and access management.

Consultation Services: Generate invoices for one-on-one or group consultations, making it easy for clients to pay for personalized services.

Retail or E-Commerce: Use invoices for product sales, particularly for bulk orders or custom items, enhancing the buying experience.

Rental Services: Invoice clients for property or equipment rentals, streamlining payment processes for both short-term and long-term leases.

Digital Goods and Software: Bill customers for downloadable content, software licenses, or app usage with customizable invoices.

Custom Manufacturing or Artwork: Send tailored invoices for bespoke products, reflecting the uniqueness of each order.

Charitable Donations: Generate invoices for donors, making it easier for non-profits to manage contributions and maintain transparency.

This part of the case study provides insights into the versatile applications of payable invoices across various business models, emphasizing the ease and efficiency brought by integrating Ontraport and ClickFix.

Create a new Object called “Invoices”
Add to Invoice Object the fields
1. Amount : Price
2. Product : Dropdown
  1. Product A
  2. Product B
3. Status : Dropdown
  1. Draft
  2. Awaiting Payment
  3. Charge Invoice
  4. Paid
  5. Voided
4. Short URL : url field
5. PDF Link : url
Add to Invoice Object the relationships
1. Contact 1-M Invoices (call this relationship simply “Invoices” and “Related Contact”)
2. Contact 1-1 Invoices (Paying Invoice)
Create a new Contact page for the staff : Invoice Management
1. /staff/manage_invoices
  1. Invoice Form
    1. Related Contact//Email
    2. Product
    3. Amount
    4. Dropdown Field, Status, with “Awaiting Payment” pre selected (but leaving the other options open)
  2. Then below a Dynamic Block to show the unpaid invoices
    1. Display Email, Amount
    2. With a link to pay (see below)
Create a new Contact Page named #Invoicing #Payment #ThankYou
1. We are simply going to clone the Thank You page from Part 1 of this Case Study series
2. https://clickfix.io/case_studies/invoicing_ecommerce/1/pay_what_you_want
3. The only difference is we check the Invoice Status on this page, which could be
  1. Charge Invoice = Processing Payment Block
  2. Paid = Success Block
  3. Awaiting Payment = Failure Block
    1. But in this block, we need to add the 1-1 Relationship with the invoice, and move the invoice back to Charge Invoice
Create a new “Invoice” Dynamic Template simply named “Invoice”
1. At the top of the page, three possible blocks
  1. If Unpaid
    1. Pay Now button
  2. If Paid
    1. Download Invoice (link to PDF, see below)
  3. If any other status
    1. "There was an error with this invoice, please reach out to contact@clickfix.io”
2. Payment Contact Form
  1. Credit Card field
  2. $0 Product to collect the Card
  3. Contact field Unique ID hidden and prefield with "Page//Paying Contact//Unique ID"
  4. Paying Invoice//Unique ID field hidden and prefield with "Page//Unique ID"
  5. Hidden Dropdown to set Paying Invoice//Status to Charge Invoice
  6. Show the form and redirect to it when the button "Pay Now" is clicked.
Clone the “Invoice” Dynamic Template named “Invoice”, name it “Invoice PDF” and remove the blocks that don’t belong on the PDF
New Invoice Automation : #InvoiceManagement
1. Trigger, Invoice is created
2. If Invoice is Paid
  1. Simply log the transaction inside the contact
3. If invoice is Charge Invoice
  1. Update “Paying Invoice” relationship to blank
  2. Webhook to link the invoice and the contact together
  3. Goal : Paying Invoice field is updated
  4. Clear Status then Set Status to Charge Invoice (to trigger payment in next automation, see below)
  5. Two Goals for Status is updated, to either
    1. Awaiting Payment
      1. Go To Awaiting Payment below
    2. Paid
      1. Generate a PDF version of it
      2. Exit
4. If Status is Void or Empty or Draft, exit
5. If invoice is Awaiting Payment,
  1. Generate a short link to the invoice with password /invoice
  2. Add an email to send that link out to the contact
  3. Goal : Status is Charge Invoice
  4. Goal : Status is Paid
  5. Exit
New Contact Automation : #InvoiceManagement
1. Clone the Automation from Part 1 of this Case Study series https://clickfix.io/case_studies/invoicing_ecommerce/1/pay_what_you_want
2. Trigger : Paying Invoice//Status is updated and is Charge Invoice
3. Conditional for Product A or Product B
4. Two Hooks with a different product in each, grabbing the amount from Paying Invoice relationship
5. Two goals
  1. Last Invoice # is Updated and Payment is Successfull
    1. Update Invoice Status to Paid
  2. Last Invoice # is Updated and Payment Fails
    1. Update Invoice Status to Awaiting Payment
  3. Exit in both cases
6. Note : it’s a choice we are making here, to charge the card in a Contact Automation. We could have also done it within the invoice object. I can’t think of a reason to prefer one over the other, since we always need a contact form at some point (to get the credit card information). Also, it allows us to share it with you.

Download Assets

Note that you must be logged into the Ontraport account to import this

Divider Text

What's Inside

One Automation
1. #Invoice Management Template
Three Pages
1. #PayWhatYouWant #ThankYou (to be edited to target your Invoice custom object)
2. Template Invoice (import the block into an Invoice Dynamic Template)
3. Template Invoice PDF (import the block into an Invoice Dynamic Template)
One Dropdown Field "Pay What You Want Status" (which you can remove once you are using the Invoice Object Fields)

ClickFix Features

Conditional Display Overview (🆓 Free Plan)
Log Transaction Overview Documentation (➰Essential Plan)
1. Alternative : Ontraport API
Page to PDF Overview Documentation (➰Essential Plan)
1. Alternative : Zapier + DocRaptor
URL Shortener Overview Documentation (➰Essential Plan)
1. Alternative : Zapier

What You Must Do

Since we cannot share Custom Object Automations with you, you'll have to follow the steps above to recreate this system, including
1. Create from scratch the "Invoice Management" page to generate a new invoice
2. Create #Invoicing #Payment #ThankYou, which you can clone/edit from imported page "#PayWhatYouWant #ThankYou"
3. Import blocks from Template Invoice and Template Invoice PDF into Dynamic Templates
You will need to recreate the Invoice Object Automation from scratch
In the imported contact automation, edit all triggers, conditions and updates to the Paying Invoice//status to match your fields, and the webhook within the automation to enter YOUR ClickFix Token (or use Ontraport API)
(Note that post data is corrupted by Ontraport during import, see note within the automation)
Add products to the different payment forms

CLICKFIX

PRODUCT

Template Library

Shortcodes

DISCOVER

Case Studies

Live Documentation

Support

Change Log