Need to add SKU to order confirmation email - Commerce 2

Question

I have been able to customize the order confirmation email twig file for a client to some degree, however when it comes to adding the SKU for each item ordered I cannot find a way to have it populate. I have tried to insert the commerce checkout order summary block that displays each product variation's sku, it did not populate in the email. I have also looked at the order item table which does include the SKU for the items ordered so I cannot pull from there.

Any advice on how to pull the SKU's into the order confirmation email twig file?

Answer 1

I found this article that helped:

https://www.drupal.org/forum/support/module-development-and-code-questions/2018-08-23/drupal-8-commerce-2-get-item-from

This is my commerce-order-receipt twig that displays the quantity, title, price and in a row below the sku.

Hope it helps.

 <table style="text-align: center; width: 100%; 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>
    </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; vertical-align: top;">
        {{ 'Order #@number details:'|t({'@number': order_entity.getOrderNumber}) }}
      </td>
    </tr>
    <tr>
      <td style="vertical-align: top;">
        {% 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 %}
           {% set product = order_item.getPurchasedEntity %}
          <tr>
            <td style="vertical-align: top;">
              {{ order_item.getQuantity|number_format }} x
            </td>
            <td style="vertical-align: top;">
              <span>{{ order_item.label }}</span>
              <span style="float: right;">{{ order_item.getTotalPrice|commerce_price_format }}</span>
            </td>
          </tr>
          <tr>
          <td style="vertical-align: top;">
              <span>SKU:</span>
          </td>
          <td style="vertical-align: top;">
              <span>{{ product.getSku }}</span>              
          </td>
          </tr>
          {% endfor %}
          </tbody>
        </table>
        {% endblock %}
      </td>
    </tr>
    <tr>
      <td>
        {% 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; vertical-align: top;">{{ 'Shipping Information'|t }}</td>
            {% endif %}
            {% if billing_information %}
              <td style="padding-top: 5px; font-weight: bold; vertical-align: top;">{{ 'Billing Information'|t }}</td>
            {% endif %}
          </tr>
          <tr>
            {% if shipping_information %}
              <td style="vertical-align: top;">
                {% block shipping_information %}
                  {{ shipping_information }}
                {% endblock %}
              </td>
            {% endif %}
            {% if billing_information %}
              <td style="vertical-align: top;">
                {% block billing_information %}
                  {{ billing_information }}
                {% endblock %}
              </td>
            {% endif %}
          </tr>
          {% if payment_method %}
            <tr>
              <td style="font-weight: bold; padding-top: 40px; vertical-align: top;">{{ 'Payment Method'|t }}</td>
            </tr>
            <tr>
              <td style="vertical-align: top;">
                {% block payment_method %}
                  <p>{{ payment_method }}</p>
                {% endblock %}
              </td>
            </tr>
          {% endif %}
          </tbody>
        </table>
        {% endif %}
      </td>
    </tr>
    <tr>
      <td style="padding-top: 20px; text-align: right;">
        {{ 'Subtotal: @subtotal'|t({'@subtotal': totals.subtotal|commerce_price_format}) }}
      </td>
    </tr>
    {% for adjustment in totals.adjustments %}
    <tr>
      <td style="text-align: right;">
        {{ adjustment.label }}: {{ adjustment.total|commerce_price_format }}
      </td>
    </tr>
    {% endfor %}
    <tr>
      <td style="padding-top: 10px; padding-bottom: 20px; font-size: 24px; text-align: right;">
        {{ 'Order Total: @total'|t({'@total': order_entity.getTotalPrice|commerce_price_format}) }}
      </td>
    </tr>
    <tr>
      <td style="padding-top: 30px; border-top: 1px solid #cccccc;">
        {% block additional_information %}
          {{ 'Thank you for your order!'|t }}
        {% endblock %}
      </td>
    </tr>
    </tbody>
  </table>

Answer 2

I solved it like this:

1) edit fields in /admin/commerce/config/product-variation-types/default/edit/display/summary

• you can add SKU or anything else

2) add {{ order_item.getPurchasedEntity|commerce_entity_render('summary') }} in commerce-order-receipt.html.twig

 {% for order_item in order_entity.getItems %}
              <tr>
                <td>
                  {{ order_item.getQuantity|number_format }} x
                </td>
                <td>
                  {{ order_item.getPurchasedEntity|commerce_entity_render('summary') }}
                </td>
                <td>
                  <span>{{ order_item.label }}</span>
                  <span style="float: right;">{{ order_item.getTotalPrice|commerce_price_format }}</span>
                </td>
              </tr>
              {% endfor %}

in fact, I created a new display called "sku" and didn't use "summary"

my post on drupal.org - https://www.drupal.org/project/commerce/issues/3130985