WP-Invoice: Single Page Checkout

Single Page Checkout (SPC) is Add-on for WP-Invoice that makes it easy to create stand-alone checkout forms on your site. That form can contain a list of Predefined Line Items of your choice, or open items (custom amount entry). Other features include processing fee calculation, custom user information capture, multiple items, and more. Processed payments are visible on the WP-Invoice overview screen on the back-end, alongside regular invoices.

How It Works

The Single Page Checkout form works with the wpi_checkout shortcode. That list can be added on any post or page, giving you the ability to create infinite lists for easy selection of products in any given situation. The client viewing that page will be able to choose items from that list and easily checkout and buy the products and services of his choice.

Creating Predefined Line Items

Single Page Checkout forms can consist of (but are not limited to) Predefined Line Items, which are default products or services than you create once and can use multiple times in SPC lists or invoices. Consider them as your most common products / services for invoicing or Single Page Checkout forms. We will not cover the specifics on Predefined Line Items here, you can see the complete guide on the help page for Predefined Line Items, where you can see examples and understand them better.

An example: The logo designer

To understand the concept of the Single Page Checkout form better, let’s assume, as an example, that you are a logo designer. You are interested in creating a list so that your clients can easily choose from and purchase your corporate branding services, a logo design, a business card design and a stationery design.

For the needs of this example, we will assume that the professional has a fixed price for each item on that list. Single Page Checkout forms have fixed quantities, prices and tax by nature. The logic here is “they see it, they buy it”. To begin creating a Single Page Checkout form, we go to the WP-Invoice Settings page (Invoice → Settings) and click the “Predefined Line Items” tab. Here we can see an interface that easily allows us to create and edit predefined products and services. That interface may include a couple of dummy items (depending on the version of WP-Invoice you have installed. Feel free to keep, delete or edit these items, you can use them on your Single Page Checkout form if you wish. In this example we will assume that the list of items is empty.

Creating the items

Each Predefined Line Item has five input fields for Name, Description, Quantity, Price and Tax. The Description field’s visibility can be toggled with the “Toggle Description” link underneath the Name field. Each item also includes a dynamic label that will show you the total value of that item, calculated by the quantity, price and tax you set.

We will assume a tax of 20% for each of the services listed above, a price of 30 (currency depends on the setting under the Payment tab) and a quantity of one. You can change these values at will. We begin by filling in the first item on our list, so the result should be something like on this image.

Next we click on the “Add Line Item” button and repeat until all four services are on the list. When we are done we click on the “Save All Settings” button. We should have something like this (I have added some text on the descriptions too):

Note: Even if you change the Description, Quantity, Price and Tax fields of a Predefined Line Item, the shortcode you create will not be broken, as long as you keep the Name field the same.

We are almost done! All we have to do now is to create a shortcode for our Single Page Checkout form.

Note: Attributes that contain words or terms separated by spaces (Predefined Line Item names for example) must be enclosed in single quotes. See examples in this page.

Sample Output

Developer Tips