Для замовлень
Приклади шаблонів документів для замовлень українською мовою.
Інструкції:
1. Товарний чек
<!doctype html>
<html lang="uk">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Товарний чек</title>
</head>
<body>
<div class="container">
{# ======================================================= #}
{# БЛОК: ШАПКА — логотип і контакти магазину #}
{# Замініть виділений жовтим текст на свої реальні дані #}
{# ======================================================= #}
<table class="width100">
<tbody>
<tr>
{# Логотип: замініть src на пряме посилання на своє зображення #}
<td class="logo-wrapper" valign="top">
<img src="https://blog.keycrm.app/wp-content/uploads/2025/12/cropped-keycrm-logo-blue-on-transparent-160x53.png" style="width: 200px;" alt="">
</td>
{# Адреса та email магазину #}
<td valign="top">
<span style="background-color: yellow">м.Київ вул. Хрещатик, 1</span><br />
<span style="background-color: yellow">demo@ukr.net</span><br />
</td>
{# Телефони магазину #}
<td valign="top">
<span style="background-color: yellow">тел.: (011)777-77-77</span><br />
<span style="background-color: yellow">тел.: (011)777-77-77</span><br />
<span style="background-color: yellow">тел.: (011)777-77-77</span><br />
</td>
</tr>
</tbody>
</table>
<br /><br /><br />
{# ======================================================= #}
{# БЛОК: РЕКВІЗИТИ — постачальник і одержувач #}
{# Лівий стовпець: ваші дані (замінити жовте) #}
{# Правий стовпець: дані клієнта з CRM (авто) #}
{# ======================================================= #}
<table class="width100">
<tbody>
<tr>
<td valign="top" class="label" style="width:50%">
<span style="background-color: yellow">Постачальник: Test test</span><br />
<span style="background-color: yellow">ФОП Тест Т.Т</span><br />
<span style="background-color: yellow">м.Київ вул. Хрещатик, 1</span><br />
<span style="background-color: yellow">тел.: (011)777-77-77</span><br />
</td>
<td valign="top" class="label">
{# Дані клієнта підтягуються з CRM автоматично #}
Одержувач: {{ model.client_name }}<br />
тел.: {{ model.client_phone | default('не вказано') }}<br />
{# Email виводиться тільки якщо він заповнений у замовленні #}
{% if model.client_email %}
email: {{ model.client_email }}
{% endif %}
</td>
</tr>
</tbody>
</table>
<br />
{# ======================================================= #}
{# БЛОК: НАЗВА ДОКУМЕНТА — номер і дата замовлення #}
{# Масив місяців для виводу дати словом ("15 травня") #}
{# ======================================================= #}
{% set mnths = ['','січня','лютого','березня','квітня','травня','червня','липня','серпня','вересня','жовтня','листопада','грудня'] %}
<p class="big-text text-center" style="margin-bottom: 10px">
Товарний чек №{{ model.id }} від {{ model.created_at|date("j") }} {{ mnths[model.created_at|date("n")] }} {{ model.created_at|date("Y") }} р.
</p>
{# ======================================================= #}
{# БЛОК: ТАБЛИЦЯ ТОВАРІВ #}
{# thead повторюється автоматично на кожній сторінці #}
{# (CSS: display:table-header-group) #}
{# Рядки товарів не розриваються між сторінками #}
{# (CSS: page-break-inside:avoid на tbody tr) #}
{# ======================================================= #}
<table class="width100 border">
<thead>
<tr>
<th class="text-center">№</th>
<th>Артикулу</th>
<th class="name-col">Назва товару</th>
<th>Од.</th>
<th>Кількість</th>
<th>Ціна</th>
<th>Сума</th>
</tr>
</thead>
<tbody>
{# Рядки товарів — перебираємо всі позиції замовлення #}
{% for key, product in model.products %}
<tr>
<td class="text-center">{{ key + 1 }}</td>
<td class="text-center">{{ product.product_sku }}</td>
<td style="width:50%">{{ product.product_name }}</td>
<td class="text-center">{{ product.product_unit_type }}</td>
<td class="text-center">{{ product.product_quantity }}</td>
<td class="text-center">{{ product.price_sold|format_currency('UAH', locale='uk') }}</td>
<td class="text-right">{{ (product.product_quantity * product.price_sold)|format_currency('UAH', locale='uk') }}</td>
</tr>
{% endfor %}
{# ======================================================= #}
{# ПІДСУМКИ — виводяться після всіх рядків товарів #}
{# ======================================================= #}
{# "Всього за товари" — тільки якщо є знижка або доставка #}
{% if model.discount_amount or model.shipping_price %}
<tr>
<td colspan="6" class="text-right">Всього за товари:</td>
<td class="text-right">{{ model.total_price|format_currency('UAH', locale='uk') }}</td>
</tr>
{% endif %}
{# Знижка до замовлення — тільки якщо є #}
{% if model.discount_amount %}
<tr>
<td colspan="6" class="text-right">Знижка:</td>
<td class="text-right">{{ model.discount_amount|format_currency('UAH', locale='uk') }}</td>
</tr>
{% endif %}
{# Доставка — тільки якщо є #}
{% if model.shipping_price %}
<tr>
<td colspan="6" class="text-right">Доставка:</td>
<td class="text-right">{{ model.shipping_price|format_currency('UAH', locale='uk') }}</td>
</tr>
{% endif %}
{# Фінальна сума — відображається завжди #}
<tr>
<td colspan="6" class="text-right"><strong>Сума:</strong></td>
<td class="text-right"><strong>{{ model.grand_total|format_currency('UAH', locale='uk') }}</strong></td>
</tr>
</tbody>
</table>
{# ======================================================= #}
{# БЛОК: ПІДВАЛ — загальна кількість, сума і підпис #}
{# ======================================================= #}
<br /><br />
<table class="table-sum width100">
<tr>
<td colspan="2">
Всього найменувань {{ model.products|length }}, на суму {{ model.grand_total|format_currency('UAH', locale='uk') }}
</td>
<td></td>
</tr>
<tr>
<td>Дата: <span class="label underline">{{ model.created_at|date("j") }} {{ mnths[model.created_at|date("n")] }} {{ model.created_at|date("Y") }} р.</span></td>
<td>Підпис постачальника: ____________________</td>
<td></td>
</tr>
</table>
</div>
</body>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html, body {
height: 100%;
}
body {
font-size: 16px;
line-height: 1.3;
min-width: 320px;
font-family: sans-serif;
overflow-x: hidden;
}
.container {
margin-right: auto;
margin-left: auto;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.label {
font-weight: bold;
}
.underline {
text-decoration: underline;
font-style: italic;
}
.big-text {
font-size: 18px;
}
.width100 {
width: calc(100% - 2px);
}
table {
border-collapse: collapse;
border-spacing: 0;
height: auto;
}
table td {
padding: 5px;
}
table th {
background: #d4d4d4;
}
/* Рамки для таблиці товарів */
table.border thead th,
table.border thead td,
table.border tbody td {
border: 1px solid black;
}
table.border th {
padding: 20px 5px;
}
table.border td {
padding: 5px;
}
table.table-sum {
margin-top: 7px;
}
table.table-sum td {
padding: 3px 5px 3px 15px;
}
/* =============================================
РОЗБИТТЯ НА СТОРІНКИ
============================================= */
/* Заголовок таблиці повторюється на кожній сторінці */
table.border thead {
display: table-header-group;
}
/* Рядки tbody не розриваються між сторінками */
table.border tbody tr {
page-break-inside: avoid;
break-inside: avoid;
}
/* Підвал тримаємо разом, не відривати від підсумків */
table.table-sum {
page-break-inside: avoid;
break-inside: avoid;
}
</style>
</html>2. Товарний чек №2
3. Видаткова накладна
4. Рахунок на оплату
5. "Лист на митницю" (при відправці за кордон)
6. Proforma Invoice для відправки закордон (митний інвойс)
Last updated