Formatting Invoice

Hi @jackofallspades

Thanks for the screenshots.

If possible can you share the template code? So, I can recreate the issue in our demo and help you to resolve it.

Sure, this is what I have for the HTML template.

<h1>Your Booking Request</h1>
<p>Thank you for booking with Jack of all Spades, [wcj_order_checkout_field field_id="billing_first_name"]!  You selected [wcj_order_payment_method] as your Method of Payment, in the amount of [wcj_order_total].  Please see below for your list of items ordered.  Reply to this email if you would like to make any changes.</p>
<p>Event Date: [wcj_order_items_meta meta_key="_wapbk_booking_date" unique_only="yes"]</th><td></p>
<p>
<table class="pdf_invoice_heading_table">
</table>
</p>
<p>
<table class="pdf_invoice_seller_buyer_table">
<tbody>
	<tr><th>Billing Info</th><th>Event Address</th></tr>
	<tr><td>[wcj_order_billing_address]<br>[wcj_order_checkout_field field_id="billing_phone"]<br>[wcj_order_checkout_field field_id="billing_email"]</td><td>[wcj_order_shipping_address hide_if_zero="no"]</td></tr>
</tbody>
</table>
</p>
<p>
[wcj_order_items_table
    table_class="pdf_invoice_items_table"
    exclude_by_categories="ignore"
    product_image_width="50"
    product_image_height="50"
    columns="product_thumbnail|item_name|item_quantity|product_purchase_note|line_subtotal_tax_excl|line_tax"
    columns_titles="Pic|Product|Quantity|Note|Price"
    columns_styles="width:10%;|width:25%;|width:10%;|width:45%;|width:10%;text-align:center;"]
<table class="pdf_invoice_totals_table">
<tbody>
	<tr><th>Subtotal</th><td>[wcj_order_subtotal]</td></tr>
        <tr><th>Transportation, Delivery, Set up, Pick up, Teardown Charge</th><td>[wcj_order_shipping_price excl_tax]</td></tr>              
        <tr><th>Coupon Code (Discount)</th><td>[wcj_order_meta meta_key="_cart_discount" before="-$"]</td></tr>
        <tr><th>Credit Card Fee (Stripe)</th><td>[wcj_order_fee name="Stripe Credit Card Processing Fee"]</td></tr> 
	<tr><th>Taxes (HST)</th><td>[wcj_order_total_tax]</td></tr>
	<tr><th>Order Total</th><td>[wcj_order_total]</td></tr>
</tbody>[wcj_tcpdf_pagebreak]
<b>Signatures</b><br><br>I have inspected these items and agree that everything listed on this invoice was received.  If there are any damaged items, I have noted them below.  Otherwise it is assumed that everything was received in perfect working order.<br><br><br>
First Name: ___________________________________________<br><br>
Last Name: ___________________________________________<br><br>
Signature:  ______________________________________________<br><br>
Cell Phone #: ____________________________________________<br><br>
<br><br><br>
<b>Damages to Note</b><br><br>
____________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________
</table>
</p>

• This reply was modified 3 years, 9 months ago by jackofallspades.

Hi @jackofallspades

Thanks for sharing the code.

I have checked and added the same code also, check by adding 12-15 items in the order. The listing displaying properly from our end. Can you confirm if you have added anything from the styling option? If yes you can try to reset that module and check.

This is what I have in styling:

.pdf_invoice_heading_table {
width: 50%;
}

.pdf_invoice_seller_buyer_table th {
font-weight: bold;
}
/* pdf_invoice_items_table */
.pdf_invoice_items_table {
padding: 5px;
}
.pdf_invoice_items_table th {
font-weight: bold;
border: 1px solid #F0F0F0;
}
.pdf_invoice_items_table td {
border: 1px solid #F0F0F0;
}
/* pdf_invoice_totals_table */
.pdf_invoice_totals_table {
padding: 5px;
}
.pdf_invoice_totals_table th {
width: 85%;
text-align: right;
}
.pdf_invoice_totals_table td {
width: 15%;
text-align: right;
border: 1px solid #F0F0F0;
}`

By resetting it, do you mean delete it, save it, and then put back?

Another question I have while we are sorting this out, is I have this in the template for the price column: line_subtotal_tax_excl Is there a column I can put that will list its discount? I have tried many of the codes listed on your site as a test, but they all come up as $0.00 and instead a discount is applied near the subtotal. This is what I have at subtotal: [wcj_order_meta meta_key=”_cart_discount” before=”-$”] I was hoping to have a line item list its discount or what the sale price is. I tried the sale price code and it didn’t work either. These discounts are from a bundle, and each bundled item is listed at a percentage off.

Lastly, how do I make that total discount that I listed above, be $160.00 vs $160 which shows now? I would like to add 2 decimal places to that.

Thanks!

Hi @jackofallspades

To display discount, you can use [wcj_order_total_discount] shortcode before the final total. And regarding showing the decimal places you can add that from your woocommerce >> General >> Currency Option.

And for Formatting, I checked the same code and CSS and it’s working properly from our end.

Yes, I am aware of the discount before the total, but I was hoping to have a discount for each line item. Is there a way to do that?

All other prices listed on invoice, have 2 decimal points, except for discount. How do I just do the discount one as its the only one giving me an issue?

For the formatting, it of course will work out sometimes that the lines will line up properly, but most times it will be off. Are you able to test another scenario to see what I mean? Or I can go through previous orders and email you a bunch to see them.

Hi @jackofallspades

You can try the below code to solve the design issue. That might be causing because of many items, you can add break after 5-6 products. And regarding displaying discount per item currently, it’s not possible but you can display the discount as an Item. That will display – sign and Discount amount. Please check the below code.

Also, if you have set the decimal amount format from General settings then it should work properly. I have checked it’s displaying properly.

[wcj_order_items_table
table_class=”pdf_invoice_items_table”
exclude_by_categories=”ignore”
product_image_width=”50″
product_image_height=”50″
columns=”product_thumbnail|item_name|item_quantity|product_purchase_note|line_subtotal_tax_excl|line_tax”
columns_titles=”Pic|Product|Quantity|Note|Price”
columns_styles=”width:10%;|width:25%;|width:10%;|width:45%;|width:10%;text-align:center;”
discount_as_item=”Discount”
insert_page_break=”5″]

Thank you for sending along that code. I tried it but there was a problem ??

The thing is, sometimes my purchase notes are super long, and sometimes they are very short – I have hundreds of products so it depends on what they order. For the most recent order, I just tried it, and only 4.5 products would fit on the page, so the rest of the 4th one appeared on the 2nd page along with a page break, and the rest of the other products were on a 3rd page.

Any other ideas? If the whole thing doesn’t fit on a page, I want it to go to the next, so there is no half of a product showing.

I do have one last question – I have some custom checkout fields that have a cost associated with them. How do I add them with the other charges below subtotal? Its order meta is “setup”.

Thank you for all your help!

Hi @jackofallspades

You can display 4 products per page and add insert_page_break=”4″. There is no option to add dynamic breaks per product. To display order attribute you can use this shortcode [wcj_order_meta meta_key=”_your_key” before=”My key: “].

So for this, where do i put the name “setup” which is the order meta name?

I have tried a few variations, but nothing is seeming to work?

[wcj_order_meta meta_key=”_your_key” before=”My key: setup“]
[wcj_order_meta meta_key=”_your_key” before=”setup “]
[wcj_order_meta meta_key=”setup” before=”My key: “]