You have multiple ways how to delivery invoices to your customers. One of those is the traditional separate email with invoice as a PDF. Alonside this option, your online store can include links to view, download, or print your invoices online.
There are different ways you can link to your Zenvio invoices.
Include invoices in Shopify customer account page
Customer account page displays a summary of a customer's account, including a list of recent orders that he has made. You can add links to invoices for each order listed on this page.
To add invoice links to the Customer Account page:
- In your Shopify admin, go to the Online Store.
- Select Themes page in submenu.
- For the Current Theme section, Click the Actions button
- Click on Edit in the dropdown.
- Search for the
customers/account.liquid
in the left sidebar or using upper search bar. - Insert the following code snippets inside the
<table>
that displays a list of customer's orders.
First, add a propper heading inside the <thead>
:
<th>
Invoice
</th>
Then, use the following code snippet inside the <tbody>
to include link to download a PDF version of the invoice:
<td>
<span class="invoice">
<a target="_blank" href="{{ shop.url }}/apps/Zenvio/orders/{{ order.id }}/invoice/download.pdf" >
Download
</a>
</span>
</td>
Tip
...invoice/download.pdf
will force browser to download invoice.
If you swap download.pdf
to open.pdf
invoice will be opened inside the browser
Add link to invoice in Order Status page
After your customer completes an order, he will be redirected to the Order Status page - the final Thank You page of the Shopify store checkout. You can add a link to the invoice here as well.
To add invoice links to the Order Status page:
- In your Shopify admin, go to the Settings.
- In left Settings menu select Checkout page.
- Scroll down to the section Order processing.
- Insert the following code snippet to the Additional scripts field.
<div class="ui-button btn btn--subdued btn--size-small" style="margin-top: 2em;">
<a target="_blank" href="{{ shop.url }}/apps/Zenvio/orders/{{ order.id }}/invoice/download.pdf" >
<strong>Download Invoice</strong>
</a>
</div>
Include link to invoice in the Order Confirmation email
You can include a link to an invoice in the Order Confirmation emails sent by Shopify. These email notifications are sent automatically to customers after they place their orders.
To add a link of the online invoice version to the Order Confirmation email template:
- In your Shopify admin, go to the Settings.
- In Settings menu select Notifications page.
- In the section Customer notifications, click on Order Confirmation.
- Insert the following code snippet to the Email body (HTML) field.
<div>
<a href="{{ shop.url }}/apps/Zenvio/orders/{{ id }}/invoice/download.pdf">Download invoice</a>
</div>
Heads up!
For example, you should not send link to invoice in Order Confirmation email, when you have configured the process to create invoice on Fulfillment. Invoice will not be ready when in the moment of sending Order Confirmation email. The same applies for Order Confirmation email as well as Order Status page