I need to display Customer Email, Customer Phone, Product Name, Product SKU in order email.
{{template config_path="design/email/header"}}
{{inlinecss file="email-inline.css"}}
<p><strong>Hello</strong> {{var order.getCustomerFirstname()}}!</p>
</br></br>
<h3 style="font-size: 20px;color: #3446a8;">Your order on <strong>{{var store.getFrontendName()}} </strong>has been placed!</h3>
</br></br>
<p>Thank you for your order! Please click the link below to start tracking your order once we start processing it. You will be notified via SMS when processing starts. Alternatively, you can check the status of your order by <a href="https://www.dankotuwa.com/shop/customer/account/login/">logging into your account.</a></p>
</br>
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width=100%>
<tr>
<td class="email-heading" style="width:50%;">
<h1 style="color:#3446a8;">New Order </h1>
</td>
<!-- <td class="store-info" style="width:50%;">
<h4>Order Questions?</h4>
<p>
{{depend store_phone}}
<b>Call Us:</b>
<a href="tel:{{var phone}}">{{var store_phone}}</a><br>
{{/depend}}
{{depend store_hours}}
<span class="no-link">{{var store_hours}}</span><br>
{{/depend}}
{{depend store_email}}
<b>Email:</b> <a href="mailto:{{var store_email}}">{{var store_email}}</a>
{{/depend}}
</p>
</td> -->
</tr>
</table>
</td>
</tr>
<tr>
<td class="order-details">
<h3>Your order <span class="no-link">#{{var order.increment_id}}</span></h3>
<p>Placed on {{var order.getCreatedAtFormated('long')}}</p>
</td>
</tr>
<tr class="order-information">
<td>
{{vardump getEmailCustomerNote()
if order.getEmailCustomerNote()}}
<table cellspacing="0" cellpadding="0" class="message-container">
<tr>
<td>{{var order.getEmailCustomerNote()}}</td>
</tr>
</table>
{{/if}}
{{layout handle="sales_email_order_items" order=$order}}
<table cellpadding="0" cellspacing="0" border="0">
<tr>
<td class="address-details" style="width:50%;">
<h6 style="color:#3446a8;">Customer Name:</h6>
<p><span class="no-link">{{var order.getCustomerFirstname()}}{{var order.getCustomerLastname()}}</span></p>
</td>
<td class="address-details" style="width:50%;"></td>
</tr>
<tr>
<td class="address-details" style="width:50%;">
<h6 style="color:#3446a8;">Delivery type:</h6>
<p><span class="no-link">{{var order.getShippingCarrier().getConfigData('title')}}</span></p>
</td>
<td class="address-details" style="width:50%;">
<h6 style="color:#3446a8;">Customer Address:</h6>
<p><span class="no-link">{{var order.getShippingAddress().format('html')}}</span></p>
</td>
</tr>
<tr>
<td class="method-info" style="width:50%;">
<h6 style="color:#3446a8;">Customer Email:</h6>
<p>{{var order.getCustomeremail()}}</p>
</td>
<td class="method-info" style="width:50%;">
<h6 style="color:#3446a8;">Customer Phone:</h6>
<p>{{var order.getCustomerTelephone()}}</p>
</td>
</tr>
<tr>
<td class="method-info" style="width:50%;">
<h6 style="color:#3446a8;">Product Name:</h6>
<p>{{var product.getProductName()}}</p>
</td>
<td class="method-info" style="width:50%;">
<h6 style="color:#3446a8;">Product SKU:</h6>
<p>{{var product.getProductSku()}}</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
{{template config_path="design/email/footer"}}
]
if there are any variables to get these values or should I need to create another way to return those values?
please, let me know what is the best solution and haw can I reach that level.