I wanted to add a downloadable PDF order that can easily be printed for admin purposes.
The first thing I did is downloaded the
entity print module
https://www.drupal.org/project/entity_print
You can install it with composer with this command
composer require 'drupal/entity_print:^2.7'
Then you just enable entity print.
When you go to commerce/orders and you open specific order you get a PDF link
After that you open the PDF and you can print that order easily.
For example here is the order in PDF
I wanted to add additional fields to that page, like SKU for example.
I had to grab the default order commerce twig just search for it commerce-order-receipt.html.twig
and added this code to add SKU field
<td>
<span style="float: right;">{{ order_item.getPurchasedEntity.getSku }}</span>
</td>
Then I copied that template to
/web/themes/themename/templates/commerce/commerce-order-receipt.html.twig
I also added telephone number field and also date of the purchase. I had to add the custom code for that.
and invoice date, the code is
{% if order_entity.getCompletedTime is not empty %} if that not work because you added additional stage in orders like fullfilment, then you change it to
{% if order_entity.getPlacedTime is not empty %} Done.
Additional tip. If you would like to open the PDF in an additional tab and not download it to your computer, open the PDF link in a new tab in the browser and add /debug at the end. You will get a great-looking page that you can print.
Here is the whole file code:
{#
/**
* @file
* Template for the order receipt.
*
* Available variables:
* - order_entity: The order entity.
* - billing_information: The billing information.
* - shipping_information: The shipping information.
* - payment_method: The payment method.
* - totals: An array of order totals values with the following keys:
* - subtotal: The order subtotal price.
* - adjustments: An array of adjustment totals:
* - type: The adjustment type.
* - label: The adjustment label.
* - total: The adjustment total price.
* - weight: The adjustment weight, taken from the adjustment type.
* - total: The order total price.
*
* @ingroup themeable
*/
#}
<table style="margin: 15px auto 0 auto; max-width: 100%; font-family: arial,sans-serif">
<tbody>
<tr>
<td>
<table style="margin-left: auto; margin-right: auto; max-width: 768px; text-align: center;">
<tbody>
<tr>
<td>
<a href="{{ url('<front>') }}" style="color: #0e69be; text-decoration: none; font-weight: bold; margin-top: 15px;">{{ order_entity.getStore.label }}</a>
</td>
</tr>
</tbody>
</table>
<table style="text-align: center; min-width: 450px; margin: 5px auto 0 auto; border: 1px solid #cccccc; border-radius: 5px; padding: 40px 30px 30px 30px;">
<tbody>
<tr>
<td style="font-size: 30px; padding-bottom: 30px">{{ 'Order Confirmation'|t }}</td><span > Date Of Invoice: {{ order_entity.getCompletedTime|format_date('short') }} </span>
{{ order_entity.field_telephone }}
{{ invoice_entity.getBillingProfile.field_telephone }}
</tr>
<tr>
<td style="font-weight: bold; padding-top:15px; padding-bottom: 15px; text-align: left; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc">
{{ 'Order #@number details:'|t({'@number': order_entity.getOrderNumber}) }}
</td>
</tr>
<tr>
<td>
{% block order_items %}
<table style="padding-top: 15px; padding-bottom:15px; width: 100%">
<tbody style="text-align: left;">
{% for order_item in order_entity.getItems %}
<tr>
<td>
<span style="float: left;">{{ order_item.getPurchasedEntity.getSku }}</span>
</td>
<td>
{{ order_item.getQuantity|number_format }} x
</td>
<td>
<span>{{ order_item.label }}</span>
<span style="float: right;">{{ order_item.getTotalPrice|commerce_price_format }}</span>
</td></tr>
{% endfor %}
</tbody>
</table>
{% endblock %}
</td>
</tr>
<tr>
<td>
<span > Customer´s email: {{ order_entity.getEmail }} </span>
<br>
<span > Customer´s phone number: {{ order_entity.getCustomer.field_telephone.value }} </span>
{% if (billing_information or shipping_information) %}
<table style="width: 100%; padding-top:15px; padding-bottom: 15px; text-align: left; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc">
<tbody>
<tr>
{% if shipping_information %}
<td style="padding-top: 5px; font-weight: bold;">{{ 'Shipping Information'|t }}</td>
{% endif %}
{% if billing_information %}
<td style="padding-top: 5px; font-weight: bold;">{{ 'Billing Information'|t }}</td>
{% endif %}
</tr>
<tr>
{% if shipping_information %}
<td>
{% block shipping_information %}
{{ shipping_information }}
{% endblock %}
</td>
{% endif %}
{% if billing_information %}
<td>
{% block billing_information %}
{{ billing_information }}
{% endblock %}
</td>
{% endif %}
</tr>
{% if payment_method %}
<tr>
<td style="font-weight: bold; margin-top: 10px;">{{ 'Payment Method'|t }}</td>
</tr>
<tr>
<td>
{% block payment_method %}
{{ payment_method }}
{% endblock %}
</td>
</tr>
{% endif %}
</tbody>
</table>
{% endif %}
</td>
</tr>
<tr>
<td>
<p style="margin-bottom: 0;">
{{ 'Subtotal: @subtotal'|t({'@subtotal': totals.subtotal|commerce_price_format}) }}
</p>
</td>
</tr>
{% for adjustment in totals.adjustments %}
<tr>
<td>
<p style="margin-bottom: 0;">
{{ adjustment.label }}: {{ adjustment.total|commerce_price_format }}
</p>
</td>
</tr>
{% endfor %}
<tr>
<td>
<p style="font-size: 24px; padding-top: 15px; padding-bottom: 5px;">
{{ 'Order Total: @total'|t({'@total': order_entity.getTotalPrice|commerce_price_format}) }}
</p>
</td>
</tr>
<tr>
<td>
{% block additional_information %}
{{ 'Thank you for your order!'|t }}
{% endblock %}
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
Add new comment