WP-Invoice was developed keeping both the user’s and his clients’ needs in mind. Our main target was designing the plugin to be both functional and easy to use. For this reason, we built it so it uses the native WordPress post system. In other words, every invoice is a custom-made WordPress post, like the posts and pages you are already familiar with. The first thing you see when you create a new invoice is a page, similar to the native WordPress Post and Page edit page. We will explain the process of editing the invoice by breaking the interface into sections:
These two fields are the heart of any WordPress post type and an important part of our invoice.
Tip: It is suggested that you use the first example to sum up the services. Remember that you can use any invoice as a template for new invoices, that will make things faster and easier for you if you have clients that buy more or less the same services, or if you have some kind of package deal, that you usually offer to clients (with discounts or not).
Here’s that area filled in:
Now we are ready to add our line items. We can either create new line items or use predefined (default) line items that we have created in the Predefined Line Items tab of the WP-Invoice settings screen. To learn how to create Predefined Line Items please visit the Predefined Line Items settings page on our documentation.
This metabox is the most important part of your invoice. It allows you to add items (services or products) to your invoice. You generally want to fill these in, that’s how you get paid afterwards.
The fields here are the following:
Name: This is the name of the product or service your client will see on the invoice. Keep it short and easy to understand. For our Web Professional example, this could be “Web Design,” “Web Development”, or even more specific like “WordPress Plugin Development”, “PHP Development”, “PSD Slicing”, “Content Creation” etc.
Description: This field is originally hidden and can be toggled with the “toggle description” link, underneath the Name field.A small paragraph giving more detail about the nature of the product or service. Especially helpful to Web Professionals who like to break up every invoice into different services that the client would never understand on his own. For example, the description for “PSD Slicing” could be “Creation of HTML / CSS code for static Photoshop web design”. Be creative but short.
Qty: The quantity of the product or service your client will be paying for. Obviously this will vary from invoice to invoice, but for the model item you could use a minimum or average quantity. For services that are charged by the hour, this field would be the number of hours charged. The quantity could mean anything from items, hours, pounds, kilograms, liters or whatever unit of measure, but make sure that if you are not sticking to the traditional items or hours, your client will know what this number means. A good suggestion would be to add a “charged by the hour / liter / pound” in the end of the description field.
Price: The unit price for the product or service. Multiplied by the quantity, it gives us the total for the model entry. To make it even more obvious, this is how much one item, hour of work, pound of X or liter of Y costs.
Tax: The tax for the particular product / service. Unfortunate but helps the economy.
Total: This is actually not a field but a dynamic label, the number in which, changes depending on the quantity, price and tax you have set.
To add a discount to our invoice, we click on the “Add Discount” button on the bottom of the area.
Instantly, a special kind of line appears under the last line item we have entered. What we have here are two fields and a discount type selector drop-down.
The fields here are the following:
WP-Invoice automatically calculates the tax, depending on the tax settings (before or after discount, described under “Tax Handling” on the Main Settings tab documentation) and updates the relevant information display. Here are the fields completed and the tax calculated:
To delete a line item just click on the red icon on the left of the title field. Poof! Gone.
If we have created Predefined Line Items via the WP-Invoice Settings Predefined Line Items tab and we want to use them in our invoice, we can select them from the Invoice Line Items area. These items will appear normally on the list and you can still edit their name, description, quantity and price. To add a predefined line item to our invoice we click on the “Insert a predefined line item” drop-down, which is located between the “Add Line” and “Add Discount” buttons.
Note: The “Insert a predefined line item” drop-down will only appear if we have set predefined line items.
What we see next is a list of all the predefined line items we have set, as follows:
Now we just have to click on the predefined line item of our choice and if we want more than one, repeat. The items will appear normally on our list, ready to be edited:
Underneath the Line Items section, there is the Payment Settings section, where you can set the default payment method and other payment options for this particular invoice. The default options here will depend on the ones we have set on the Payments tab under WP-Invoice settings. As every client is different and needs to be treated specially though, you can still change these settings for the invoice you’re working on. Here is the Payment Settings area:
Here we see the following fields:
On the right sidebar of the edit invoice window you will notice a metabox with the client information. If the client you are invoicing did not exist (you have not invoiced him or he doesn’t exist in the [WP-CRM system] (https://github.com/wp-crm/wp-crm/wiki), the fields in that metabox will be empty:
If it’s empty, what we should do is to enter our client’s information. The information set here will appear on the PDF version of the invoice. When we’re done we should have something like this:
On the top right of the invoice edit page you will see the Publish metabox. Before you save the invoice it will look like this:
Here we can see the following options:
Quote: If checked, this entry will be saved as a quote and not as an invoice. This will enable the discussion feature for the quote and disable payment until the client has accepted the quote price and you have edited the quote and saved it as an invoice (by unchecking the field and saving it again). This field only appears if you have the Quotes free add-on.
Recurring Bill: If checked, three new fields will appear for us to set the recurring billing options:
Send invoice: If “automatically” is checked, the client will be sent the invoice automatically when it’s time to be billed again. If not, you will have to do it manually.
Toggle Advanced: This link toggles some extra options for our invoice:
Tax Method: Here we can choose between calculating the tax before or after the discount (if applicable). For more information and an example take a look at the WP-Invoice Main settings tab.