У запиті створення чеку є можливість змінювати параметри майбутньої візуалізаці чеків, а саме:
- вміст "банеру" у шапці та підвалі чека
- фон сторінки
- стиль вмісту чеку
- логотип (тільки для кас всієї організації - через веб-портал → Налаштування → Графічний чек → Редагувати)
¶ Приклад
"custom": {
"html_global_header": "<div style=\"background: aqua; padding: 6px; text-align:center;\">Header</div>",
"html_global_footer": "<div style=\"background: aqua; padding: 6px; text-align:center;\">Footer</div>",
"html_body_style": "background: linear-gradient(180deg, #005bbc 0%, #ffd600 100%);",
"html_receipt_style": "background: white; color: #005bbc; box-shadow: 0 4px 16px rgba(0,0,0,0.2);",
"html_ruler_style": "color: red;",
"html_light_block_style": "color: #ffd600;",
"text_global_header": "#< Мій бренд\n===\n#> Дякуємо!",
"text_global_footer": "===\n# Підсумок\n---\nДо зустрічі!"
}
¶ Роз'яснення полей
html_global_header/html_global_footer— банери у шапці та підвалі чеку (HTML/PDF).html_body_style— стиль або фон сторінки.html_receipt_style— стиль контейнера чеку.html_ruler_style— стиль роздільників.html_light_block_style— стиль світлих блоків (підвал, клітинки сум/кількості).text_global_header/text_global_footer— банери для text/PNG рендерів.- Логотип для всієї організації задається через веб‑портал (Налаштування → Графічний чек → Редагувати) і підхоплюється як
branding.logo.
У коді це відображено класом OrganizationBranding (checkbox_receipt/models/document.py), який передається в генератори та рендери через BaseDocumentGenerator.
¶ Обмеження HTML
- Дозволені теги:
div, span, br, h1, h2, h3, h4, h5, p, a, ul, ol, li, em, b, i, u, strong, strike, img, style. - Дозволені атрибути:
style, href, src, alt, class, height, width, target. - Контент має бути загорнутий у один кореневий елемент, наприклад
<div>…</div>. - Перевірка/ескейпінг:
validate_custom_htmlтаsafe_render_template(Jinja sandbox) відкидають небезпечні конструкції.
Правильно:
<div> <p></p> <p></p> </div>
Не правильно:
<p></p> <p></p>
У наведеному прикладі:
html_global_header, html_global_header- прямокутник з фоном та текстом вирівняний по центруhtml_body_style- фон сторінки, у наведеному прикладі це градієнт, але може бути наприклад фон чи зображенняhtml_receipt_style- стиль блоку з чеком, у цьому прикладі змінено колір фону, тексту, додано світіння та прибрано заокругленняhtml_ruler_style- роздільник з зірочкамиhtml_light_block_style- стиль світлих блоків, це весь підвал чеку та клітинки з вартістю та кількістю
Наприклад в текстовому чеку можна встановити свої Header/Footer
- Заголовки: рядок, що починається з
#…######, задає розмір. Приклади:# Заголовок— великий, центр.#< Ліворуч— великий, вирівнювання вліво.#> Праворуч— великий, вирівнювання вправо.- Кількість решіток від 1 до 6 змінює розмір.
- Службові префікси:
_ELTC=Текст→ еквівалент# Текст(великий, центр)._ELT=Текст→ еквівалент#< Текст(великий, ліворуч).
- Роздільники:
- Окремий рядок з
===(3+ знаків=) → жирний роздільник. - Окремий рядок з
---(3+ знаків-) → звичайний роздільник.
- Окремий рядок з
Ці правила застосовуються до text_global_header, text_global_footer, body_footer (HTML/PDF через фільтр md) та будь‑яких multiline_text викликів.
.png)
У шапці та підвалі помітно 2 рядки тексту та роздільники різної товщини.
¶ Шаблонізація банерів
Поля банерів підтримують шаблонізацію через Jinja2 (у sandbox‑режимі):
html_global_header,html_global_footertext_global_header,text_global_footer- також
branding.title(заголовок сторінки/вкладки для HTML)
¶ Контекст (дані для підстановки)
Під час рендеру банера бібліотека підставляє значення з receipt.context. Окрім контексту, який ви передасте самостійно, у Checkbox зазвичай доступні стандартні атрибути (наприклад: receipt_id, fn (ФН ПРРО), created_at — дата/час створення).
Приклад (HTML‑чек можна подивитися у браузері)
¶ Приклади синтаксису
-
Змінні:
Дякуємо! Чек № {{ receipt_id }} -
Умови:
{% if fn %}ФН ПРРО: {{ fn }} {% endif %} {% if fn %}ФН ПРРО: {{ fn }} {% else %} Інший код {% endif %} -
Цикли:
{% for item in items %}• {{ item }}{% endfor %}
Якщо у Вас виникли питання, Ви знайшли помилку або хочете запропонувати вказати додаткову інформацію в інструкціях - Ви завжди можете зв'язатись з нами зручним для вас способом.