Emilshamloo
New member
Hi,
I have a email template which dose not work properly when the email is more than one page!
The first line of the second page overwrites. please,look at the picture.
You can see the code after the picture.
Any tips would be appreciated
I have a email template which dose not work properly when the email is more than one page!
The first line of the second page overwrites. please,look at the picture.
You can see the code after the picture.
Any tips would be appreciated
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<style type="text/css">
body{
font-family: Arial;
}
.new-page{
page-break-before: always;
}
.header{
text-align:right;
border-bottom: 5px solid #E9E9E9;
padding:0 0 10px 0;
}
.column{
display:inline-block;
vertical-align:top;
font-size:14px;
}
h1{
color: #E9E9E9;
margin:10px 0 5px 0;
}
h4{
margin:0;
}
table {
border-collapse: collapse;
}
th, td {
text-align: left;
padding: 4px;
}
thead td{
color:black;
font-weight:bold;
}
tbody td{
font-size:20px;
}
tbody tr{
border-bottom: 2px solid #E9E9E9;
}
</style>
</head>
<body>
<div class="new-page">
<div class="row" style="width: 50%; float: left;">
<div class="column">
<div>
<b>LeveringsDato:</b>
<span>{{var order.getDeliveryDate(2)}}</span>
</div>
<div>
<b>Fakturanummer:</b>
<span>{{var order.increment_id}}</span>
</div>
{{if order.shipping_arrival_date}}
<div>
<b>Leveringsdato:</b>
<span>{{var order.shipping_arrival_date}}</span>
</div>
<div>
<b>Forfall:</b>
<span>{{var order_date}}</span>
</div>
{{/if}}
<div>
<b>{{var order.occasion_label}}</b>
<span>{{var order.occasion_value}}</span>
</div>
</div>
</div>
<div class="row" style="width: 50%; float: left; margin-bottom: 20px;">
<div style="width:200px;padding: 0 5px 5px;">
<h4 style="color:black">Leveringsadressse</h4>
</div>
<div class="column" style="border: 1px solid #c8e5c4; width: 300px;">
<div style="padding:5px;">
{{var order.customer_firstname}}
{{var order.customer_lastname}}
</div>
</div>
</div>
<div class="row" style="margin-top:30px;">
<table style="width:100%;">
<thead>
<tr style="background:#E9E9E9">
<td>ANTALL</td>
<td>PRODUKTER</td>
<td>PRIS</td>
<td>Hylleplass</td>
</tr>
</thead>
<tr>
<tbody style="border-spacing:50px;">
{{foreach order.getAllVisibleItemsSortShelf()}}
<tr>
<td>{{var item.getQtyOrdered()|int}}</td>
<td class="col item-info" data-th="{{trans 'Product Name'}}">
<div>
{{block class='Potato\Pdf\Block\Adminhtml\Sales\Order\Item\Renderer' name='item.renderer.block.name' area='frontend' template='Potato_Pdf::item.phtml' item=$item}}
</div>
</td>
<td>{{var order.formatPrice($item.getPrice())|raw}}</td>
<td>{{var item.getProduct().getShelf()|raw}}</td>
</tr>
{{/foreach}}
</tr>
</tbody>
<tfoot class="order-totals">
<tr><td></td><td></td><td></td><td></td></tr>
<tr>
<td></td>
<td></td>
<td><b>Order Total</b></td>
<td><b>{{var order.formatPrice($order.getSubtotal())|raw}}</b></td>
{{block class="Swissup\CheckoutFields\Block\Adminhtml\Order\View\Fields" area="frontend" template="Swissup_CheckoutFields::email/order/fields.phtml" order=$order}}
</tr>
</tfoot>
</table>
</div>
</div>
</body>
</html>
Last edited:
